Diskuze: Nejvýhodnější využití frameworků

Verquido

Tvůrce

Verquido:5.3.2017 15:03

Našel jsem si pár frameworků a chtěl bych se zeptat jaké pro ně vidíte nejlepší využití například z osobní zkušenosti.

jQuery (to je nejspíš jasné)
React
Vue.js
AngularJS

Například co se s tím nejčastějí staví, na co nejlépe využít, proč zrovna to a né jiný Například na něco se mi zdá třeba React zbytečně složitý a šlo by to jednodušeji v jquery nebo Vue.

Odpovědět

5.3.2017 15:03

Neaktivní uživatel

Tvůrce

Neaktivní uživatel:5.3.2017 15:34

To je ale hodne otevrena otazka! Nemuzes napsat konkretne co by te zajimalo? Nebo alespon upresnit? Predpokladam, ze vis k cemu React a Vue jsou, ze znas jejich hlavni rozdily, ekosystem kolem nich, ze vis ceho vseho jsou schopny. Ale pak mi neni jasny na co, nebo proc, se ptas.

Tenhle clanek je skvele shrnuti soucasneho JS: https://hackernoon.com/…16d9eb86309c#…

Jinak, my se v praci zrovna rozhodujeme jestli pro stredne velky projekt pouzijeme Vue nebo React. Takze pokud chces vest diskuzi tak moje PM jsou ti otevrene.

Uvedom si, ze React je modularni, nicmene ja bych ho nepouzil s nicim jinym nez s Reduxem, na routovani react-router nebo found. Zprovoznit SSR mi netrvalo nijak dlouho. DI jsou vicemene o tom jak vnimas best practices...

Veu ma vlastni store manager, ma vlastni route manager, ma vlastni zpusob zapisu, je to spis neco mezi Reacti JSX a Angularem, protoze React je XML-ish HTML v javascriptu, zatimco Vue je template a v nem JS.

Pokud ti jde o rychlost je tu jeste Inferno. Pak taky

Nebo klidne Angular 2.

Taky si uvedom, ze zasadni kriterium pri volbe stacku je komunita a ekosystem kolem nej.

Co se s tim nejcasteji stavi: Dynamicke web appky, single page aplikace v browseru, vetsi appky, ale klidne i staticke stranky, treba react ma moznost se renderovat na serveru do cisteho markupu.

Pokud je na neco React zbytecne slozitej, tak to v nem proste nepis, jasne ze v tom nikdo nebude psat webovy stranky Hostince U Cernovouse. Ale to je prece jasny, pokud denne chodim deset minut, nebudu si kupovat bezecky boty za 5k.
Nicmene je v poradku videt, ze nekam se proste React nebo Vue a podobne nehodi, ne vsude jsou potreba.

Pokud mas dalsi dotazy, per je sem, uz jsem se bal ze se o modernim JS vyvoji na ITN vubec nevi.

Nahoru Odpovědět

5.3.2017 15:34

Neaktivní uživatelský účet

Verquido

Tvůrce

Verquido:5.3.2017 19:02

Dejme tomu že spíš tuším než vím a proto se ptám. Kratší dobu teď dělám v JavaScriptu a tak jsem se o něm trochu zajímal. Našel jsem si něco a teď to potřebuji nějak dát dohromady A obecně se něco naučit.

Spíš mi jde o to že jsem ještě nenašel nic na co bych to využil. Všechno co se v tom dá udělat tak jde i v jQuery třeba a jednodušeji. Proč se to tedy dělá v Reactu nebo Vue či něčem jiném složitěji. jde o rychlost to je mi jasné ale nevím kdy se vyplatí to či ono. Určitě mě zaujala možnost routování to by se mi líbilo možná i pro základní jednoduché statické stránky.

Hlavně si nedokážu představit v tom dělat nějaké složité aplikace na víc stránek. to bych se z toho musel zbláznit ne? Místo klasického <span> elementu tvořit celou novou komponentu

Mohl by jsi mi poslat nějaké své práce a třeba v čem si to dělal? Možná by to taky bylo supr. klidně do PM

