A React a modern webfejlesztés egyik legfontosabb eszköze: egy JavaScript-alapú könyvtár, amely lehetővé teszi, hogy hatékony, újrafelhasználható komponensekből építsünk fel dinamikus felhasználói felületeket.
Könyvünk átfogó, mégis könnyen követhető bevezetést ad mindazok számára, akik meg szeretnék érteni, hogyan működik a React, és miként használható professzionális Front-End fejlesztés során. A kötet az alapoktól indulva ismerteti a React szemléletét, működési elvét és legfontosabb eszközeit. Részletes magyarázatok és kódpéldák segítik az olvasót abban, hogy megértse a komponensek közötti adatáramlást, az állapotkezelést, a feltételek és események logikáját, valamint a React és a CSS együttműködését. A könyv kitér a modern fejlesztési környezetre, a moduláris kódstruktúrára és a JavaScript újabb eszközeire is, amelyek elengedhetetlenek a React hatékony használatához. A gyakorlati példák nem csupán a technikai megoldásokat mutatják be, hanem a gondolkodásmódot is, amely a komponensalapú fejlesztés sajátja. Az olvasó megtanulhatja, hogyan építhet jól szervezett, karbantartható és bővíthető alkalmazásokat, miközben megérti, mitől vált a React a korszerű webalkalmazások egyik legnépszerűbb technológiájává.
A könyv azoknak szól, akik már rendelkeznek HTML, CSS és JavaScript ismeretekkel, és szeretnék ezeket egy következő szintre emelni. Megbízható útmutató mindazoknak, akik önállóan, lépésről lépésre szeretnék elsajátítani a React működését, és magabiztosan használni azt a gyakorlatban.

Tartalomjegyzék

1. Bevezetés 5
2. Kezdetek 7
2.1. A React célja 7
2.2. A fejlesztési környezet 7
2.2.1. Közvetlen HTML fájl használata 8
2.2.2. Projekt használata a create-react-app parancs után 10
3. JavaScript újdonságok a React ES6-ban 14
3.1. Komponens létrehozása React ES6 Class-szal 14
3.2. Rövidebb függvénymeghatározás a React ES6 nyílfüggvénnyel (Arrow Function) 17
3.3. Változók létrehozása, a React ES6 változó kezelése 18
3.4. Metódusok tömbök, listák kezelésére - React ES6 Array metódusok 19
3.5. Tömb vagy objektum elemeinek szűrése React ES6 Destructuring-gal 20
3.6. Tömbők vagy objektumok másolására React ES6 Spread operátor 22
3.7. Változók, függvények átadása React ES6 Modulokkal 22
3.7.1. Exportok 23
3.7.2. Importok 23
3.8. Feltételre React ES6 Ternary (háromtagú feltételes) operátor 24
4. HTML elemek létrehozása és megjelenítése React-ben: rendereléssel 25
5. A React JSX nyelve 27
6. A React komponensek alapjai 29
7. React class komponensek 33
7.1. A class komponensek használatának alapjai 33
7.2. A komponens state objektuma 35
7.3. A komponensek életciklusa 38
8. React props-okhoz kötött adatátvitel 42
9. React eseménykezelők 44
10. React feltételek kezelései 45
11. React listák és tömbök kezelése 47
12. React formok, azaz adatbevitelek 48
12.1. Kezdeti tudnivalók a useState-ről 48
12.2. Input használata 49
12.3. Textarea típusú adatbevitelek 52
12.4. Select (lenyíló lista) a React-ben 53
13. React Router fájlok navigáció kezelésére 54
13.1. A szerkezet felépítése 54
13.2. A webhely oldalai 57
14. React Memo változatlan komponensre 59
15. A React együttműködése a CSS-sel 61
16. Stílusok SASS használatával 64
17. React Hook-ok életciklusok kezelésére 65
17.1. Mi a Hook? 65
17.2. A useState() 67
17.3. A useEffect() 69
17.4. A useContext() 71
17.5. A useRef() 73
17.6 A useReducer() 75
17.7. A useCallback() 78
17.8. A useMemo() 81
17.9. Egyedi Hook-ok készítése 83
18. Gyakorló feladatok 86
18.1. Csak a szükséges gomb legyen 86
18.2. Mindenre van válasz 90
18.3. Két üdvözlet 96
19. Források, kapcsolat 98