Advanced React Patterns
12h 7m 27s
English
Paid
Course description
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
0:00
/ #1: Course introduction
All Course Lessons (57)
| # | Lesson Title | Duration | Access |
|---|---|---|---|
| 1 | Course introduction Demo | 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 |
Unlock unlimited learning
Get instant access to all 56 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.
Learn more about subscriptionComments
0 commentsWant to join the conversation?
Sign in to commentSimilar courses
Next.JS with Sanity CMS - Serverless Blog App (w/ Vercel)
Sources: udemy
We will start with integration of a very clean application layout I have prepared for you. We will follow latest practices of React and Next JS, this means we w
13 hours 5 minutes 9 seconds
Master Custom React Hooks with TypeScript
Sources: fullstack.io
Welcome to the course "Creating a Custom React Hook npm Package using React and TypeScript"! In this course, we will be developing...
2 hours 21 minutes 3 seconds
Full Stack HATEOAS: Spring Boot 2.1, ReactJS, Redux
Sources: udemy
Full Stack introduction to HATEOAS. In this course, you will learn the core concepts of HATEOAS as well as how to leverage this on a ReactJS Application. HATEOAS stands for: Hyp...
5 hours 51 minutes 37 seconds
React Supabase Full Course
Sources: fireship.io
Build and deploy a full-stack, production-ready web app with Supabase, React, and Postgres. The Supabase Course is a project-based course that builds a Reddit-inspired web app f...
1 hour 39 minutes 49 seconds
Fullstack React with Typescript
Sources: fullstack.io
Fullstack React with TypeScript is the complete guide to using TypeScript with React. Learn TypeScript patterns with React additional ecosystem advice (testing, redux, SSR) by b...
10 hours 16 minutes 46 seconds