Spíš mě ale ber jako začátečníka co píše všechno v HTML a jQuery jen se chce posunout dál

A co je přesně ten ekosystém v technickém směru?

Nahoru Odpovědět

5.3.2017 19:02

Neaktivní uživatel

Tvůrce

Neaktivní uživatel:5.3.2017 20:58

Nasi konverzaci preneseme do PM, tohle je hodne subjektivni tema.
Chci ale uvest na pravou miru pro dalsi ctenare nektere body:

Všechno co se v tom dá udělat tak jde i v jQuery třeba a jednodušeji.

Takhle bych to urcite nerekl. jQuery je napsana ve vanilla (cistem) JS, React taky. Z toho plyne, ze vsechno co je napsane v Reactu, lze napsat v JS. Ale nikoliv, ze vsechno co je napsane v Reactu napises v jQuery stejne citelne a kvalitne.

Proc s tim nesouhlasim? Protoze jQuery je knihovna na manipulaci s DOMem, ale React je knihovna s mnohem pokrocilejsi paletou moznosti, nez jen manilupace DOMu.

Proč se to tedy dělá v Reactu nebo Vue či něčem jiném složitěji. jde o rychlost to je mi jasné ale nevím kdy se vyplatí to či ono.

Naopak. Nejrychlejsi je vanilla javascript, pak az vsechno dalsi, React se vubec nepouziva pro rychlost. Cti dal. Pokud jde o rychlost vyvoje, pak ano, jde o rychlost.

Hlavně si nedokážu představit v tom dělat nějaké složité aplikace na víc stránek.

Presne na tohle je React a podobne staveny. To jak vetsina zacinajicich webaru pise webove stranky nebo appky je zalostne a naprosto nedostacujici. Jenze na to clovek musi weby delat par let, aby vsechno pochopil. Ja si naopak nedokazu predstavit jak bys napsal Facebook frontend cast jen pomoci jQuery. Proc? Protoze to napises a uz se toho nikdo nikdy nebude chtit dotknout, opravovani bugu? Modularita? Citelnost kodu? Neexistuje.

o bych se z toho musel zbláznit ne? Místo klasického <span> elementu tvořit celou novou komponentu

Caste nepochopeni. Tohle po tobe nikdo nechce. V Reactu jsou dva typy komponent, kontejnery, ty jsou chytre a obsahuji logiku, a views, tedy komponenty co jen zobrazuji obsah, ty muzou byt naprosot jednoduche. Uvedom si, ze kazda tvoje vlastni komponenta musi byt ve vysledku slozena z nejakeho <span> nebo <div> a podobne. Nedelame komponenty proto, abychom mohli vlozit obsah, delame komponenty abychom mohli definovat, jak se obsah bude zobrazovat, chovat, s cim souviset ... a podobne.

A co je přesně ten ekosystém v technickém směru?

Je to souhrn technologii, knihoven frameworku, devtoolu, ktere dana technologie nabizi. Napriklad react-hot je hot reloading, slouzi k tomu, ze kdyz zmenis kod v editoru, na webu se ti sam prekresli obsah tak, abys nemusel furt mlatiti na refresh. Chapu ze jsi na zacatku a zda se ti to ponekud zbytecne, ale dneska bych uz bez toho odmital pracovat. Proc to delat komplikovane, kdyz si to muzu usnadnit a to na mnoha mistech.

Tuhle cast si neber osobne, neni to na tebe, je to na univerzalniho zacinajiciho webare, kterym muzes byt i ty, ale nijak se te nechci dotknout.

