Master React components, hooks, and routing to create dynamic user interfaces
React is a JavaScript framework widely used for creating interactive and responsive user interfaces. It offers developers the ability to create reusable components, simplifying development and maintenance. What's more, it reduces performance issues, delivering a smoother development experience.
Is it for you ?
IT specialists.
Prerequisites
Advanced knowledge of JavaScript is required.
What You'll Walk Away With
- ✓ Build interactive user interfaces using JSX, components, and props
- ✓ Manage state and user interactions with hooks, events, and lifecycle methods
- ✓ Design secure forms with validation and controlled inputs
- ✓ Implement seamless navigation using React Router and its hooks
- ✓ Structure applications with global state management using Context API and Redux Toolkit
Training content
1 Introduction
- Module objectives
- Framework comparison
- Historical background
- Presentation
- Conclusion
In this module, you can watch a 00:05 video.
2 Installation
- Module objectives
- Installing Node.js
- Installing WebStorm
- Creating a first project
- Basic structure of the first project
- Demonstration Installing and creating your first project
- Conclusion
In this module, you can watch a 00:07 video.
3 The components
- Module objectives
- Introduction to JSX
- The variable component
- The function component
- The class component
- Props
- Lists and keys
- Demonstration Creating a component
- Practical exercises
- Correction TP 1/2
- Correction TP 2/2
- Conclusion
In this module, you can watch a 00:42 video.
4 Energizing a project
- Module objectives
- Basic state management
- Events
- Component life cycle
- Conditional display
- Demonstration Managing states
- Practical exercises
- Correction TP 1/2
- Correction TP 2/2
- Conclusion
In this module, you can watch a 00:48 video.
5 Forms
- Module objectives
- Basic form management
- Controlled forms
- Data validation and security
- Demonstration Forms management
- Practical exercises
- Correction TP 1/3
- Correction TP 2/3
- Correction TP 3/3
- Conclusion
This module allows you to view a video lasting 01h30.
6 Functional programming and hooks
- Module objectives
- Introduction to functional programming
- State hook
- Effect hook
- Reference hook
- Custom and other hooks
- State optimization
- Demonstration Forms management in functional programming 1/2
- Demonstration Forms management in functional programming 2/2
- Practical exercises
- Correction TP 1/2
- Correction TP 2/2
- Conclusion
This module contains a 01:29 video.
7 React Router
- Module objectives
- Introduction to React Router
- BrowserRouter, Routes and Route
- Route not found and route with params
- The Link component
- React Router hooks
- Demonstration Using React Router
- Practical exercises
- Correction TP 1/2
- Correction TP 2/2
- Conclusion
In this module, you can watch a video lasting 01h07.
8 Application context
- Module objectives
- Introduction to application context
- API Context
- Reducers
- Redux Toolkit
- Context slices and wrapping
- Retrieving and modifying values in the store
- Demonstration Context with API Context
- Demonstration Context with Redux Toolkit
- Practical exercises
- Correcting the tutorial
- Conclusion
In this module, you can watch a 00:52 video.
📌 Practical information
100% online training. Accessible anytime from anywhere for one year. If you have any questions about registration, the language of instruction, or the cancellation terms, please consult our FAQ