- Kedden érkezik a Galaxy S25 Edge
- iPhone topik
- Honor Magic7 Pro - kifinomult, költséges képalkotás
- Honor 200 Pro - mobilportré
- Fotók, videók mobillal
- 45 wattos vezeték nélküli töltés jön az új iPhone-ba
- VoLTE/VoWiFi
- Bemutatkozott a Poco X7 és X7 Pro
- Milyen okostelefont vegyek?
- Xiaomi 14T Pro - teljes a család?
-
Mobilarena
JavaScript != Java (A JavaScript nem összekeverendő a Javával, két különböző programozási nyelvről van szó!)
Új hozzászólás Aktív témák
-
K1nG HuNp
őstag
jap, aztan a csak JShez erto code monkeyek miatt ilyen szar a magyar weboldalak tulnyomo tobbsege
nincs semmi bajom a programozni vagyok emberekkel es nem akarok gatekeepelni sem, szimplan csak nem ertem mit varunk ettol a hozzaallastol, persze kezdj csak high level nyelven, a tobbit ugysem kell ertened... ja
-
#8111
K1nG HuNp
őstag
BigBlackDog
#8108
K1nG HuNp
őstag
válasz
BigBlackDog
#8108
üzenetére
az eg vilagon semmi koze az OOhoz a typescriptnek
-
-
K1nG HuNp
őstag
"nyers" CSS-ben írtam és írom most is a design systemet Reactos frontendre, köszi nem kérek semmilyen bullshit absztrakciós réteget, a végén úgyis ott kötnét ki hogy valamilyen random -webkit prefixes cucchoz sima csst kellene írnom. Teljesen értelmetlen a tailwind és társai, de én még a sassról is igy vélekedek. Csak lusták megtanulni az emberek a csst. Griddel 3 sor a legtöbb layout, reszponzívan.
-
K1nG HuNp
őstag
teso a microsoft es a wallmart havi 50k dolcsikat fizetget az end to end SaaS cuccert amit itthon bpn kalapalunk, az egyetlen masik nyelv a JSen kivul ami szerepel a repoban az SQL
hagyjuk mar ezt a nyelv temat, irjad kotlinban nyugodtan a jsedet, teljesen ertelmetlen, ha nagyon tipusokra vagy ott a TS, de az is a legtobbszor csak lassitja a fejlesztest.
-
K1nG HuNp
őstag
Ha mar megmutatjuk mi anti-pattern akkor ne mas anti-patternekkel tegyuk
Nem egy input vagy egy gomb dönti el magáról, hogy mennyi space van maga körül, mert így sosem lesz újra felhasználható a komponens. Az inline stylekkel ugyszint semmi baj nincs, objektiven gyorsabb egy weboldal betoltese ahol nem egy bazinagy css fajlban szerepel minden, de továbbmegyek, a legtobb css-in-js solutin is "inline" style attributumokkent irodik es run/build-time valik style tagekke. -
K1nG HuNp
őstag
Ha letiltod a javascriptet a bongeszodben akkor az SPA-k konkretan meghalnak mig a next es gatsby mukodik + nem index.html lesz az eredmeny, nezd meg a bongeszod network tabjen, egyenkent cachelheto kulonallo html fajljaid vannak, pont mintha kezzel irtad volna oket.
Tultargyaltuk
-
K1nG HuNp
őstag
Nem lesz SPA, az SPA-kban a routingot a React oldja meg, a Next.js es Gatsby eseteben kulon fajlod van minden pathodra.
Pl: SPAnal a weboldal.hu/asd eleresehez le kell jonnie a teljes hobelebancnak mire beroffen a router es atrak a /asdra.
Az gatsbynal van alapbol fajlod a /asd endpointra amit egybol tudsz lekuldeni, nextnel is same, esetleg ha SSR-t valasztottal akkor varni kell meg a szerver megcsinalja es lekuldi
Az hogy hidratalas utan lesz meno JS routered amiel weblap ujratoltes nelkul tudsz maszkalni az nem azt jelenit hogy SPA lenne az oldalad, az a React velejaroja
-
K1nG HuNp
őstag
Ezt miota hazakuldtek Pestrol korona miatt es szar a netem hatvanyozottan ateltem:
Egy weboldalnak nem kellene masodpercekig full page loadereket a kepedbe tolnia. Elkepesztoen rosszak a First Meaningful Paint es Time to Interactive szamok az osszes SPA-nal.
Szandekosan irtam, weboldalt, a webappoknak termeszetesen nagyon nincs mas lehetoseguk, ott szukseg van a teljes js bundlera elso megjelenites elott, bar a PWA ott is eleg jo megoldast kinal, lasd: twitter.
Maradva a CRA-nal: miert szednel le olyan JS kodot ami olyan aloldalhoz tartozik amit lehet sosem latogatsz meg, es teszed ezt minden oldallekeres soran?
A Gatsby es a Next is ezt ugy kuszoboli ki, hogy egyreszt aloldalankent code splittel, masreszt az alapvetes a statikus html kesobbi rehidratalasa reactel, azaz lemegy az usernek a skeleton, a time to first byte teljesen megegyezik azzal mintha semmi JS kod nem lenne az oldalon, majd amint vege a rehidratalasnak ott vagy egy teljes Reactel
tisztazva:
Server Side Rendering: http keresre a szerver on-demand legeneralja a html-t es lekuldni.
Static Site Generation: build idoben, azaz otthon a te gepeden lefut a react statikus html, js, css fajlokba exportalas es ezt te csak felrakod CDNre.Mindket esetben ugyan az a vegeredmeny, eloszor egy html filet kapsz jobb esetben beinjektalt critical css-el, ez valszeg ki is teszi az elso TCP kort, es csak kesobb kapod meg a JS kodod ami megint legelso korben rehidratal.
-
K1nG HuNp
őstag
én
let-es vagyok, kevesebb karakter :pRemélem tetszenek kattingatni a Next.js-t, eleg durva dolgok jottek most
En most greenlightot kaptam cegnel, hogy osszedobjak egy alap projektet, amivel levaltanam a mostani korosodo boilerplatet ami meg jQuerys alapokon nyugszik mivel rajottunk, hogy mire behuzzuk a jQueryt es azt a par libet ami meg kell ugyan ott van a JS footprintunk mintha egy reactet tolnank, cserebe kezzel kell forditani a css-t es picit kaka a dev experience.
Annak nagyon orultem pl, hogy kezd leesni embereknek, hogy az SPA szar UX.
Kb jottunk egy teljes kort, en pl sosem irtam phpt de onboarding hetemen abban kellett site buildelnem, es volt valami elegancia abban hogy felpakolsz egy php filet ftpre es fut es atom gyors 123kB js nelkul isCRA-t pl mar ne hasznaljon senki, aki arra vetemedne, hogy mostanaban Reactozik, es mostmar a Gatsbyba is szerintem felesleges sok idot foccolni, tud mindent a Next 9.3 ota, kissebb bundlesizeval, kb 0 proprietary dologgal es tobb lehetoseggel.
-
K1nG HuNp
őstag
visszaterve picit meg a let es const reszelgetesre: a constot is teljesen feleslegesen hasznaljak az emberek
az egyetlen hely ahol azt fogja csinalni a const mint amire szamitasz mas nyelvekbol az a const SOME_VALUE = 12;aconst obj = {};pontosan ugyan ugy modositgathato mint a let-es baratja, cserebe jo megteveszto -
-
#7660
K1nG HuNp
őstag
instantwater
#7659
K1nG HuNp
őstag
válasz
instantwater
#7659
üzenetére
En ezzel tisztaban vagyok, semmilyen titkositast nem is akartam, nem latom ertelmet. En a sajat api endpointomat akartam vedeni a verpistikektol meg az olyan szintu kihasznalastol h a qr kod linkjet elkuldi a haverjainak akik ott sem voltak.. 1 napos event es nem a kiberbiztonsag van a fokuszban
-
K1nG HuNp
őstag
válasz
sztanozs
#7657
üzenetére
marmint? az url querybe rakott plain text emailnel jobb
mik az ellenervek egy percenkent lejaro JWT-re?"JSON Web Token (JWT) is a compact, URL-safe means of representing claims to be transferred between two parties. [...] enabling the claims to be digitally signed or integrity protected with a Message Authentication Code (MAC) and/or encrypted."
-
K1nG HuNp
őstag
válasz
K1nG HuNp
#7655
üzenetére
Megoldás egy URL-be ágyazott JWT token lett, ugyis erre valok
marmint itteni utolso bekezdes alapjan, mostmar csak vhogy a lejaratukat kell megoldani, hogy frontenden automatikusan generalodjanak-frissuljenek, azaz ha nyitva a telefonod kb 2 percig akkor mar 2 kulon jwt-t lattal. -
K1nG HuNp
őstag
Na hali, kellene egy kis help
Adott egy kis eventre egy app, mindenki szepen belep OAuth-al, van kb 100 szervezo, OAuthbol kapom az infot h szervezo-e az user vagy sem.
Ennek kellene tortennie: alap felhasznalo felmutatja a profil oldalan lathato QR kodot az egyik szervezonek, annyi a lenyeg hogy ennek be kell kerulnie az adatbazisba, hogy PISTI sima user volt ELEMER szervezonel. (de ha van jobb otlet a flowra akkor irjatok, semmi sincs kobe vesbe meg, sot ram van bizva hogyan oldom meg ha egyaltalan megoldom)
Problema: mivel en semmilyen adatot nem tarolok az userjeimrol, eddig a QR kod
/api/activate?mail=ennyi volt, itt a mail query pedig az adott belepett user oauthjabol szarmazo email cim volt.Ez szep es jo, proof of conceptkent lefutott az egesz folyamat, viszont para, hogy nem kellene publikban lennie az email cimeknek, hogy ne lehessen visszaeles a szervezoi oldalrol.
Tok jo, ravagtam hogy persze hat rakjuk az user id-t az emailbe, azzal nem sokat ernek es nem kell ez 100% atom biztosra ugysem a dolog szoval ez mar siman jo megoldas is lenne..
.. csak ugye semmit nem erek en a backenden az user id-vel, nem tudom az oauthnal bevaltani az user id-t az user nevere, mailcimere stb amire kesobb szukseg lenne..
Mi lehetne itt a jo megoldas? En hirtelen ket dologra gondoltam:
User belep oauthal, es en egybol a sajat adatbazisomba lementem az osszes adatat, a qrkod mar az en adatbazisom alapjan generalodik, ez kb megold mindent de kicsit nyakatekert..
Masik egesz meredek dolog amire gondoltam, hogy az user access tokenjet jwtvel vagy hashelve vagy akarhogy bele rakom az aktivacios urlbe, mint ahogy fent a mail.
TL;DR: hogyan tudok ket egymastol teljesen fuggetlen A illetve B kliens kozott ugy adatot tovabbitani, hogy a legvegen B kliensnek A+B adatait kell odaadni a backendnek?
-
#7631
K1nG HuNp
őstag
instantwater
#7630
K1nG HuNp
őstag
válasz
instantwater
#7630
üzenetére
gyulolom a vendor lock-int meg azt ha azzal hogy X ceg cuccait hasznalom csak ahhoz fogok erteni es semmi mashoz..
zeitnel viszont az osszes projekt oss, ok maguk is ezzel irnak mindent es a legtobb cuccuk csak wrapper (sot mind..)
next.js -> bleeding edge react nehany logikus standarddal amik segitenek h ne lodd labon magad, (meg SSR....
)now -> aws lambda elabsztrahalva, de csak annyira h sose kelljen megnyitnod az aws oldalat, ettol fuggetlenul a kod migralhato lenne fuggvenyenkent 2 perc munkaval awsre.
magaert beszel szerintem hogy irom a react kodot, pusholom githubra, deployolodik, lefutnak az api es a puppeteer tesztek es ehhez egy sor setup/ci/cd-t sem kell irnom
-
#7629
K1nG HuNp
őstag
instantwater
#7625
K1nG HuNp
őstag
válasz
instantwater
#7625
üzenetére
zeit / now -ot hasznalok amivel literalisan egy /api mappat kell letrehoznod es mehetnek is bele a lambda functionok js/go nyelven
belepesre auth0, db mongodb de most akarok ranezni a faunadbre
-
K1nG HuNp
őstag
válasz
K1nG HuNp
#7605
üzenetére
Ne hagyjatok le a node.js setHeader fv string alapu cookie setterebol a httpOnly utan a ;-t es akkor boldogok lesztek
problem solvedLehet megirom elso medium cikket, mert netet bongeszve sokan szptak ezzel, viszont ha ez a par dolog amire idokozben rajottem/leesett egy nagyon durvan clean code authot lehet csinalni, frontend kodban pontosan 0 sorral
(se cookie savelgetes fn, se token kudozgetes, minden bongeszon kivul tortenik) -
K1nG HuNp
őstag
JWT-t tarolok httpOnly cookieban ami megoldotta minden authos gondom, eddig ahany frameworkot es libet hasznaltam authra ez a "kezzel" (jwt, bcrypt es ket sornyi setheader backenden) a legszebb. Egyetlen problemaba utkoztem, ami pedig a SSR next.js-el van, itt az oldal getInitialProps fvnye tolna egy apihivast de olyat amihez kellene az user is, az viszont httpOnly cookieban tarolodik es teljesen elerhetetlen barmilyen js kod szamara...
Mennyire gaz spinning loadereket hasznalni 2019ben? Marmint reszben ezert is hasznalok next.js-t hogy SSR mellett egy teljes oldalt szolgaltassak elso renderre is, de akkor most az authomat nagyon csunyan at kellene rakni sima cookieba + header tokenekbe, hogy user fuggo oldalakat is teljes egeszeben ki tudjak tolni elso renderen.
-
K1nG HuNp
őstag
válasz
martonx
#7580
üzenetére
semmi komplex
csak most picit chillesebb a felev es raerek par cuccot heggeszteni githubomra. bejott a serverless, eddig ezzel nem foglalkoztam szoval most egy projekt erejeig legalabb de belekostolok. igazabol az authentikacion kivul eddig minden tokre straight-forward. az SSR + serverless komboban igy sessionok nelkul viszont most picit kuzdok az authal vagyis kuzdenek ha nem lenne firebase rahuzva a temara, de mindenkeppen meg akarok szabadulni az egesz firebase tematol meg ha kenyelmes is konkretan behuzni 3 perc alatt a hibatlan oauth integralast
-
K1nG HuNp
őstag
válasz
martonx
#7578
üzenetére
Valoban nincs sok, viszont kb 0 overheadja van annak hogy kihasznalom a next.js/now serverless funckiojait es akkor igy csak szepp a kliensben a fetch("/api...") mint az egesz adatbazismokolas odateve random ket react komponens koze, meg ha onmagaban o sem tobb mint par masik fetch/request
-
K1nG HuNp
őstag
Ha nem en futtatom a db-m, es igyis-ugyis resten keresztul kommunikalok vele akkor van ertelme sajat serverless apit osszepakolni, hogy ne a client-side kod legyen ronda?
Tehat:
kliens -> sajat serverless funckiok -> adatbazis resten (mongodb atlas pl)vagy mar mindegy ha nem absztrahalom el a dolgokat es mennek az adatbazisos restes cuccok egybol a kliensbe?
-
K1nG HuNp
őstag
next.js + serverless funkciok + now
server side / static html generalas, teljeserteku backend api es mindez megy egy fennakadas nelkul, 1 commandal.. kicsit eros..volt anno egy firebases projektem, az is serverless volt csak, de ahhoz az clihez kepest sokkal durvabb a zeit okoszisztemaja
-
#7563
K1nG HuNp
őstag
instantwater
#7562
K1nG HuNp
őstag
válasz
instantwater
#7562
üzenetére
.
-
#7561
K1nG HuNp
őstag
instantwater
#7560
K1nG HuNp
őstag
válasz
instantwater
#7560
üzenetére
asszem megvagyok, eddig ugye plain jsben toltam a graphqlt es mappak alapjan szet volt szedve a query/mutation/type amit utanna osszemergeltem egy nagy schemaba.
most viszont a TS classok es a typegoose / typed-graphql dekoratorait ha ossze tudom hozni akkor elvileg lesz single source of truthom amibol jonni fog egyreszt a mongodb schema illetve a graphql is
, megprobalok edzes elott osszerakni valamit -
K1nG HuNp
őstag
válasz
Dißnäëß
#7548
üzenetére
Csak mert valamelyik ceg egy adott problemajanak megoldasara valami uj frameworkot ir es az uj projekteket mar erdemes valami frissben csinalni attol meg a 2013ban irt frontend kodok is teljes mertekben megalljak a helyuket, nekem az egyik kedvenc framem az emberjs ami elvileg mar outdated megis most irta az apple az egesz music appjat emberben.
A frameworkok ezkozok, nem kell semmit ujra atallni 2-3 ev utan, ez bs. A JS/web tudasod konkretan 1:1ben at fogod tudni ultetni, nekem anno az elso melohetem eleg volt egy a reactrol atallni a vuera ugy hogy szinte teljes gozzel, produktivan dolgozzak utana benne. Az meg a masik, hogy most elegge van defacto mindenre, ts, react, graphql. most hogy ezeken belul te nextet vagy semmit, styled components vagy styled jsxt, apollot vagy prismat hasznalsz az mar teljesen preferencia es de ez szerintem jo is, hogy minden problemadhoz talalsz egy megfelelo ezkozt.
Ha te hasznalsz most egy adott dolgot es nem 15 soros kodokat tolsz benne akkor hamar elojonnek azok a hianyossagok amiket legtobbszor ezek a frissitesek is orvosolnak, tehat ilyen szempontbol en pl mindig jol fogadok egy uj reviziot, egy updatet, legrosszabb esetben nem migralok at ra mert nem kell az a par ujdonsag.
na de am ne vedd kezpenznek amit irok, tavaly meg golya voltam egyetemen es eddig 1 melohelyem akadt osszvissz :p
-
#7544
K1nG HuNp
őstag
instantwater
#7543
K1nG HuNp
őstag
válasz
instantwater
#7543
üzenetére
most google kozben feljott, de ahogy neztem nekem most kicsit agyuval verebre lenne, a dependenciaim nem kulonbozoek / nem zavar az egy darab package.json fajl, szimplan a jest/babel szarakszik
-
K1nG HuNp
őstag
Jestet konfigolt mar esetleg valaki? Most azzal akadt problemam, hogy van egy monorepom, create-react-app felel a reactos reszert es van egy api mappa amiben a backend talalhato
a teszteket akarom valahogy 1 kommand ala rakni mert jelenleg ha rootbol hivok egy jestet akkor ugye az nem lesz bekonfigolva reactre es igy minden reactos teszt bukik. ha a react-scripts tesztjet hivom az tok jo, minden reactos teszt lefut de ugye azok csak a reactos tesztek, az api mappa egy szinten van a react mappajaval ezert az apis teszteket a react-scripts nem latja...
-
#7520
K1nG HuNp
őstag
hiperFizikus
#7518
K1nG HuNp
őstag
válasz
hiperFizikus
#7518
üzenetére
de tenyleg, inkabb ne is irj semmi meset, beraksz valami ERTELMES formazasban kodot, pastebin, akarmi es odairod 2 mondatban, hogy sziasztok, miert ad vissz 3at ez a fuggveny amitol en az szeretnem hogy 8-at adjon..
tenyleg szivesen segitunk mert azert van a topik de igy nehez.
-
K1nG HuNp
őstag
https://twitter.com/reactjs/status/1187411505001746432?s=20
Megjelent experimentem a React Suspense..
Nagyon durva innovaciot tolnak az fbnelRoviden tomoren: nincs tobb "isLoading", kevesebb boilerplatevel lehet sokkal szebben kifejezni uiban a toltest, fallbackekkel esetleg error handling komponensekkel. Pont ezzel tokoltem par kommentel feljebb vueban..
-
K1nG HuNp
őstag
válasz
martonx
#7455
üzenetére
adott volt eddig is 2 komponens, egy placeholder amiben van placeholder kep, szoveg stb, meg a sima eredeti komponens. problema az volt hogy addig volt a placeholder mutatva amig megjott apibol az adat. ezek utan egybol atvaltott rendes komponensre, de ugye itt meg a linkelt kepek nem toltottek be.
na mindegy kicsit hacky lett mert eddig szepen lefele folyt a data, a state is egyertlemu helyen volt, most viszont a child (eddig buta) komponensnek is felfele kell szolnia, hogy minden kep kesz es csak ezutan allitja a parent is a loadingot falsera.
csak ugye egy kep addig nem tolt amig nem visible, ergo v-ifelve sosem lesz jo, css visibility: hidden kellett neki.
vegeredmeny am: https://booktrckr.firebaseapp.com/search
-
K1nG HuNp
őstag
na kozben osszehekkeltem, mukodik ahogy szeretnem csak az a baj, hogy most nem tudom a vue keretein belul tartani. eddig v-if, v-else modon volt a komponensek megjelenitese, viszont most orokre a tolto komponenst mutatna, mert a kepek addig nem loadolnak mig nem visiblek
megoldaskent a loader v-ifelve maradt, a rendes komponens viszont styleban kapott egy hiddent amig be nem toltott az osszes kep, amire amugy van nativ html event mint kiderult -
K1nG HuNp
őstag
most vagy 3 honap kihagyas utan volt alkalmam leulni az egyik kis hazi projektemhez es feltunt egy dolog instant amin eddig sosem gondolkodtam / nincs ra megoldasom hirtelen.
adott egy kereses page ami egy adott apiban keres, talalat eseten betolti az adott cumokat. van egy szep skeleton animaciom mert ugye elore tudom milyen kontenerekben lesz a szoveg meg a kep stb. a problemam az, hogy pl egy keresesi talalatban van 5 sor szoveg meg 1 kep, ekkor mivel az adat valojaban mar megjott az apitol a toltes state offolodik, megjelenik a content, viszont a contentben a kep mint egy <img src"..."> szerepel, ami most elkezd tolteni.
mit kellene csinalnom, hogy az eredeti toltes magaba foglalja az adott kepek bevarasat is?
szerk:
ja amugy igen, Vue.js, a state alapjan jelenik meg vagy a tolto komponens vagy a rendes. apitol amikor a fetch lekeri az adatot akkor sima isLoading = false, a szoveg szepen meg is jelenik, a kepek viszont most hogy lassu volt a netem, meg vartak vagy 2 mp-t es emiatt ugye full feherseg volt a helyukon. -
K1nG HuNp
őstag
válasz
lajszer
#7444
üzenetére
index.html 612. sor:
var d = new Date(Date.now() + 1000 * 60 * 60 * 24 * 248);248 jelenti a hatralevo napokat.
itt ugye annyit csinalunk hogy letrehozunk egy datumot a jenlegi ido + X miliszekundumbol. a miliszekundumokat igy szorzassal erdemes felirni mert kicsit atlathatobb.
sok boldogsagot amugy
-
K1nG HuNp
őstag
válasz
Chartreux
#7440
üzenetére
Ja amugy bocsi mar kicsit faradt vagyon enis, tokre irtam dolgokat csak a lenyegre nem valaszoltam.
Szoval:
pont jo a kodod ahogy van, annyit csinalj hogy a te altalat leirt dolgokat tedd bele egy fuggvenybe es azt hivd meg, igy nem lesz valtozod a globak namespacen, hanem minden a fuggvenyen belul lesz. Magyarazat a miert mukodikre az elozo kommentemben. -
K1nG HuNp
őstag
(katt ra ha kicsi lenne, bocsi de nem volt kedvem tokolni a phn kod formazgatassal)"Closure is when a function is able to remember and access its lexical scope even when that function is executing outside its lexical scope."
YDKJS ide tartozo resze -
#7430
K1nG HuNp
őstag
hiperFizikus
#7429
K1nG HuNp
őstag
válasz
hiperFizikus
#7429
üzenetére
jaja, jol teszed hogy titokban tartod a source code-ot. a vegen meg elcsenne valaki eloled a nobelt
-
#7423
K1nG HuNp
őstag
hiperFizikus
#7422
K1nG HuNp
őstag
válasz
hiperFizikus
#7422
üzenetére
amugy mit ertunk "oldal" alatt egy source codeban? mostmar komolyan erdekel
szerintem csinalj neki egy weblapot, egy ingyenesen hasznalhato demot amit kiprobalhatnak a juzerek meg egy kis social media marketing es sinen leszel ha valoban ennyire patent cucc.
-
K1nG HuNp
őstag
const [createAnswer] = useMutation(CREATE_ANSWER, {
update(cache, { data: { createAnswer } }) {
const { question } = cache.readQuery({ query: GET_QUESTION, variables: { id: props.match.params.questionid } })
cache.writeQuery({
query: GET_QUESTION,
data: {
question: {
...question,
answerCount: question.answerCount + 1,
answers: [...question.answers, createAnswer],
},
},
})
},
})egész durván kifolyik a szemem ettől
életemben nem használtam ennyi objectet mint amit GraphQL / apollohoz kell.A legszebb hogy inkább refetchelném a francba az egészet egy adatmódosítás (itt egy uj kerdes pl) után, de mint kiderült olyat csinálni nagyon szembemegy az user élménnyel. Így ugye cacheba írással minden instant
-
K1nG HuNp
őstag
Dolgozik itt valaki nagyobb csapatban ahol esetleg használnak GraphQL-t?
Nálunk melóhelyen mindenki fullstack-ként próbálja megoldani az adott featuret, magában, backendtől frontendig, így annyira nem látnám értelmét a graphql használatnak (plusz már elég régi futó projektek, nem fogunk hirtelen váltani).
Viszont ahogy itthon próbálgatom és használom saját kis cuccoknál, elég durva absztrakciót biztosít a front-endeseknek, hogy konkrétan semmit sem kell tudniuk az adatról, csak elkérni abban a formában amelyre pont szükség van, se több se kevesebb.
Akivel eddig beszéltem a technológiáról az volt a véleménye, hogy ez megint csak egy javascriptes bandwagon ami 3 hónapig fancy meg trendi, de igazából semmi újat nem hoz
Picit tényleg durva az, hogy a JS ennyire pörögni tud és kéthetente kijön az új trendi és menő lib/framework, de én pont ezért tartom az egyik legjobb közösségnek azt ami kialakult a nyelv körül. Bár ne lenne 300 euro egy JSConf BP jegy...
-
K1nG HuNp
őstag
Webfejlesztés során eddig különböző böngészők kapcsán csak a CSS okozott fennakadást számomra.
JS-ben egy ilyesi jött szembe, az pedig a String.contains() fv amit valamiért csak a mozilla motorja támogat. Persze egy sima indexOf használható bárhol helyette.A V8 beteg gyors, okkal használja a Node is motorként, de amúgy míg ezt a kommentet nem írtam meg nagyon eszembe sem jutott volna azon gondolkodni, hogy más js motoron vajon jó-e a kódom, szerintem neked sem kell.
-
#7316
K1nG HuNp
őstag
hiperFizikus
#7314
K1nG HuNp
őstag
válasz
hiperFizikus
#7314
üzenetére
Az első megoldásod teljesen helyes, főleg, hogy egy mezei onClick-ről beszélünk.
Szimulálhatsz eventeket JS-ben, de szerintem nem akarsz.
Az eventek kapcsán szerintem azt kell megérteni, hogy html elemek váltják ki őket és te a JS kódodban fel tudsz rájuk iratkozni, az esetek 99%-ban így foglalkozunk az eventekkel, nagyon ritka amikor saját, szintetikus eventeket hozunk létre, vagy az előbb belinkelt módon JS-ből triggerelünk browser eventet.
Feliratkozni egy html elem eventjére sima JS-ben az addEventListener fv.-el szokás, vagy inline, a html-tagbe beleírni az eventet és azt a függvényt amelyet szeretnél meghívni az event megtörténtekor (ahogy azt tetted is az első példádban).
rikxjeee
Ez mi a ........
-
K1nG HuNp
őstag
válasz
martonx
#7289
üzenetére
v-modelt használunk komponensek között is. Pl van egy "regisztracio" es egy "belepes" oldalad, mindkét helyen ugyan azt a form komponenst használod. Ezért a form komponenst úgy kell megvalósítani, hogy kap egy value propot, mert ugye ezt adja a v-model, majd a created() lifecycle hookban saját magának cloneDeepeli, hogy ne módosítsa az oldaltól kapottat, csak majd amikor rámentél pl a form submitra.
Form submitnál pedig $emit-tel felfelé szólsz, hogy az oldal v-modelje érzékelje h van input és frissítsen.
Ez az egész arra megy ki, hogy a v-model interfészét tudjuk használni, de hogy ez ilyen 2 szint mélységben már egész nagy fejfájást okoz
Ja és akkor ezt még megspékeled egy watch-al, amikor azt nézi a komponens, hogy felette nem törölték-e/módosították az adatot, mert ha igen akkor neki is frissülnie kellene, de ugye ez a fent említett másolgatás miatt nem történne meg automatikusan/reaktívan.
-
K1nG HuNp
őstag
Életem első (rendes)munkában töltött hete után eléggé vegyes érzéseim támadtak a vue-vel kapcsolatban.
Java backend fölött toljuk az összes projektben kivétel nélkül a vue-t.
A slotok nagyon haszosak és szép kódot eredményeznek, de a formok kezelésénél és a two way data bindingnal eléggé elpattant bennem ez-az. Vagy legalábbis nekem már kilóméterekről bűzilk az a pattern amihez konstans lodash cloneDeepek kellenek, csak hogy biztos jók legyenek a propok....A typescriptelt reacthez szokott kis lelkemnek azért okoztak fájdalmat ezek a random sztringes mapolások meg prop interfész dolgok.
Ezeken kívül még mindig jóval szebb a komponens layout, nem lesz spagettikód JSX-ed, (akármennyire is hiányzik néha az ereje) és szerintem a styleolás megoldásában még mindig a vue a legjobb/leglogikusabb.
Marad nálam és remélem industryban is standard a react de egy kis frissességnek nem rossz framework a vue.
-
K1nG HuNp
őstag
Kicsit langyosítva itt a harcokat, aki már dolgozott front-end fejlesztőként elmondaná, hogy most akkor félig designernek kell lenni, vagy csak nem árt ha legalább azt észreveszed ha szarul néz ki az egész?
Én ugye most azért választottam délutáni elfoglaltságnak a frontendezést mert beleuntam a c/c++ command lineos progházikba, de folyamatosan előjött ez a "frontendes vagy? hahah szoval nem tudsz egy rendes algoritmust megirni haha" stigma. Amit valahol értek, hogy honnan jön, és én sem leszek szerintem még sokáig ennyire fókuszált a frontenden, mert mint az előző kérdésemből kiderült nem sok közöm van az ux / ui designhez és hányok a csstől 100 sor felett.
Nektek ki a front-end developer? Meddig ér a keze? Vagy tényleg ennyire gyakori az a dolog, hogy mindenhová fullstackeket keresnek, így ha odaadnak az adott embernek egy funkciot hogy implementalja akkor azt az elejétől a végéig meg tudja oldani?
-
K1nG HuNp
őstag
Nekem a Reactal kapcsolatban az overengineeringel van ki a
öm.
Mai példám rá:interface ListItem {
to: string,
icon: IconProp,
text: string
}
const SpreadListItems = (array: ListItem[]) => {
return array.map((item, index) => (
<li key={index}>
<Link to={item.to}>
<Icon icon={item.icon}/>
{item.text}
</Link>
</li>
)
)
};
const MenuLinks: ListItem[] = [
{to: '/search', icon: 'search', text: 'search'},
{to: '/favorites', icon: 'heart', text: 'favorites'},
{to: '/cart', icon: 'shopping-cart', text: 'cart'},
{to: '/login', icon: 'sign-in-alt', text: 'sign in'}
];
... majd komponensen belül ...
{SpreadListItems(MenuLinks)}Szerintem nem egészséges az, hogy mindent ennyire absztraktan kell csinálni, viszont egy jó fapados minden elemet kézzel beírt html kódot meg nem mernék felrakni a githubomra mert kiröhögnek
-
K1nG HuNp
őstag
válasz
martonx
#7251
üzenetére
Engem csak az húz még mindig picit a react felé, hogy mégiscsak standardnak tekinthető, a nagy webappok és frontendek túlnyomó része (amelyek mögött cégek és nem startupok álnak) reactban íródtak.
meg ez a two-way binding téma, konkrétan ebből lett elegük annó az fbs arcoknak és ezért hozták létre a reactot és ezt a nézetet/hitvallást, erre mind az angular mint a vue siman raengedi az fejlesztőkre akik a legtöbbször azt sem tudják mivel állnak szemben
-
K1nG HuNp
őstag
Ez a hype dolog szerintem szimplán annyi, hogy valamiért szeretünk (én legalábbis biztos) mindig a legmenőbb, legújabb, ha a fészbuk is ezt használja akkor biztos jó módon olyan ezközökhöz nyúlni amire egyáltalán semmi szükségünk.
Az angular komplexitása szerintem egy kifejezetten erős dolog ha 300 senior fejlesztőd van, mert ők fogják tudni igazán értékelni azokat a megoldásokat amelyeket a többi frameworkhöz képest nyújt.
React már egy fokkal emészthetőbb az átlag JS fejlesztőnek, legalább érted mit írsz amint megtanulod a framework sajátságait meg a jsx-et.
Szerintem csak jól kell ezközt választani az adott feladathoz és nem fogja felütni a fejét ez a probléma, persze ha nem te döntöd el miben írod akkor....
-
K1nG HuNp
őstag
válasz
K1nG HuNp
#7239
üzenetére
első mondatban cookie helyett tokent akartam írni.
mindegy, közben esti kikapcsnak megcsináltam Vue-ban is egy jwt autentikációt. meglepően sima volt, reacthoz képest legalábbis... vannak ilyen apróságok, hogy routes.beforeEach() amivel aki csinált már más frameworkben authot szerintem el tudja képzelni mennyivel egyszerűbb a téma
Még amikor kiderült, hogy cégnél Vue van a stackban eléggé el voltam kenve, mert nem akartam egy enniyre opinionated frameworkot begyakorlolni, meg a react mégiscsak jobban ment, de mostmár kezdem érteni miért szeretik ennyire az emberek. Kezdőknek nagyon sokat segít, hogy minden "gyárilag" benne van, de látva a személyes példám és azt hogy egyre nagyobb oldalak váltanak vue-ra (gitlab, 9gag), lehet annyira nem is vészes dolog az, ha egy framework nincs teljesen lecsupaszítva a minimumra.
-
K1nG HuNp
őstag
user oldalon el kell tárolni valahol a cookiet nem?
és ugye vagy localstorage vagy cookie, kettő közül pedig ha jól tévedek a cookie biztonságosabb és némileg egyszerűbb is. (localstoraget xss attack miatt vélem, meg mások is egy gyors google miatt kevésbé biztonságosnak) -
K1nG HuNp
őstag
Ha token alapu authentikaciot hasznalok akkor tenyleg nincs jobb megoldás a "kilépés" gomb megoldására a token blacklistelésnél?
Illetve ki kell még bővíteni a köv megoldást esetleg? Nem akarok atombiztos dolgot, csak ha valaki megnezi a projektet githubon akkor ne rohogje el magat..
Szoval: user regisztracional bcryptel jelszot "szaltedheshelek", loginnál comparelek, ha helyes akkor (JWT) tokent rakok cookieba, frontenden (react) pedig a megfelelo oldalaknal csekkolom a tokent es annak megfeleloen engedem be / redirectelem a felhasznalot.
-
K1nG HuNp
őstag
Milyen gyakorisággal szokás a backend apit összeegyeztetni a frontendel?
Frontenden react-reduxom van. Tegyük fel, hogy az user töröl egy elemet a listából. Ez ugye, hogy azonnal megtörténjen kitolok egy dispatchet, ami megváltoztatja a statet a frontenden és azonnal kitorlodik az elem. Ezzel párhuzamosan kimegy egy api post is, ami ugye a valódi adatbazisban modosit adatot.
A listat megjeleniteskor api alapjan jelenitem meg (componentdidmount -> dispatch -> api call -> visszaadja az adatot -> dispatch -> bennevan az adata a stateben). Utana viszont az elobb leirtak alapjan kulon kezelodik nemileg a frontend es a backend.
Ez code smell? Nem igy szokas, vagy ez is egy jarhato ut?
Olyan problemakat tudok elkepzelni pl, hogy ugye elmegy hasznalat kozben a net, erre kikuszoboleskent minden apihivas vegen ha az nem ter vissza 200as statussal akkor azonnal jelzek az usernek. Ez igy teljes koru megoldas?
-
K1nG HuNp
őstag
Jah saját, először még magyar is volt, csak mondta szobatársam, hogy teljesen felesleges mert így csak kevesebben ertik meg mi van oda irva.
Tegnap autoprefix után több sor volt a css mint a js a projektben ugyhogy vissza kellett vennem kicsit
Grid és flexbox óta szerintem nem annyira vészes a layout megírása sima cssben, én a színekkel, padding/marginnal szoktam rentgeteget pepecselni, meg azzal, hogy mobilon is nézzen ki valahogy
-
K1nG HuNp
őstag
válasz
Rickeffe
#7180
üzenetére
persze én sem nyúlnék már bottal sem a bootstraphez, de szerintem amíg barátkozik az ember a reszponziv webdesignal addig teljesen jó, főleg a fasza dokumentációja és a millio stackoverflowos válasz miatt
Más:
Referenciamunkának szerintetek ilyesmiket szoktak várni a cégek? Ez egy alap kis nodejs könyvesbolt amit most az egyik vizsgám után dobtam össze. -
K1nG HuNp
őstag
válasz
bandi0000
#7173
üzenetére
Pontosan. Csak 2019ben már vannak jobb módok a kézi media query irásnal. Mostanában a best-practice már a mobilra megírni először az oldalt, és onnan "min-width" esetleg "min-height" queryk segítségével "felnagyítani" a weblapot ha az adott kijelsző x méretnél nagyobb.
Ha valami gyors kell akkor pl ott a bootstrap keretrendszer, amelyben ezeket megírták neked előre, te pedig csak html classokat adsz elemeknek, pl olyanokat, hogy ez a div kis méretben a képernyő felét használja, nagyban az 1/3-át
-
K1nG HuNp
őstag
React routert használva van ennél szebb megoldás?
<Route exact path="/game/1" render={() => <Game singlePlayer={true} />} />
<Route exact path="/game/2" render={() => <Game singlePlayer={false} />} />Van egy főmenüm és a single/multi player gomboknak annyi dolga lenne, hogy átirányítanak a /game-re miközben a Game komponens megkapja propként h single v multiplayerben induljon.
Most erre az a megoldasom, hogy 2 kulonbozo link van, game/1 és game/2btw ezek a linkek a menuben
<Link to="/game/1"><button>Versus Computer</button></Link>
<Link to='/game/2'><button>Play against a friend!</button></Link>Hogyan tudnám megoldani, hogy csak a /game link éljen, és a menüben is mind a két gomb ide mutasson csak más propot adjon át?
Addig megvan, hogy a linknek kellene küldeni a propot (most ugye nem kuld semmit), a felso ket sornal meg lekezelni, hogy mit kuldott a link es aszerint hivni a gamet
-
K1nG HuNp
őstag
Még kicsit a DOM-nál maradva: egész sokat foglalkozok animációkkal és kellene egy sajat framework, mert hogy netem nem talaltam ami megkönnyíti a dolgom.
Az animacioim amiket hasznalok mindig a CSS-ben vannak, megirom a @keyframest aztan egy classt ami tartalmazza az adott animaciot idovel stb.
Pelda:.enter {
animation: enter 10s ease;
}
@keyframes enter {
0% {
transform: scale(.1);
}
100% {
transform: scale(1);
}
}Ezt a classt csak hozzacsapom ahhoz a dom elementhez amit animalni szeretnek es kesz.
Erre irtam egy nagyon egyszeru fuggvenyt:function classAnimator(dom,className) {
dom.classList.add(className);
dom.addEventListener("animationend", clearIt);
function clearIt(){
dom.classList.remove(className);
dom.removeEventListener("animationend", clearIt);
}
}Amit igy hivok meg:
const button = document.getElementById("testButton");
const box = document.getElementById("box");
button.addEventListener("click", ()=>{classAnimator(box, "enter")})Köv lépésben azt szeretném megcsinálni, hogy a
button-ról leveszem aclickevent listenert, tehat amig tart az animacio ne erdekelje, hogy nyomkodjak.
De elakadtam.Van egy csunya megoldas amiben egy glob valtozoban kellene tarlonom, hogy "clicked"-e a
buttones ha igen akkor instant returnol aclassAnimator. De ja ez csúnya.Próbáltam még klónozni az event.target-et ami ugye a
buttonjelen esetben, ez patentül működött is mert leszedte az eventListenert (bar az osszes gyerekerol leszedne de most ez még nem zavar), de utána nem tudtam értelmesen visszatenni rá mert valami para volt a masodik lefutastol a "parentNode"-valvar clone = event.target.cloneNode(true);
event.target.parentNode.replaceChild(clone, event.target);Ti hogyan oldanátok meg a problémát?
Tehat az a vegso cel, hogy egy gomb, kep, barmi eventlistenerbe belerakom a fuggvenyem, megadom neki mit animaljon, megcsinalja az animaciot, utana leszedi az animacio class-t, es az egesz kozben blokkolja az ujabb eventeket a gomb/kep/barmi -rol. -
K1nG HuNp
őstag
Beszéltem felsőbbéves szobatársammal és azt ajánlotta, hogy feleslegesen ne vessem bele magam még a neurális hálókba, ugyis majd kesobb lesz egyetemen, de egy statikus, gyurcsányferis facebookos chatbotot lehet összedobok
Talán valami olyasmit amitől megkérdezheted hogy mikor lesz a kövi zh, belinkel neked targyhonlapokat stb.Könyvek terén Eloquent JavaScript vagy Secrets of The JavaScript jobb? Vagy barmi mas 3. opcio is johet. Valami olyasmi kellene ami a nyelvet mutatja be, nem feltetlen a programozast meg azt hogy mi egy valtozo.
-
K1nG HuNp
őstag
Hali, van valami tippetek vanilla JS projekthez? Egyetem mellett, hobbiként tolom egyelőre és kellene egy nagyobb lélegzetvételű alkalmazást csinálnom amihez használnom kellene a mélyebb dolgait a nyelvnek. Az a baj hogy mindig ott kötök ki, hogy html-t és css-t b*szogatok órákig a JS meg 250 sor az egész projektben
Nem akarok keretrendszerekbe se bújni, szívesebben jutnék el a nehezebb úton azokhoz a problémáhkoz amelyekért létrejöttek az adott frameworkok.
Elég beteg dolgokat lehet csinálni manapság 
)
Nagyon durva innovaciot tolnak az fbnel
öm.
Új hozzászólás Aktív témák
Hirdetés
- ÁRGARANCIA!Épített KomPhone Ryzen 5 5600X 16/32/64GB RAM RTX 4060 8GB GAMER PC termékbeszámítással
- Asus Rog Strix G16
- Azonnali készpénzes nVidia RTX 2000 sorozat videokártya felvásárlás személyesen / csomagküldéssel
- DELL PowerEdge R730xd 12LFF+2SFF rack szerver - 2xE5-2680v3,64GB RAM,4x1GbE,H730 RAID v ZFS
- AKCIÓ! Gigabyte H610M i5 13600K 16GB DDR4 512GB SSD RTX 3060Ti 8GB Zalman S2 TG Seasonic 650W
Állásajánlatok
Cég: PC Trade Systems Kft.
Város: Szeged
Cég: PC Trade Systems Kft.
Város: Szeged