Curriculum szoktató modern javascript, programozó könyvtára

Miért fontos ez?

Ez a program az Ön számára, ha:
* Ön már ismeri az alapvető programozási fogalmak, mint a változók és függvények
* Csinálsz back-end fejlesztés segítségével, mondjuk, PHP, Python, és lehet, hogy használható front-end könyvtárak, mint például a jQuery, néhány kisebb feladatok
* Azt akarja, hogy komolyan behatolni a front-end fejlesztés, de már fulladás a keretek és a könyvtárak, sem üzembe (fejlődés), hogy vegyenek

A téma, hogy mi álljuk

Ezek a források

Figyeljük meg a különbséget? Ahelyett, hogy a HTML, a szerver most küldi az adatokat, és épít HTML adatok alapján már akkor bekövetkezik a kliens oldalon (így csak küldje a kódot, amely közli az ügyféllel, hogyan kell átalakítani az épületet).

Ez annak következményeit.
Először a jó:
* Az ilyen típusú tartalom csak küld adatokat sokkal gyorsabban, mint elküldeni a teljes HTML-oldal
* Az ügyfél azonnal változtatni, ezért nem frissíti a böngésző oldalon (innen a név „Függelék egy oldal”)

És a rossz:
* Boot tovább tart, ha a szám nagyobb lesz
* Most meg kell találni a helyét a tárolási és kezelési adatok a kliens oldalon is, ha azt szeretnénk, hogy cache-, vagy ellenőrizze,

És kellemetlen:
* Gratulálunk! Most meg kell bütykölni az ügyfél része nem kevesebb, mint a szerver

Kliens-szerver-spektrum

Van még értelme, mert a verejték, amikor olyan sok rossz oldala? Miért nem használja a jó öreg PHP-alkalmazások?

Nos, képzeljük el, hogy hozzon létre egy számológép. Ha a felhasználó szeretné tudni, hogy mennyi 2 + 2, értelmetlen lenne elindult vissza a szerver, az eredmény kiszámítása, ha a böngésző is, és meg tudja csinálni.
Másrészt, ha létrehoz egy tisztán statikus oldalon, mint például a blog, nem lenne teljesen igaza, így a végső HTML a szerveren, és nem kell aggódnia többet érte.

Az igazság az, hogy a legtöbb webes alkalmazások valahol a kettő között. Ahhoz, hogy tudjuk, hol ...
De a jó hír az, hogy a tartomány nem végtelen: nem tudja elindítani a tisztán szerver oldali, és lassan felé tisztán ügyféloldali alkalmazásokat. Egy bizonyos ponton (abban az időben, az úgynevezett „osztály”), akkor erőszakkal megállítani és refactor mindazt, amit írt, vagy csak hagy sok támogatott spagetti-kód (ez különösen veszélyes, és egy bizonyos fajta rossz kód - megjegyzés fordító.).

Ezért nem lehet „csak használni jQuery» az egész sort. Valószínűleg úgy gondolja, hogy jQuery - ezt a szalagot. Persze, ez egy csodálatos dolog, hogy megoldja kisebb problémák, de ha úgy döntenek, hogy egyre több problémát, a kód kezd csúnya.

Hét №1: Kezdje tanítani reagálnak

Most, hogy tudod az alapokat a nyelv szintaktikai és megértése, hogyan alkalmazásokat lehet olyan bonyolult, beszéljünk valami különleges. Hol kezdjük?

Természetesen a tanulmány reagál!

Reagál - ez UI-könyvtár tervezett és lefektetett a nyílt hozzáférés Facebook, hogy felelősséget vállal a konverziós adatok HTML.

Ne érts félre, nem tudom megmondani, hogy reagálnak - a legjobb könyvtár (mert ez nagyon szubjektív), de elmondhatom, hogy nagyon jó.

* Reagálni nem lehet a legnépszerűbb könyvtár, de ez elég népszerű
* Reagálni nem lehet a legkönnyebben könyvtár, de ez elég könnyű
* Reagálni nem lehet a legegyszerűbb könyvtár, de ez elég egyszerű megtanulni
* Reagálni nem lehet a legkellemesebb, hogy vizsgálja meg a könyvtár, de ez elég kellemes

Más szóval, a React nem lehet a legjobb választás minden helyzetben, de biztos vagyok benne, hogy ő a legmegbízhatóbb. És hidd el, az elején - nem ez a legjobb alkalom, hogy kockázatvállalási kiválasztásánál technológiákat.