Shrnuti, to s cim se ted momentalne potykas ty, se da popsat asi takto: Tvoje webova tvorba se da shrnout jako zakladni jednoduchy priklad webu a nejvetsi starost ti dela napriklad transformace dat pro zobrazeni po fetchnuti ze serveru, ale React a podobne fw vznikaji proto, abys v nich psal rozsahle web appky, zkus se zamyslet nad projekty v nem napsanymi. Facebook jako jeden za vsechny. Uvedom si kolik zdanlive nezavislych komponent na fb mas, ruzna menu, posty, komentare, videa, kolik detailnich featur tam je, kdyz nekdo pise komentar, tobe se zobrazi, NEKDO PISE KOMENTAR ... atd..tohle nejde jen tak bastlit do spagetoveho kodu v jQuery, to bys skoncil driv nez bys napsal web o velikosti IT network. Ale s Reactem/Angularem/Vue/... mas moznost i jako zacatecnik tvorit komplexni projekty, jednoduse proto, ze si vyberes ten, ktery ti vyhovuje a pak se spolehnes na to, ze tu rutinni a tezkou praci za tebe odvede knihovna.

Zaverem chci rict, ze z tve strany citim nedostatek pochopeni konceptu SPA (single page application). Pokud vim, tady na ITN neni clanek, ktery by toto tema dobre shrnoval v ramci soucasneho deni na poli JS. Nicmene internet je techto clanku plny, hlavne v aj, takze urcite se vyplati neco precist. Ja shrnu jen zakladnich par bodu:
Predstav si, ze programujes web appku, s mnoha na sobe nezavislymi datovymi kontejnery/komponentami nebo tak. Ony spolu nesouvisi, ale data, nad kterymi se zobrazuji, jsou jedna a ta sama data, velka halda dat. Ta appka je pro mnoho uzivatelu nad globalni sdruzenou DB, uzivatele si mohou data ovlivnovat, menit editovat. A ty to musis v realnem case zobrazit. Co ted? To budes na kazdou komponentu navesovat nejakou jQuery funkci, ktera bude kazdych 100 ms kontrolovat spravnost zobrazenych dat? Bude to delat kazda komponenta na vlastni pest? Pokud danou informaci zobrazujes desetkrat pokazde trochu jinak, budes se na ta sama data ptat serveru 10x ? No to asi ne, chce to system, chce to dobry a robustni navrh, ktery ti umozni nad daty pracovat nezavisle na tom, jestli je pouziva i jina komponenta. Protoze ty potrebujes oddelit logiku a zobrazeni od sebe a drzet je v bezpecne vzdalenosti. Na malem projektiku se tahle potreba neprojevi, ale pri necem vetsim, jakykoliv nedostatek promyslenosti nabyva monstroznich rozmeru a zdrzuje cely projekt.

Nahoru Odpovědět

5.3.2017 20:58

Neaktivní uživatelský účet

Neaktivní uživatel

Tvůrce

Neaktivní uživatel:5.3.2017 21:01

Ja osobne bych klidne byl ochotny o letnich prazdninach udelat nejaky workshop na tohle tema. Neco jako prednasky tady na ITN. A seznamit od zacatku a podrobne se vsim jako je babel es6 webpack react redux npm nodejs eslint atd. Ale asi bych musel videt nejaky zajem o tohle tema.

Editováno 5.3.2017 21:03

Nahoru Odpovědět

5.3.2017 21:01

Neaktivní uživatelský účet

David Hartinger

Vlastník

David Hartinger:5.3.2017 21:02

Teď o tom bude přednáška na srazu.

Nahoru Odpovědět

5.3.2017 21:02

New kid back on the block with a R.I.P

Neaktivní uživatel

Tvůrce

Neaktivní uživatel:5.3.2017 21:03

Prima, kdo bude prednaset?

Nahoru Odpovědět

5.3.2017 21:03

Neaktivní uživatelský účet

Marian Benčat

Člen

Marian Benčat:5.3.2017 22:09

Co je na Reactu moduálrního? Protože všude jinde se to, že něco dáme do jednoho souboru, nenazývá modulární architekturou...

Oni to s oblibou o reactu tvrdi.. V tomto pripade by se ale mohlo nazyvat "modularni" uplne vsechno co se distribuuje pres node balicky a mam ES moduly.

Doporucuji se kouknout na Angular 2 a Ngmoduly, to je modularni architektura.

Editováno 5.3.2017 22:12

Nahoru Odpovědět

5.3.2017 22:09

Totalitní admini..

Neaktivní uživatel

Tvůrce

