About the course
This intensive course provides a deep dive into the React ecosystem, moving beyond basic syntax to master the architectural patterns used by professional engineering teams. You will learn to build scalable user interfaces by leveraging functional components, custom hooks, and the latest concurrency features. The curriculum focuses on writing clean, maintainable code that exploits React’s "one-way data flow" and virtual DOM reconciliation for maximum efficiency.
We explore the integration of modern tools like Vite, the nuances of the Context API, and robust routing strategies for single-page applications. By the end of the workshop, you will have a comprehensive understanding of how to structure complex frontend projects and optimize component rendering for production-grade performance.
Instructor-led online and in-house face-to-face options are available - as part of a wider customised training programme, or as a standalone workshop, on-site at your offices or at one of many flexible meeting spaces in the UK and around the World.
-
By the end of this course, attendees will be able to:
- Construct modular, reusable UIs using functional components and JSX.
- Manage complex application states with Hooks (useState, useReducer) and the Context API.
- Implement seamless client-side navigation using React Router.
- Integrate asynchronous data fetching and handle side effects with useEffect and the Actions API.
- Optimize application performance using memoization and code-splitting.
-
This course is designed for professional web developers and software engineers who have a solid foundation in modern JavaScript (ES6+). It is ideal for teams looking to standardise their frontend stack on React or developers migrating from legacy frameworks who require a rigorous, utility-focused introduction to the library.
It is ideal for:
Professional Software Engineers looking to modernize their React skillset for the 2026 standard.
Frontend Architects tasked with migrating legacy React codebases to React 19/20.
Corporate Development Teams needing a rigorous, standardized approach to type-safe UI development.
Full-Stack Developers wanting to master the "Server Component" shift in the React ecosystem.
-
Ideally you should have attended our Modern JavaScript training course or have equivalent skills:
Proficiency in HTML5 and CSS3.
Strong knowledge of JavaScript (ES6+), including destructuring, arrow functions, and asynchronous patterns (Promises/Async-Await).
Familiarity with Node.js and npm/terminal basics is beneficial but not essential.
We can customise training to match your team's experience and needs - with more time and coverage of fundamentals for newer developers, for instance.
-
This React course is available for private / custom delivery for your team - as an in-house face-to-face workshop at your location of choice, or as online instructor-led training via MS Teams (or your own preferred platform).
Get in touch to find out how we can deliver tailored training which focuses on your project requirements and learning goals.
-
Foundations of Modern React
Declarative vs Imperative UI patterns
The Virtual DOM and Reconciliation algorithm
Vite-based project architecture
JSX syntax and strict-mode development
Component composition and Props-drilling mitigation
State Management and Hooks
Local state with useState
Managing complex logic with useReducer
Synchronizing with useEffect and Cleanup functions
Sharing state via the Context API
Authoring Custom Hooks for logic reuse
Interactive Forms and Data Flow
Controlled vs Uncontrolled components
Form validation strategies
Handling user input and event propagation
Working with the React 19 Actions API for form submissions
Managing "Lifting State Up" patterns
Routing and Single Page Applications
Configuring the BrowserRouter and Routes
Dynamic Routing and URL parameters
Nested Routes and Layout components
Programmatic navigation and protected routes
Lazy loading components with React.lazy and Suspense
Networking and Asynchronous Operations
Fetching data from RESTful APIs
Handling Loading and Error states
Optimistic UI updates
Integrating third-party libraries (e.g., Axios)
Introduction to Server Components and Data Streaming
Performance and Testing
Optimizing renders with memo, useMemo, and useCallback
Profiling React applications with DevTools
Unit testing components with Vitest and React Testing Library
Best practices for production deployments and CI/CD integration
-
Official React Documentation: https://react.dev
Vite Build Tool: https://vitejs.dev
React Router Docs: https://reactrouter.com
MDN Web Docs (JavaScript): https://developer.mozilla.org
Trusted by