Opleiding: React Fundamentals
In the course React Fundamentals you will learn to use the open source ReactJS JavaScript library for the development of modern Single Page Applications.React Components
React has a programming model where child component do not influence parent components in an update, providing a clean separation of components in a single-page application.
Virtual DOM
After introducing the main characteristics of React such as the Virtual DOM, JSX, component renderers and callback functions, it is discussed how to create a first React app with the right combination of developer tooling like React, Webpack and Babel.
JSX
React uses the functional programming style whose main characteristics in JavaScript are highlighted. Next attention is paid to React Views that put a nested component tree with HTML custom tags on the screen. The creation of components with the JavaScript extension JSX is discussed as well.
Routing en Forms
Also Forms, Validation and Routing in React Applications are on the course schedule.
Redux
Finally the use of the Redux Framework that is often used in combination with React is discussed.
Audience React Fundamentals Course
Developers who want to learn how to program with the ReactJS JavaScript library for building modern state of the art web applications.
Prerequisites Course React Fundamentals
Experience with programming in a modern programming language is required. Knowledge and experience with JavaScript is beneficial for a good understanding.
Realization Training React Programming
The theory is treated on the basis of presentation slides. The concepts are illustrated with demos. The theory is interspersed with exercises. The course times are from 9.30 to 16.30.
Certification React Fundamentals
The participants receive an official certificate React Fundamentals after successful completion of the course.
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