Advanced React Patterns

12h 7m 27s
English
Paid

Advanced Patterns React - is over 700 minutes of instructional material focused on studying advanced patterns in React, from data preloading to navigation, authentication, optimistic updates, and other topics.

Read more about the course

The course includes:

  • Advanced React Query patterns: complex caching strategies, data prefetching, cache invalidation, and optimistic updates.
  • Complete type safety with tRPC and TypeScript: eliminate runtime errors and enhance efficiency with robust code.
  • Powerful routing and navigation with Tanstack Router: dynamic handling of URLs and search parameters, custom router implementations, and an optimized user navigation experience.
  • Robust component and code architecture patterns: creating maintainable, reusable, and scalable components and architectures.
  • Authentication, user management, and secure integrations: implementing secure authentication, user profiles, forms, validations, file uploads, and integrations such as OpenStreetMap.
  • Mastering monorepos with pnpm Workspaces: sharing dependencies, libraries, and best practices for large frontend projects.

Each concept presented in the course is directly applicable to building large, professional applications that are in demand by employers and trusted by users.​

Watch Online Advanced React Patterns

Join premium to watch
Go to premium
# Title Duration
1 Course introduction 13:16
2 Setting up the dev environment 03:29
3 Project overview 09:55
4 Managing dependencies 06:01
5 UI components 02:46
6 Backend overview 05:53
7 Database and running the project 05:23
8 Implementing the first feature 12:10
9 Setting up the tRPC client 17:28
10 Fetching and displaying experiences 26:26
11 Implementing infinite scrolling 11:24
12 Fetching and displaying comments 13:45
13 Implementing adding comments 15:51
14 Implementing editing comments 09:47
15 Implementing deleting comments 06:34
16 Caching and invalidation deep dive 08:16
17 Setting up Tanstack Router 21:48
18 Creating the first route 05:00
19 Loading data through loaders 15:36
20 Configuring dynamic routes 18:27
21 Handling page errors 06:46
22 Handling 404 errors 05:52
23 Search params and filters 16:38
24 Implementing user avatars 05:49
25 Implementing user profiles 13:05
26 Setting up authentication and logging in 37:01
27 Logging out and protected routes 09:17
28 Implementing account creation 05:38
29 Implementing changing email 09:09
30 Implementing changing password 06:26
31 Implementing editing profile 27:07
32 Implementing editing experiences 27:20
33 Implementing deleting experiences 18:09
34 Restoring authentication to comments 04:48
35 Implementing file uploads 04:59
36 Implementing attending experiences 30:39
37 Implementing unattending experiences 02:33
38 Optimistic updates deep dive 19:37
39 Fetching and displaying attendees 23:14
40 Showing following and follower lists 06:18
41 Implementing following users 16:17
42 Implementing unfollowing users 02:53
43 Optimistic adding comments 22:33
44 Optimistic editing comments 04:14
45 Optimistic deleting comments 03:24
46 Implementing notifications 26:00
47 Implementing a favorite system 22:56
48 Implementing tags and multi-select 20:27
49 Implementing date and time pickers 05:28
50 Implementing maps and locations 28:25
51 Implementing creating listings 09:09
52 Managing experience attendees 13:34
53 Implementing comment likes 12:29
54 Bug fixes and improvements 01:03
55 (Improvement) Reduce duplication of optimistic updates 10:48
56 (Bug Fix) Fixing attendees invalidation 07:47
57 Conclusion and next steps 10:20

Similar courses to Advanced React Patterns

React Fundamentals

React Fundamentalsui.dev (ex. Tyler McGinnis)

Category: React.js
Duration 4 hours 36 minutes 46 seconds
The Modern React 18 Bootcamp - A Complete Developer Guide

The Modern React 18 Bootcamp - A Complete Developer Guideudemy

Category: React.js
Duration 20 hours 35 minutes 57 seconds
React - The full course

React - The full coursefireship.io

Category: React.js
Duration 1 hour 20 minutes 10 seconds
Build fancy landing pages with React and Threejs

Build fancy landing pages with React and ThreejsPaul Henschel (@0xca0a)

Category: React.js, Three.js
Duration 38 minutes 9 seconds
Create your Dream Apps with Cursor and Claude AI

Create your Dream Apps with Cursor and Claude AIdesigncode.io

Category: React.js, Other (AI)
Duration 5 hours 46 minutes 6 seconds
Modern React with Redux [2023 Update]

Modern React with Redux [2023 Update]udemyStephen Grider

Category: React.js, Redux
Duration 37 hours 44 minutes 46 seconds
React Data Fetching: Beyond the Basics

React Data Fetching: Beyond the Basicsfullstack.io

Category: React.js
Duration 2 hours 40 minutes 15 seconds
Scale React Development with Nx

Scale React Development with Nxegghead

Category: React.js, Other (Tools)
Duration 1 hour 34 minutes 10 seconds