React Fundamentals / Introduction to React
Startdata en plaatsen
placeStartel (Drachten) 5 nov. 2024 tot 7 nov. 2024Toon rooster event 5 november 2024, 09:00-17:00, Startel (Drachten), Dag 1
event 6 november 2024, 09:00-17:00, Startel (Drachten), Dag 2
event 7 november 2024, 09:00-17:00, Startel (Drachten), Dag 3
|
placeVirtual 5 nov. 2024 tot 7 nov. 2024Toon rooster event 5 november 2024, 09:00-17:00, Virtual, Dag 1
event 6 november 2024, 09:00-17:00, Virtual, Dag 2
event 7 november 2024, 09:00-17:00, Virtual, Dag 3
|
placeStartel (Drachten) 11 dec. 2024 tot 13 dec. 2024Toon rooster event 11 december 2024, 09:00-17:00, Startel (Drachten), Dag 1
event 12 december 2024, 09:00-17:00, Startel (Drachten), Dag 2
event 13 december 2024, 09:00-17:00, Startel (Drachten), Dag 3
|
placeVirtual 11 dec. 2024 tot 13 dec. 2024Toon rooster event 11 december 2024, 09:00-17:00, Virtual, Dag 1
event 12 december 2024, 09:00-17:00, Virtual, Dag 2
event 13 december 2024, 09:00-17:00, Virtual, Dag 3
|
placeStartel (Drachten) 15 jan. 2025 tot 17 jan. 2025Toon rooster event 15 januari 2025, 09:00-17:00, Startel (Drachten), Dag 1
event 16 januari 2025, 09:00-17:00, Startel (Drachten), Dag 2
event 17 januari 2025, 09:00-17:00, Startel (Drachten), Dag 3
|
placeVirtual 15 jan. 2025 tot 17 jan. 2025Toon rooster event 15 januari 2025, 09:00-17:00, Virtual, Dag 1
event 16 januari 2025, 09:00-17:00, Virtual, Dag 2
event 17 januari 2025, 09:00-17:00, Virtual, Dag 3
|
placeStartel (Drachten) 19 feb. 2025 tot 21 feb. 2025Toon rooster event 19 februari 2025, 09:00-17:00, Startel (Drachten), Dag 1
event 20 februari 2025, 09:00-17:00, Startel (Drachten), Dag 2
event 21 februari 2025, 09:00-17:00, Startel (Drachten), Dag 3
|
placeVirtual 19 feb. 2025 tot 21 feb. 2025Toon rooster event 19 februari 2025, 09:00-17:00, Virtual, Dag 1
event 20 februari 2025, 09:00-17:00, Virtual, Dag 2
event 21 februari 2025, 09:00-17:00, Virtual, Dag 3
|
placeStartel (Drachten) 19 mrt. 2025 tot 21 mrt. 2025Toon rooster event 19 maart 2025, 09:00-17:00, Startel (Drachten), Dag 1
event 20 maart 2025, 09:00-17:00, Startel (Drachten), Dag 2
event 21 maart 2025, 09:00-17:00, Startel (Drachten), Dag 3
|
placeVirtual 19 mrt. 2025 tot 21 mrt. 2025Toon rooster event 19 maart 2025, 09:00-17:00, Virtual, Dag 1
event 20 maart 2025, 09:00-17:00, Virtual, Dag 2
event 21 maart 2025, 09:00-17:00, Virtual, Dag 3
|
Beschrijving
Startel in Drachten verzorgt al ruim 25 jaar IT-opleidingen in Nederland en België.
Algemene omschrijving
React is waarschijnlijk de populairste front-end bibliotheek voor het maken van webapplicaties. Oorspronkelijk komt React uit de stal van Facebook, maar in 2013 is de bibliotheek als open source beschikbaar gesteld. Iedereen kan met de broncode aan de slag. React wordt onder meer gebruikt door BBC, Dropbox, Instagram, Airbnb, Uber, Netflix, Slack en talloze andere bedrijven en organisaties.
React is geheel gebaseerd op componenten. Deze worden geschreven in ES6/ECMAScript 2015 (de nieuwe versie van JavaScript). Gedegen JavaScript-kennis is dan ook van belang. Vervolgens wordt de applicatie opgebouwd als een boomstructuur van componenten.
In de training Introduction to R…
Veelgestelde vragen
Er zijn nog geen veelgestelde vragen over dit product. Als je een vraag hebt, neem dan contact op met onze klantenservice.
Startel in Drachten verzorgt al ruim 25 jaar IT-opleidingen in Nederland en België.
Algemene omschrijving
React is waarschijnlijk de populairste front-end bibliotheek voor het maken van webapplicaties. Oorspronkelijk komt React uit de stal van Facebook, maar in 2013 is de bibliotheek als open source beschikbaar gesteld. Iedereen kan met de broncode aan de slag. React wordt onder meer gebruikt door BBC, Dropbox, Instagram, Airbnb, Uber, Netflix, Slack en talloze andere bedrijven en organisaties.
React is geheel gebaseerd op componenten. Deze worden geschreven in ES6/ECMAScript 2015 (de nieuwe versie van JavaScript). Gedegen JavaScript-kennis is dan ook van belang. Vervolgens wordt de applicatie opgebouwd als een boomstructuur van componenten.
In de training Introduction to React wordt ingegaan op de best practices rondom de structuur en architectuur van React-applicaties en leer je alle conventies om snel met deze bibliotheek aan de slag te gaan. Concreet ga je zelf aan de slag met code om componenten te schrijven (functies of classes), het doorgeven van props en events om componenten met elkaar te kunnen laten communiceren, het opmaken van componenten en het werken met externe gegevens en API's via http.
In de Introduction to React training wordt daarnaast aandacht besteed aan moderne werkwijzen voor React-componenten en -applicaties zoals het werken met React Hooks. Je maakt ook kennis met de wijze waarop state management kan worden uitgevoerd met Redux.
Doelgroep
De React Fundamentals/Introduction to React-training is bedoeld voor programmeurs en webontwikkelaars die hun front-end applicaties los van het back-end willen ontwikkelen en hiervoor hebben gekozen voor React. Ook back-end ontwikkelaars (bijvoorbeeld: PHP, Java en C#) kunnen zich de React-werkwijze en -syntaxis relatief snel eigen maken.
Leerdoelen
Na afloop van de React Fundamentals/Introduction to React-training ken je het React-ecosysteem en kun je zelf React-applicaties opzetten volgens best practices, onderhouden en uitrollen naar productie.
Voorkennis
Voordat je deelneemt aan deze training raden wij aan dat jij beschikt over de volgende kennis en vaardigheden:
- Kennis van het ontwikkelen van webapplicaties door middel van HTML, CSS en JavaScript.
- Enige kennis van Node.js en het installeren van softwarepakketten met NPM.
- Enige kennis van modern JavaScript, zoals classes, arrow functions en objectnotaties.
- Werken met een code-editor zoals Visual Studio Code (gratis), Jetbrains Webstorm (hiervoor is er een proefversie van 30 dagen beschikbaar) of vergelijkbaar.
- Kennis van de Engelse taal. Veel bronnen en naslagwerken zijn alleen in het Engels beschikbaar.
Ten slotte raden wij aan dat jij kennis hebt van een ander framework, zoals Angular, Vue of Svelte, echter is dit niet beslist noodzakelijk.
Onderwerpen
In de React Fundamentals/Introduction to React-training komen de volgende onderwerpen aan de orde:
Wat is React, overzicht van het front-end landschap
- Hoe ziet een React-applicatie eruit.
- Tooling – npx, create-react-app, React DevTools, Node.js en de browser.
- Je eerste React-project.
- De werkomgeving instellen.
- Een project maken met create-react-app.
- Het project starten.
- De startpagina aanpassen.
React-componenten en -compositie
- Class-based componenten vs. Function-based componenten.
- Data en state in componenten.
- Het principe van one-way data flow.
- Componenten nesten.
- Props doorgeven in componenten.
- “Lifting state up”.
- Korte introductie in React Hooks.
- Werken met gegevens.
- Externe gegevens laden en tonen.
- Detailgegevens tonen.
- Reageren op events.
- Class-based Lifecycle hooks.
- Wat zijn lifecycle hooks?
- ComponentDidMount().
- ComponentDidUpdate().
- ComponentWillUnmount().
- Verouderde lifecycle hooks.
React-componentenstyling
- CSS globaal en lokaal.
- Inline styles definiëren als constante.
- Werken met CSS Modules.
- Werken met CSS-preprocessors zoals SASS.
Gebruikersinvoer verwerken
- Werken met invoervelden.
- Meer formuliervelden: radio buttons, selectievakjes en tekstgebieden.
- Keuzes uit dropdown-lijsten verwerken.
Communicatie met externe API’s
- Hoe gaat React om met externe gegevens?
- Werken met axios.
- Ajax-calls instellen en afvuren.
- Resultaten van Ajax-requests verwerken.
- Een indicatie voor laden (of: Spinner) laten zien.
Werken met React Router
- Wat is routing in webapplicaties?
- Alternatief: Reach Router.
- Routing Basics – installatie, links naar routes.
- De actieve link afwijkende opmaak geven.
- Werken met Route Parameters.
- Navigeren via code.
React Hooks in detail
- Nogmaals: werken met Function-based components.
- De hook useState().
- De hook useEffect().
- ES6-syntaxis voor destructuring.
- Zelf hooks schrijven.
Een korte introductie in Redux
- Wat is State management?
- Waarom Redux?
- De basis van Store, Actions, Reducers en Dispatcher.
- Vervolgstappen.
Deployment: React-applicaties online publiceren
- React-applicatie uitrollen naar een productieserver.
- Publiceren op een lokale webserver.
- Publiceren bij een gratis online hosting provider.
Blijf op de hoogte van nieuwe ervaringen
Deel je ervaring
Heb je ervaring met deze cursus? Deel je ervaring en help anderen kiezen. Als dank voor de moeite doneert Springest € 1,- aan Stichting Edukans.Er zijn nog geen veelgestelde vragen over dit product. Als je een vraag hebt, neem dan contact op met onze klantenservice.