Reagálnak is tanítani néhány alapvető fogalmak, mint például: az alkatrészek, az állami az alkalmazás és funkció nélküli állam, amely később nagyon hasznos lehet, nem számít, hogy milyen keret vagy könyvtári választhat a végén.

Végül reagál kiterjedt ökoszisztéma más könyvtárak, amelyek jól működnek vele egy csomagban. És népszerűsége azt mondta, hogy mindig megtalálja a Súgó oldalak, mint a StackOverflow (vagy GitHub - megjegyzés a fordító.).

Én személy szerint ajánlom a tanfolyam Wes Bos - reagálnak a kezdők számára. Általa maradt, hogy tanultam személyesen reagálni, de ő is inkább a teljes és a legjobb gyakorlatok reagálni.

Ha szeretne tanulni következetesen, akkor érdemes először alaposan megértsék a nyelvet alapokat, mielőtt bármi mást. De ez lesz egyenértékű, mint ha megtanult úszni tanulmányozása az emberi anatómia és folyadék dinamika. Természetesen ez nagy szerepet játszik az úszás, de sokkal több móka és praktikus is lenne, hogy csak ugrik a medencébe!

Hét №2: Az első projekt segítségével reagálnak

Tegyük fel, hogy már elvégezte a tanfolyamot reagálni. Ha te és én, mint a két dolog valószínűleg igaz:
* Már elfelejtette a felét, amit megtanultam
* Már alig várom, hogy használni a másik fele ismeretek gyakorlatban

Számomra úgy tűnik, hogy a legjobb módja, hogy megtanulják a nyelvet, vagy keret - az, hogy használja. És, hogy vezessenek be valami újat a saját projektek - ez a legjobb dolog, amit úgy gondolja, hogy ez a mester „valami újat.” Az Ön személyes projekt bármi lehet egy oldalas weboldal összetett webes alkalmazások, de van egy olyan érzésem, hogy az átalakítás a honlapján, és az arany középutat, ami kell kezdeni. Különben is, én tudom, hogy nem figyel rá (a honlapon) sokáig.

Korábban azt mondta, hogy a használata az alkalmazás egy oldal statikus tartalom lehet túlzás, de reagál van egy titkos fegyvere - Gatsby. statikus generátor oldalak reagált, amely lehetővé teszi, hogy a „csaló”, és kap minden előnyét reagálni, anélkül, hogy az összes negatív aspektusait.

Hét №3: Tanulási ES6

Az én kísérletet, hogy megtanulják a reagálj, azt elérte azt a pontot, ahol én is csak copy-paste a kódot a példákat, de ez is jóval, amit nem értek.
Különösen nem voltam tisztában ezekkel, aki nemrég érkezett hozzánk a ES6 funkciók, mint például:
* Destrukturáló tárgyak
* órák
* Váltóátállítók funkció
* Expansion szereplők

Ha ugyanaz a helyzet, akkor kell egy kis időt, hogy elsajátítsák a ES6. Ha tetszett reagálni tanfolyam kezdőknek, akkor valószínűleg nem tud várni, hogy egy nagy ES6 pass aránya az egyes Wes Bos. Vagy, ha úgy tetszik a szabad forrásokat, akkor olvassa el a könyvet Nicola Bevacqua - ES6 a gyakorlatban. A jó gyakorlat fejlesztése a ES6 lenne séta a régi kódot (például az a tény, hogy írtunk a második héten), és átalakítani, hogy egy rövidebb keresztül ES6.

Hét №4: felfedezni a vagyonkezelés

Ezen a ponton meg kell tenni, hogy hozzon létre egy egyszerű front-end statikus tartalmak reagálni. De az igazi webes alkalmazások nem statikus. Ezeket meg kell eljussunk az adatokat bármelyik adatbázisban, például. Ezt megelőzően, tudnánk küldeni az adatokat az egyes komponensek, de ez a megközelítés megelőzi zavart.

Mi van, ha a két komponenst fel kell tüntetni a ugyanazokat az adatokat, például? Vagy információkat kell cserélnie? Ez az, ahol bejön a vagyonkezelést. Ahelyett, hogy tárolja a feltétel (. Ie adatok) az alkatrész, akkor hagyja a globális üzletben, amely a megfelelő pillanatban küldi (az állam) a React-elemek:

Reagálni a világban, a legnépszerűbb könyvtár kezelésének nevezett állapot Redux. Ez nem csak segít, hogy összehozza az összes adat, de azt is előírja számunkra néhány protokollok kezelheti ezeket az adatokat.

