Mitä rakennamme?
Tässä opetusohjelmassa näytetään, kuinka rakentaa interaktiivinen tic-tac-toe-peli Reactin kanssa.
Täältä näet, mitä rakennamme: Lopputulos. Jos koodilla ei ole mitään järkeä sinulle tai jos et tunne koodin syntaksia, älä huoli! Tämän opetusohjelman tarkoituksena on auttaa sinua ymmärtämään Reactia ja sen syntaksia.
Suosittelemme, että tutustut tic-tac-toe-peliin ennen kuin jatkat opetusohjelman kanssa. Yksi ominaisuuksista, jotka huomaat, on, että pelilaudan oikealla puolella on numeroitu luettelo. Tämä luettelo antaa sinulle historian kaikista pelissä tapahtuneista liikkeistä, ja se päivitetään pelin edetessä.
Voit sulkea tic-tac-toe-pelin, kun olet perehtynyt siihen. Aloitamme yksinkertaisemmasta mallista tässä opetusohjelmassa. Seuraava askel on asettaa sinut niin, että voit aloittaa pelin rakentamisen.
Edellytykset
Oletetaan, että olet perehtynyt HTML: ään ja JavaScriptiin, mutta sinun pitäisi pystyä seuraamaan mukana, vaikka tulisit eri ohjelmointikielellä. Oletetaan myös, että olet perehtynyt ohjelmointikonsepteihin, kuten funktioihin, objekteihin, matriiseihin ja vähemmässä määrin luokkiin.
Jos haluat tarkistaa JavaScriptin, suosittelemme lukemaan tämän oppaan. Huomaa, että käytämme myös joitain ES6: n ominaisuuksia – viimeisintä JavaScript-versiota. Tässä opetusohjelmassa käytämme nuolitoimintoja, luokkia, let- ja const-lauseita. Voit käyttää Babel REPL -ohjelmaa tarkistaaksesi, mihin ES6-koodi kootaan.
Miksi oppia reagoimaan?
React on tehokkain käyttöliittymäkirjasto, joka on kehittänyt View-osan MVC: ltä. Alla on muutama syy:
Pieni oppimiskäyrä: Kaikki verkkokehittäjät tietävät jo javascriptin. se on melko helppo oppia. Niiden, jotka eivät ole web-kehityksen taustasta tai uudet verkkokehityksestä, on ensin opittava javascript. varsinkin uusin javascript ES6.
Komponenttipohjainen arkkitehtuuri: Komponenttipohjainen arkkitehtuuri antaa sinulle mahdollisuuden suunnitella monimutkaisia sovelluksia ja hajottaa ne pieniksi pieniksi sisältyviksi paloiksi, ja nämä pienet sisältämät kappaleet ovat helpompaa rakentaa, ylläpitää, testata ja virheenkorjata sovellusta.
Nopea: Reagoi sovellus on nopea. Se renderöi ja tuottaa sovelluksia nopeasti ja pitää ajan tasalla viimeisimmistä muutoksista tiedoissa.
Re-Rendering-algoritmin käyttäminen React pitää sen todella nopeasti ja nopeasti. Reagoi myös käyttämällä Virtual Dom (VDOM) -ominaisuutta Real Dom -muistissa.
React on skaalautuva: React-pohjainen sovellus on nopeampi, mikä antaa loistavan käyttökokemuksen päivän loppuun mennessä, jolloin sovelluksesi suorituskyky on asia, joka tekee käyttäjästä onnelliseksi.
Katso vain Facebook, se on erittäin skaalautuva, Facebook valmistaa noin 5000 komponenttia, mutta silti sitä ajetaan ilman suorituskykyä. Kysymys, komponenttipohjainen lähestymistapa, JSX: n käyttö, virtuaalisen DOM: n käyttö, kolmannen osapuolen komponenttien suuri saatavuus, kaikki nämä tekevät Reactista skaalautuvan.
Suurten kolmannen osapuolen komponenttien saatavuuden ansiosta se säästää paljon aikaa ja kehityskustannuksia.
Reactilla on mahtava yhteisö: Vahvan yhteisön mukana tulee myös suuria resursseja, saatavilla on tuhansia videoita, oppaita, blogiviestejä, jotka auttavat sinua oppimaan ja kehittämään minkä tahansa tyyppisiä sovelluksia Reactin avulla.