React Fundamentals

Cursus React Fundamentals

In de cursus React Fundamentals leert u de basisprincipes van React, een krachtige bibliotheek voor het bouwen van gebruikersinterfaces. React maakt gebruik van een uniek componentmodel, waarbij subcomponenten de bovenliggende componenten niet beïnvloeden tijdens updates, wat zorgt voor een goede scheiding in een single page application. Deze cursus biedt een uitgebreide introductie tot de kernconcepten van React, waardoor u in staat bent om zelf een React-applicatie te ontwikkelen.

React Components

React-components zijn de bouwstenen van elke React-applicatie. De cursus behandelt hoe u effectieve componenten kunt maken en beheren, en hoe deze componenten samenwerken binnen de applicatie. U leert ook hoe u state en props gebruikt om gegevens in uw applicatie te beheren.

Virtual DOM

Na een introductie over de voornaamste kenmerken van React, zoals de Virtual DOM, JSX, component renderers en callback functions, komt aan de orde hoe u een eerste React-app maakt met de juiste combinatie van developer tooling zoals React, Webpack en Babel. Deze tools zijn essentieel voor het optimaliseren van uw ontwikkelingsproces en zorgen ervoor dat uw applicatie efficiënt presteert.

JSX en React Views

React maakt gebruik van de functionele programmeerstijl, waarvan de belangrijkste kenmerken in JavaScript worden besproken. U krijgt inzicht in React Views die een geneste component tree met HTML custom tags op het scherm weergeven. Daarnaast gaat de cursus ook in op het bouwen van componenten met de JavaScript-extensie JSX, waarmee u de syntaxis van JavaScript en HTML kunt combineren.

Routing en Forms

Tenslotte komen ook Forms, Validatie en Routing in React-applicaties aan de orde. U leert hoe u gebruikersinvoer effectief kunt beheren en navigatie kunt implementeren in uw applicaties.

Redux

De cursus wordt afgesloten met een behandeling van het Redux Framework dat veelal in combinatie met React wordt gebruikt. Redux helpt bij het beheren van de applicatiestatus en maakt het eenvoudiger om gegevens door uw applicatie te stroomlijnen. Voor meer informatie over Redux kunt u de officiële documentatie raadplegen.
Om uw vaardigheden verder te ontwikkelen, kunt u ook onze cursus JavaScript Programmeren bekijken, die een sterke basis biedt voor het werken met React.

Doelgroep Cursus React Fundamentals

De cursus React Fundamentals is bestemd voor developers die de ReactJS JavaScript library willen leren voor het bouwen van moderne state of the art web applicaties.

Voorkennis cursus React Fundamentals

Ervaring met programmeren in een moderne programmeertaal is vereist. Kennis en ervaring met JavaScript is bevorderlijk voor een goede begripsvorming.

Uitvoering Training React Fundamentals

De theorie wordt behandeld aan de hand van presentatie slides. De concepten worden toegelicht met demo's. De theorie wordt afgewisseld met oefeningen. De cursustijden zijn van 9.30 tot 16.30.

Officieel Certificaat React Fundamentals

De deelnemers krijgen na het goed doorlopen van de cursus een officieel certificaat React Fundamentals.

Modules

Module 1 : React Intro

• What is React?
• React Features
• Benefits of React
• JSX
• Virtual DOM
• Webpack Module Builder
• Webpack Features
• Webpack.config
• ES6 Features
• Babel
• Benefits of Redux
• React Scripts

Module 2 : Components

• React Components
• JSX Component
• React and JSX
• JSX versus JavaScript
• Single Root
• JSX XSS Protection
• Props Collection
• Props in Variables
• propTypes
• List of Props Types
• Default Props
• Rendering State

Module 3 : Composition and LifeCycle

• Composing Components
• Refs and DOM
• Components with Behavior
• Pass State Update
• Accessing Child Components
• Mounting and Unmounting
• Components Lifecycle
• Updating Events
• Dynamic Tables
• ReadOnly and ReadWrite
• Higher Order Components
• Hooks

Module 4 : Forms and Validation

• ReadOnly
• ReadWrite
• Forms in React
• Controlled Components
• Uncontrolled Components
• Textarea Tag
• Select Tag
• Field Level Validation
• Form Level Validation
• Submit Handlers

Module 5 : React Routing

• Defining Routes
• Default Route
• Not Found Route
• Nesting and Params
• Multiple Params
• Redirects
• Include External Routes
• Running the Router
• Using Universal Rendering
• Access Router Methods

Module 6 : Redux Framework

• React with Redux
• Three Principles
• Redux Flow
• Connecting to React
• Store
• Actions
• Reducer
• Data Flow
• Unidirectional
• Async Flow