Neaktivní uživatel:5.3.2017 22:45

Ty chceš v browseru něco jiného než onefile bundle ?

Nahoru Odpovědět

5.3.2017 22:45

Neaktivní uživatelský účet

Marian Benčat

Člen

Marian Benčat:5.3.2017 22:49

Asi jsi mě vůbec nepochopil :-/

Chtěl jsem říct, že v react světě si myslí, že:
Modulární architektura = celá komponenta v jednom souboru.

Nahoru Odpovědět

5.3.2017 22:49

Totalitní admini..

Neaktivní uživatel

Tvůrce

Neaktivní uživatel:5.3.2017 23:03

Předtím ne, teď chápu. Nicméně takhle to nedělá každý žejo.

Nahoru Odpovědět

5.3.2017 23:03

Neaktivní uživatelský účet

Jiří Filip

Člen

Jiří Filip:6.3.2017 7:41

Daniel Steigerwald to vysvětloval tak, že React je modulární, protože místo Reduxu si do něj může napíchnout nějakou jeho obdobu, místo react-routeru může použít jinou tuctu alternativ a kdyby se nedej bože podělal i samotný React, vymění ho třeba za Mithril a ostatní části jeho stacku pořád budou fungovat tak, jak mají.

Oproti tomu Angular 2 je jeden velký gigant (angular/router, angular/http, angular/nevímco), takže když by se Google na to rozhodl vykašlat nebo se tam něco podělalo (už si přesně nepamatuji, jaký byl ten důvod), všechno jde to kypru.

Mně jako začátečníka to teď ale příliš netrapí :-) Na Angularu mně ale štve jedna věc. Když udělám chybu v šabloně (třeba zapomenu koncový tag), dostanu error a šlus, skončil jsem. Teď abych prolízal jednu značku podruhé, kde jsem to podělal.

Jinak mám radši React, líbí se mi funkcionální přístup :-)

Nahoru Odpovědět

6.3.2017 7:41

Jan Vargovský

Tvůrce

Jan Vargovský:6.3.2017 8:37

Od http v2 ano

Nahoru Odpovědět

6.3.2017 8:37

Neaktivní uživatel

Tvůrce

Neaktivní uživatel:6.3.2017 10:20

Existují konfigurace webpacku, které se o to postarají za mě.

Editováno 6.3.2017 10:22

Nahoru Odpovědět

6.3.2017 10:20

Neaktivní uživatelský účet

Jan Vargovský

Tvůrce

Jan Vargovský:6.3.2017 10:47

Ono je to trošku nadčasové, jen jsem si chtěl rýpnout

Nahoru Odpovědět

6.3.2017 10:47

Marian Benčat

Člen

Marian Benčat:6.3.2017 13:15

Daniel Steigerwald toho napovídá plno a přitom ví o Angular 2 úplné kuloví :-) Ono je hodně vidět u něj to, kdo ho platí a za co je placenej :-)

A koukám, že ty o tom budeš vědět podobně.

Jen pro informaci. Angular 2 není žádný monolit, naopak je mnohem modulárnější, než react. Dokonce lze použít přímo react jako View vrstvu u angularu. Už vůbec nezmiňuji to, že jde třeba switchnout právě balíček pro View a psát aplikace na mobily pro NativeScript .

Samotný "angualr" je rozdělený asi do 10ti modullu, jako je HTTP, Forms, ReactiveForms, Browser, atd..

Dále pro info - Angular 2 lze použít s Reduxem (proč by to ale dělal,.. on má lepší NGRX/Store, které React zkopírovat a přišel s "reactive reduxem"), MobX, Flux,.. Co si zamane.

Na samotný routing lze také použít jiné balíčky než NG2-router.

Co se týče kontorly chyb, asi si dělal s NG2 s nějakou rok starou verzí - ta současná ti totiž poví chybu i rovnou při buildu, označí ti řádku a šipkou ti ukáže v preview kódu, kde ta chyba je.

Pokud někdo ale bezmezně pooslouchá Steidu, který o tomdle zrovna ví absolutní kuloví, tak to nemá smysl debatovat :-)

