React 2 Boter Kaas en Eieren (concept 19-1-25)

01 - React

React is een tool die je helpt om websites te bouwen die snel en interactief zijn. Stel je voor dat je een website maakt zoals Instagram of YouTube, waar je op knoppen kunt klikken, reacties kunt plaatsen, of video’s kunt bekijken zonder dat de hele pagina opnieuw geladen hoeft te worden. React zorgt ervoor dat dit soepel en makkelijk werkt.

In plaats van dat je alles steeds opnieuw bouwt, kun je met React kleine bouwstenen maken (we noemen die componenten). Bijvoorbeeld: een knop, een zoekbalk of een bericht. Je kunt die bouwstenen hergebruiken, net als LEGO-blokjes, om snel een complete website te maken.

React is dus als een gereedschap voor moderne webbouwers om gave, interactieve websites te maken!

Ga naar linkedin.com/learning React Essential Training en Bekijk hoofdstuk 1
Wat is React en hoe werkt React

Opdracht

Beantwoord de volgende vragen:
- Wat is React?
- Welke bedrijven gebruiken React, noem er 5?
- Vertel in eigen woorden hoe React werkt.

Noteer je vragen met antwoorden in de tekstvenster en lever een schreenshot van de Training waarbij vinkjes staan bij hoofdstuk 1.

02 - Versie beheer

Wat is versiebeheer met GitHub?
Stel je voor dat je aan een schoolproject werkt, bijvoorbeeld een presentatie of een website, en je wilt elke stap opslaan. Zo kun je altijd teruggaan naar een eerdere versie als iets fout gaat. Dat is wat versiebeheer doet: het bewaart alle veranderingen die je maakt.

GitHub is een soort online kluis voor je projecten. Je kunt er jouw werk opslaan, delen met anderen en samenwerken zonder dat je bestanden kwijtraakt of per ongeluk iets overschrijft. Het werkt samen met een programma genaamd Git, dat al je wijzigingen netjes bijhoudt.

Als je nog geen account hebt op GitHub maak dan een account op GitHub
Ga naar github.com en maak een gratis account aan. Installeer Git op je computer en koppel het aan VS code, zodat je kan werken met versiebeheer.

Stap voor stap gaan wij een Boter Kaas en Eieren (Tic-Tac-Toe) spel maken in React
Onderstaande handleiding is bedoeld voor studenten om eenvoudig een Boter Kaas en Eieren-spel te maken met React. We gebruiken Vite als bundler en ontwikkelserver omdat die lekker snel werkt. Wil je liever met Create React App werken? Dat kan ook; de React-code zelf is grotendeels hetzelfde.

Handleiding boter kaas en eieren:
Stap 0: Benodigdheden

Node.js (12+ of hoger) Controleer met node -v en npm -v in de terminal of je Node en npm hebt.

Basiskennis van React: kennis van componenten, props en state.