5 days course
React (+NextJS)
Unlock the Power of Modern Web Development with React, Redux & Router with Hooks!
Are you ready to take your web development skills to the next level?
Dive into the world of dynamic, responsive, and state-of-the-art web applications with our comprehensive course on React, Redux, and Router with Hooks!
Facebook has created a functional approach to tackle traditional complexities in JavaScript: React (open source). Criticized in 2013 but used since 2015 by the dominant websites in the world.
In this course you will learn about React, hooks and its ecosystem. Redux and React Router are covered in depth. EcmaScript 202X (or TypeScript), npm, Babel and Webpack are used in the course.
Depending on their own project requirements, participants can choose to do exercises that focus on function or class components as well as on JavaScript or TypeScript. There are solutions for every situation.
New features in React are added to the course as soon as they are released. Then you can instantly add React parts to both new and existing websites.
Audience
This course is intended for professional developers who have experience with HTML and JavaScript 5 programming
Course content
- Root / Boostrap React App
- Render
- Fragments
- Properties
- Head parts, like title, meta, style, script (React 19+)
- Databinding incl. Conditional and List rendering
- Portals
- Events & Event Object
- State: Initialising
- State: Change sync vs async
- Hooks: useState, useCallback
- Automatic batching
- XSS attacks / protection
- Single responsibility
- Error Boundaries
- Reusable components (prop-types / typescript)
- Default property values
- React Actions (React 19+)
- Form Actions (React 19+)
- useEffect, useLayoutEffect
- DOM Interaction: useRef
- Connect with REST service
- NextJS data fetching
- Pages
- Layout
- Head
- Code Splitting
React Router
- Static routing
- No match (like a 404)
- Dynamic routing
- Redirection
- Prompt
- Nested routes
- Code Splitting
- Context (Pattern: Implicit state)
- Pattern: Destructuring props and state
- Optional: Transclusion
- Optional: Render Props
- Optional: Higher Order Components
(partly covered elsewhere in the course)
- useMemo, useCallback hooks
- memo() Higher-Order Component
- Event Handlers: inline vs method
- NextJS Optimisations
- React Profiler
- Immutable JavaScript: List; Map; Set; Convert from and to raw JavaScript objects; Nested structures; Lazy sequences; Equality; Batch mutations
- Pattern: Presentational vs Container Components
- React-Redux
- Optional: Redux Middleware
- Optional: Async actions
- Optional: Redux Undo
Instructor
Rick is a senior consultant and trainer from The Netherlands.
He has over 25 years of professional experience while working in small, large and fast growing organisations.
His passion is simplicity, wellwritten code and team dynamics.
He is specialised in front-end technologies and speaks regularly about these topics at international events.
Do you have any course related questions, please contact
- Mette Rosenløv Vad
- Konsulent
- +45 72202432