Editováno 6.3.2017 13:16

Nahoru Odpovědět

6.3.2017 13:15

Totalitní admini..

Marian Benčat

Člen

Marian Benčat:6.3.2017 13:19

Daniel Steigerwald je typický hipster - všechno je pro něj naprosto boží a bez chyby.. prvníí 2 měsíce - doporučuji se kouknout na changelog jeho Este.js, zjistil by si, že "naprosto boží a bezchybné" věci co tam měl, už tam nemá - například switchnul přávě redux :-))))

Nahoru Odpovědět

6.3.2017 13:19

Totalitní admini..

Neaktivní uživatel

Tvůrce

Neaktivní uživatel:6.3.2017 13:26

Mariane, o tomhle tohle vlakno ale neni. Ja respektuju moznost volby a povazuju za volbu i Angular2, ale to nic nemeni na tom, ze ty uz ted jen hejtis Steigerwalda.

Editováno 6.3.2017 13:26

Nahoru Odpovědět

6.3.2017 13:26

Neaktivní uživatelský účet

Marian Benčat

Člen

Marian Benčat:6.3.2017 13:27

Mas pravdu. Omlouvam se. Jen me rozciluje, kdyz nekdo argumentuej tim, co rekll Steida a sam si o tom absolutne nic nezjisti. Proto naprosto bezhlave v CR vetsina vyvojaru zanedba NG2 a nevi o nem nic.

Timto tedy koncim o Steidovi a jen rikam tedy, že v tom jiří nemá pravdu a že to tak není.

Nahoru Odpovědět

6.3.2017 13:27

Totalitní admini..

Neaktivní uživatel

Tvůrce

Neaktivní uživatel:6.3.2017 13:32

Ja te naprosto chapu. Je to skoda. Ale oci lidem stejne neotevres, ne takhle. Pokud nekdo bude chtit verit jedinemu cloveku, budiz. Ja pracoval s kolegou, co byl na jednom jeho seminari a byl z toho hodne otravenej, vyhodil penize za neco, co nedavalo smysl a podobne. Ve vysledku si tak Jirka dela sam negativni reklamu.

Nahoru Odpovědět

6.3.2017 13:32

Neaktivní uživatelský účet

Jiří Filip

Člen

Jiří Filip:6.3.2017 15:25

Achjo, chlape. Vkládáš mi slova do huby. Nikde jsem neřekl, že beru jeho slova jako jedinou pravdu™, jenom jsem chtěl odpovědět a odkázat při tom na někoho, kdo tomu rozumí víc, než já. Nemám problém si věci pozjišťovat a případně změnit názor.

Nelíbí se mi, že někdo se na něco zeptá a ostatní na něj naběhnou s vidlema a div ne ho neupálí (ne jen v tomhle vláknu), že se odvážil něco nevědět. JS dělám asi půl roku, tak myslím, že mám právo neznát o tom první poslední.

Řekl bych ti, ať se zamyslíš, než tu začneš na lidi zbytečně útočit, ale už jsem tě to viděl dělat v jiných vláknech a myslím, že se ti to líbí. Zdar.

Nahoru Odpovědět

6.3.2017 15:25

Marian Benčat

Člen

Marian Benčat:6.3.2017 16:51

Ahoj, popravdě mi to navozuje fyzickou slast jen u IT VŠE.

Editováno 6.3.2017 16:52

Nahoru Odpovědět

6.3.2017 16:51

Totalitní admini..

Tomáš Daněk

Člen

Tomáš Daněk:29.11.2017 18:18

Ahoj, měl bych zájem o školení

Nahoru Odpovědět

29.11.2017 18:18

Jindřich Máca

Tvůrce

Jindřich Máca:30.11.2017 0:50

Ahoj, tak jsi o nich něco přečti (https://www.itnetwork.cz/…razene/akce/), vyber si a klidně se na nějaké přihlaš. Případně můžeš využít i zdejších super on-line tutoriálů.

Editováno 30.11.2017 0:50

Nahoru Odpovědět

30.11.2017 0:50