Next.js
Beschrijving
De cursus behandelt de volgende technische inhoud:
-
De fundamenten van Next.js
Client- en servercomponenten
○ Routing instellen
○ De verschillende soorten rendering
Serveracties
-
Een Next.js-applicatie implementeren
Wat zijn de doelstellingen van de opleiding?
-
Begrijp de fundamentele principes van Next.js en de rol ervan in webontwikkeling.
-
Leren hoe je moderne webapplicaties maakt met de geavanceerde functies van Next.js.
-
Client-side routing en state management met Next.js onder de knie krijgen.
-
De verschillende soorten rendering begrijpen voor optimaal gebruik.
-
Weten hoe u Next.js toepassingen kunt implementeren op verschillende omgevingen.
Wat moet je weten om de cursus te volgen?
-
Kennis van Javascript of Typescript
-
Ervaring met ontwikkeling in React
-
Kennis van de Node-omgeving en backend-concepten
Opleidingsprogramma
De grondbeginselen van Next.js
-
Inleiding tot Next.js
Presentatie van Next.js en de voordelen ervan ten opzichte van een React-clienttoepassing.
○ Presentatie van de "Page" en "App" router
○ Presentatie van client- en servercomponenten
○ Aanmaken van een nieuw "App" project en basisstructuur.
Next.js optimalisatiecomponenten
Next/Font
○ Volgende/Afbeelding
Routing met Next.js
○ De hiërarchie van "App router" componenten
○ Het geïntegreerde routeringssysteem gebruiken
○ Dynamische pagina's maken met routeparameters.
Server componenten
Routegerelateerde gegevens ophalen
○ Verbruiken van een gegevensbron (Web API of DB)
-
Client componenten
○ Ophalen van routegerelateerde gegevens
○ React hooks gebruiken in componenten
Server acties
De richtlijn "server gebruiken
Serveracties instellen
Een serveractie gebruiken in een clientcomponent
Typen rendering
Statische rendering
Dynamische rendering
Component streaming
Formulieren beheren in een servercomponent
Gegevensverwerking
Validatie instellen
Een Next.js-applicatie implementeren
-
Productiebestanden genereren
-
Een applicatie hosten op verschillende platforms (Vercel, Netlify, etc.)
Praktische oefeningen
-
Een applicatie maken met Next.js met behulp van "App" routing
-
Een formulier opzetten in Next.js
-
Uitrollen van een Next.js applicatie op Vercel