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

The Complete Guide to Advanced React Patterns (2020)

The Complete Guide to Advanced React Patterns (2020)udemy

Category: React.js
Duration 6 hours 1 minute 51 seconds
React with TypeScript

React with TypeScriptui.dev (ex. Tyler McGinnis)

Category: TypeScript, React.js
Duration 2 hours 53 seconds
MERN Stack Front To Back: Full Stack React, Redux & Node.js.

MERN Stack Front To Back: Full Stack React, Redux & Node.js.udemyBrad Traversy

Category: React.js, Node.js, MongoDB, Redux
Duration 11 hours 52 minutes 29 seconds
React JS 19 Crash Course | Build an App and Master React in 2 Hours
Microfrontends with React: A Complete Developer's Guide

Microfrontends with React: A Complete Developer's GuideudemyStephen Grider

Category: React.js
Duration 9 hours 2 minutes 34 seconds
React Formula - Learn Frontend Development

React Formula - Learn Frontend DevelopmentAlvin Zablan

Category: React.js
Duration 23 hours 47 minutes 37 seconds
React Query

React Queryui.dev (ex. Tyler McGinnis)

Category: React.js
Duration 7 hours 1 minute 30 seconds
React - The Complete Guide 2024

React - The Complete Guide 2024udemyAcademind Pro

Category: React.js
Duration 64 hours 33 minutes 17 seconds
Chrome Extension Mastery: Build Full-Stack Extensions with React & Node.js

Chrome Extension Mastery: Build Full-Stack Extensions with React & Node.jsRyan Fitzgerald

Category: React.js, Others, Node.js
Duration 10 hours 3 minutes 45 seconds
Crash Course: Build a Full-Stack Web App in a Weekend!

Crash Course: Build a Full-Stack Web App in a Weekend!udemy

Category: JavaScript, React.js, HTML, CSS
Duration 12 hours 13 minutes 30 seconds