React Advanced Training
Level
IntermediateDuration
24h / 3 daysDate
Individually arrangedPrice
Individually arrangedReact Advanced Training
React is the most popular JavaScript library for building browser, mobile, and desktop applications. With its simple API, React belongs to the group of tools that are “easy to learn, but hard to master.” With its growing popularity, more packages have been created to improve working with React.
What You Will Learn
- Advanced techniques for optimizing applications
- Tools and patterns for creating more readable, scalable, and testable code
- Various methods of application state management
- Improved skills in typing for safer, more precise coding
- Modern libraries such as react-query or RxJS
Who is this training for?
Experienced React developers with solid foundations who want to expand into advanced areas-
Frontend developers working on large projects who want to learn optimization techniques and advanced state management
-
Developers using TypeScript who want to better understand typing in React
Training Program
Day 1
Styling
- Problems of basic styling in React applications
- CSS Modules
- CSS-in-JS (styled-components)
- Theming concepts and implementation
TypeScript
- Typing native DOM and React events
- Typing component interfaces and props
- Typing state management code
- Type vs interface – differences and use cases
- Generic types
- Special types: unknown, void, never
- Type guards
Forms
- react-hook-form:
- Basics
- Validation
- Reacting to form changes
- Dynamic fields
- Schema validation with TypeScript using Zod
- Integrating Zod with forms
Day 2
Additional Packages
- react-query:
- Queries
- Mutations
- Query optimization
- Internationalization with react-i18next
React Reconciliation and Optimization
- React diffing algorithm
- Keys and their impact on rendering
- Code splitting:
- React.Suspense
- React.lazy
- Render optimization:
- React.memo
- Optimization hooks
- Refs
- Using React DevTools Profiler
- useEffect vs useLayoutEffect
Day 3
State Management
- Centralized vs distributed state:
- Context API
- Redux
- Render props pattern
- Children as props
- Higher-Order Components (HOC)
- Custom hooks
- Pub-Sub pattern
Redux Enhancements
- How Redux middleware works
- Creating custom middleware
- redux-saga – side effects management