Redux össze lehet hasonlítani a bank: ha nem megy, hogy egy helyi bankfiókban és módosíthatja az aktuális egyenlege ( „és adjunk hozzá egy percet, hogy nekem itt egy pár nullát!”). Ehelyett töltse ki az űrlapot, átadta egy banki alkalmazott, aki a jogot, hogy végre a követelményeknek. Csakúgy, Redux nem teszi lehetővé, hogy módosítsa a globális állam közvetlenül. Ehelyett belemerül hajtóművek - sajátosságai, amelyek műveleteket végrehajtó és vissza az új, frissített állapotban marad vissza.

Az eredmény a további időt töltött - egy nagymértékben szabványosított és támogatta az adatáramlás az alkalmazásban, és hozzáférést eszközök, mint a Redux Devtools. ezen adatok megjelenítés.

Bonus Hét №5: Dizájn és GraphQL API

Eddig sokat beszéltünk ügyféloldali alkalmazásokat, de ez csak az érem. És akkor még nem mártva a mélyben Node ökoszisztéma, akkor is meg kell vizsgálni, az egyik legfontosabb szempontjai bármely web-alapú alkalmazások: hogyan továbbítják az adatokat a szerver a kliens. Mint minden mást, ezt a részét a fejlesztési idővel változik nagyon gyorsan. GraphQL (egy másik nyílt forráskódú projekt Facebook) kínál komoly alternatívát jelent a hagyományos REST API-t.

Ez az új stratégia különösen hasznos, amikor szükség van, hogy a kérelmet számos forrásból. Ahogy a példa egy bevásárló listát, akkor most kap adatokat az összes forrásból az egyetlen kérés.

Az elmúlt évben, GraphQL jól tette a zaj, és számos projekt (mint például a Gatsby) tervezi, hogy alkalmazkodni hozzá. Maga GraphQL - jegyzőkönyvet, de a megvalósítása a legjobb abban a pillanatban, ez talán az Apollo könyvtár. amelyet egyébként tökéletesen működik Redux. Sajnos, még mindig úgy érezte, hogy nincs anyagi GraphQL és Apolló, de remélhetőleg, Apollo dokumentáció végigvezeti Önt a hinta a dolgok.

A másik oldalon reagálnak

Azt javasoljuk, hogy kezdje a reagálj, mert ez egy biztonságos választás, de ez minden esetben nem jelenti azt, hogy ez csak egy jó front-end verem. Ha azt szeretnénk, hogy továbbra is fejlődik, ez te vagy két tanácsot:

Vue - egy viszonylag új könyvtárat, de a népszerűsége növekszik rekordgyorsasággal és már alkalmazkodott a nagyvállalatok, különösen Kínában, ahol ezt a könyvtárat használják a Baidu és Alibaba (a kínai Google és az Amazon). És mégis ez a hivatalos front-end réteg Laravel PHP keretrendszer.

Összehasonlítva reagálni, itt van néhány jó tulajdonságait Vue:
* Hivatalosan támogatott útvonalak és könyvtárak vagyonkezelés
* A teljesítményre való összpontosítás
* Belépési küszöb alacsonyabb, mivel a sablonok használata HTML alapú

Már csak 2 dolog, hogy még mindig létezik reagál elszakadás Vue, a következők: a méret az ökoszisztéma és reagálnak reagálnak Native. De nem lenne meglepve, ha hamarosan látni Vue par reagálni.

Mi a következő lépés?

Most meg már egy tisztességes mennyiségű tudás front-end verem, és remélem, alaposan keményen dolgozott, hogy elérjék a jó teljesítményt.

Nem tudok írni itt minden, de ne essen kétségbe! Az első lépés mindig a legnehezebb, és tudod mit? Már megtette, olvassa el ezt a tervet. Most már értem, hogy a különböző darabok az ökoszisztéma megközelítés egymással, a feladat az, csak észre, hogy szeretne többet, és fedezze fel az új technológia minden hónapban!

Maradjon kapcsolatban

Például miért nem indul el egy tanulmányt a Angulyara, vagy még jobb a legújabb, legfrissebb a második polimer?

Govonokodery miután az poluchayutsya

Elvárom néhány szót a Angulyare, sajnos. Mégis, kösz a magyarázatot elveinek kölcsönhatás technológiák valószínűleg a modell a webes alkalmazások is alkalmas Angulyara, de vannak más nevek verem technológiát.

Zadran van raznobezobrazie!