Description

In this class, students learn the most advanced and up-to-date techniques and tools in React development. Students will be challenged throughout the course with hands-on exercises, during which they’ll get hands-on experience with the topics covered in lectures and demos.

TARGET AUDIENCE

This course is designed for developers who are already familiar with React and want to learn how to make the best use of it and move past the basics.

ABOUT THE AUTHOR

Chris Minnick has been a full stack developer for over 25 years, and a professional author and trainer for 15 years. He has been the lead front-end React developer for several startup companies and has been building web and mobile user interfaces with React since 2015. Chris has produced online video courses for Pluralsight and O’Reilly Media and is the author of JavaScript All-In-One For Dummies and Beginning React JS Foundations.

OBJECTIVES

All students will:

• Gain a deeper understanding of Redux
• Learn to write tests for Redux code
• Learn how to improve Redux UI performance
• Use server-side rendering
• Learn about advanced routing techniques
• Understand micro-frontends
• Learn about security and accessibility concerns
• Learn React best practices

DURATION

3-day

OUTLINE

1. Introduction
2. React Component Lifecycle
   1. Mounting Phase
   2. Updating Phase
   3. Unmounting Phase
   4. Error Handling Phase
   5. Lifecycle Methods in Hooks
   6. Lifecycle Best Practices
3. Function vs. Class Components
   1. useState
   2. useEffect
   3. Custom Hooks
   4. State Management in Class Components
   5. State Management in Function Components
   6. Lifecycle Methods in Class Components
   7. useEffect
   8. Performance Optimization in Class Components
   9. Performance Optimization in Function Components
4. React Router
   1. Router Component
   2. Routes Component
   3. Route Component
   4. Link and NavLink Components
   5. Navigate
   6. Dynamic Routing
   7. Outlet Components
   8. Nested Routes
   9. Implementing Protected Routes
   10. Using the Redirect component
   11. Hooks in React Router
5. Redux
   1. Actions
   2. Reducers
   3. Store
   4. Redux Middleware
   5. Redux Thunk
   6. Async Actions
   7. Redux Saga
   8. Redux Toolkit
   9. createAction
   10. createReducer
   11. createSlice
   12. createSelector
6. Redux DevTools
7. react-redux
8. Hooks API
9. Testing Redux
   1. Types of Tests in Redux
   2. Jest
   3. React Testing Library
   4. Unit Testing Actions
   5. Unit Testing Reducers
   6. Testing Middleware
   7. Mocking Middleware
   8. Spy Functions
   9. Integration Testing
   10. Store Integration
   11. Component Integration
   12. Testing Redux: Snapshot Testing
   13. Testing Redux: Best Practices
10. Server-Side Rendering
    1. Client-Side Rendering vs Server-Side Rendering
    2. Tools for SSR in React
    3. Implementing SSR with Next.js
    4. Advantages of SSR
    5. Drawbacks of SSR
11. Code Splitting