Learn React 19 with Epic React v2

26h 51m 3s
English
Paid
September 26, 2024

Are you ready for the React 19 revolution? The most in-demand JavaScript framework has received a massive update! You are already familiar with React, but React 19 introduces 3 major paradigmatic changes that will transform your code (and possibly your life):

React Suspense and Transitions: eliminate complex workarounds and take full control of data loading, both synchronously and asynchronously, to deliver the smoothest user experience possible. Form and Server Actions: forget about useEffect hacks forever (finally!), creating the exact data input experience you need for SSR, SSG, and SPA applications. 'use client' and 'use server': write server and client code in harmony, avoiding inconvenient transitions.

More

Your code will become better, and the experience of writing - more enjoyable. React 19 is more fun as it finally provides a full set of tools for creating highly interactive, modular, and powerful web applications without compromises.

And even if you already have experience with React, you'll be able to refresh your knowledge using the best tools. It's a great time to start!

Mastering all of this is not an easy task. But it's worth it.

Now, as an experienced React developer, the key question arises: How will you master React 19?

I have taught React to over 30,000 people

Epic React v1 helped many start a career in React and develop it. But I knew it could be improved… So, when I decided to create new material for React 19, I radically changed the entire learning process.

But first and foremost, let's discuss an important point about learning React, no matter when, where, and how you want to learn it.

Over the past 10 years, I've learned a lot about the learning process.

And the main lesson?

Not all learning is equally useful. You've heard the old saying: "It's not what you know, but who you know"?

Developers need to update it: "It's not what you know, but how you know it." The way you learn can affect your entire career.

And here's the problem:

The way most people learn React can actively hinder your future progress. React is complex. It consists of many components. No one wants to waste time studying the documentation for each one before starting work. We all want to jump right into the most interesting part - using these tools together to create projects.

Creating something is moving forward.

But it's a trap.

What distinguishes true experts from everyone else is not having specialized, advanced knowledge. It's a complete mastery of the basics. It's understanding the components. It's knowing how each part of the process works in harmony to create a whole. It's the ability to go beyond what you've done before and approach each new task using all the tools you have.

This is what creates real confidence.

But when you strive to "quickly" achieve results by blindly copying code you don't yet understand, you miss the most important part. You miss the basics you'll need every day in your career: planning, designing, debugging, maintaining, scaling. You deprive yourself of future growth. You undermine your own confidence.

Fortunately, there's a better way.

How to become an expert

Based on observations, experiments, study, hundreds of hours of live teaching, and feedback from tens of thousands of my students...

Here's the path to true mastery:

  • Learn one concept at a time
  • Start with the simplest version
  • Add complexity gradually, each exercise builds on the previous one
  • Write practical code, check your work against best practices, get feedback
  • Practice taking advice and sharing code with colleagues
  • Don't skip anything (even if it seems "simple" or "obvious")

It's really that simple! Although "simple" is not the same as "easy."

But if you're ready to invest, the right learning will pay off for a lifetime.

You will become an expert.

And you can do this with Epic React v2.

Epic React v2 will take you from "what is JSX?" to developing a full, professional, scalable application in a team environment. When you switch to Epic React v2, you'll get instant access to 7 workshops with 240 small lessons - all new, all about React 19, and 100% TypeScript. All you need to do is log in and get started on your first exercise.

Epic React v2 is entirely based on "pure React" and is suitable for anyone using React in any field.

You will explore and review all aspects of React 19 - both classic and new - separately and together.

Each new lesson will build on the previous one.

In the end, you will develop projects such as blog search, integration of non-React UI libraries, tic-tac-toe, a form for new users, optimized globe rendering, a calculator, a counter, city list search, and creating your own framework for React Server Components.

Along the way, you will reinforce professional programming practices.

You will master form handling, one of the most challenging (and most powerful) parts of interactive web development.

You will learn to develop performance-efficient applications and optimize your existing code. (Bonus: these same techniques apply to non-React applications too!)

You will find out how to use AI-based helpers to significantly increase productivity. I use mine in all the Epic React video lessons. (They won't do the work for you, of course, but they can significantly help!)

So whether you're an intermediate developer looking to refresh your foundational knowledge…

…or an experienced React developer eager to learn what's new in React 19…

If you have been searching for a path to true mastery in React 19, you’ve found it with Epic React v2.

Watch Online Learn React 19 with Epic React v2

Join premium to watch
Go to premium
# Title Duration
1 001 Intro 02:09
2 002 Hello World in JS p 00:20
3 003 Hello World in JS s 04:55
4 004 Generate the Root Node p 00:17
5 005 Generate the Root Node s 02:13
6 006 Dad Joke Break 00:26
7 007 Intro to Raw React APIs 03:06
8 008 Create React Elements p 00:56
9 009 Create React Elements s 03:05
10 010 Nesting Elements p 00:25
11 011 Nesting Elements s 03:32
12 012 Deep Nesting Elements p 00:30
13 013 Deep Nesting Elements s 01:18
14 014 Dad Joke Break Raw React APIs p 00:27
15 015 Intro to Using JSX s 02:49
16 016 Compiling JSX p 01:08
17 017 Compiling JSX s 04:52
18 018 Interpolationp p 03:33
19 019 Interpolation s 04:27
20 020 Spread props p 01:23
21 021 Spread props s 04:29
22 022 Nesting JSX p 00:37
23 023 Nesting JSX s 03:22
24 024 Fragments p 02:10
25 025 Fragments s 03:25
26 026 Dad Joke Break Using JSX 00:25
27 027 Intro to Custom Components 01:30
28 028 Simple Function p 01:15
29 029 Simple Function s 02:07
30 030 Raw API p 01:37
31 031 Raw API s 03:24
32 032 JSX Components p 01:57
33 033 JSX Components s 02:30
34 034 Props p 00:50
35 035 Props s 01:47
36 036 Dad Joke Break Custom Components 00:36
37 037 Intro to TypeScript 06:48
38 038 Props p 01:17
39 039 Props s 02:01
40 040 Narrow Types p 00:51
41 041 Narrow Types s 01:27
42 042 Derive Types p 02:06
43 043 Derive Types s 01:20
44 044 Default Props p 01:02
45 045 Default Props s 02:32
46 046 Reduce Duplication p 01:32
47 047 Reduce Duplication s 02:30
48 048 Satisfies p 01:02
49 049 Satisfies s 01:06
50 050 Dad Joke Break TypeScript 00:51
51 051 Intro to Styling 04:34
52 052 Styling p 00:29
53 053 Styling s 01:14
54 054 Custom Component p 02:14
55 055 Custom Component s 05:47
56 056 Size Prop p 00:44
57 057 Size Prop s 04:23
58 058 Dad Joke Break Styling 00:24
59 059 Intro to Forms 03:59
60 060 Form p 00:39
61 061 Form s 02:08
62 062 Form Action p 01:47
63 063 Form Action s 01:06
64 064 Input Types p 00:28
65 065 Input Types s 03:20
66 066 Submission p 02:00
67 067 Submission s 13:28
68 068 Form Actions p 00:23
69 069 Form Actions s 02:57
70 070 Dad Joke Break Forms 00:21
71 071 Intro to Inputs 01:03
72 072 Checkbox p 00:51
73 073 Checkbox s 02:48
74 074 Select p 00:45
75 075 Select s 02:46
76 076 Radios p 01:43
77 077 Radios s 02:52
78 078 Hidden Inputs p 01:04
79 079 Hidden Inputs s 01:13
80 080 Default Value p 03:11
81 081 Default Value s 05:37
82 082 Dad Joke Break Inputs 00:41
83 083 Intro to Error Boundaries 05:29
84 084 Composition p 00:49
85 085 Composition s 03:23
86 086 Other Errors p 01:52
87 087 Other Errors s 02:51
88 088 Reset p 01:30
89 089 Reset s 01:35
90 090 Dad Joke Break Error Boundaries 00:44
91 091 Intro to Rendering Arrays 05:37
92 092 Key prop p 01:37
93 093 Key prop s 01:51
94 094 Focus State p 01:08
95 095 Focus State s 02:14
96 096 Key Reset p 00:53
97 097 Key Reset s 01:30
98 098 Dad Joke Break Rendering Arrays 00:26
99 099 Outro to React Fundamentals 00:57
100 001 React Hooks Intro 02:14
101 002 Intro to Managing UI State 04:48
102 003 useState p 01:26
103 004 useState s 04:47
104 005 Controlling Inputs p 02:40
105 006 Controlling Inputs s 03:35
106 007 Derive State p 02:07
107 008 Derive State s 02:50
108 009 Initialize State p 01:19
109 010 Initialize State S 01:36
110 011 Init Callback P 03:26
111 012 Init Callback S 01:40
112 013 Dad Joke Break Managing UI State 00:37
113 014 Intro to Side-Effects 10:18
114 015 useEffect P 01:38
115 016 useEffect S 01:56
116 017 Effect Cleanup p 01:33
117 018 Effect Cleanup s 05:33
118 019 Dad Joke Break Side-Effects 00:42
119 020 Intro to Lifting State 02:56
120 021 Lift State p 00:21
121 022 Lift State s 01:42
122 023 Lift More State p 00:56
123 024 Lift More State s 04:33
124 025 Colocate State p 00:57
125 026 Colocate State s 03:36
126 027 Dad Joke Break Lifting State 00:47
127 028 Intro to DOM Side-Effects 03:52
128 029 Refs p 00:39
129 030 Refs s 04:02
130 031 Dependencies p 02:22
131 032 Dependencies s 05:05
132 033 Primitive Dependencies p 03:02
133 034 Primitive Dependencies s 02:22
134 035 Dad Joke Break DOM Side-Effects 00:35
135 036 Intro to Unique IDs 02:15
136 037 useId p 00:49
137 038 useId s 03:36
138 039 Dad Joke Break Unique IDs 00:31
139 040 Intro to Tic Tac Toe 01:24
140 041 setState callback p 02:51
141 042 setState callback s 05:13
142 043 Preserve State in localStorage p 00:54
143 044 Preserve State in localStorage s 03:36
144 045 Add Game History Feature p 02:09
145 046 Add Game History Feature s 08:32
146 047 Dad Joke Break Tic Tac Toe 00:36
147 048 Outro to React Hooks 01:36
148 Advanced React APIs Intro 03:34
149 Intro to Advanced State Management 04:49
150 New State _ Problem 00:54
151 New State _ solution 02:24
152 Previous State _ Problem 00:24
153 Previous State _ solution 01:07
154 State Object _ Problem 01:07
155 State Object _ solution 03:22
156 Action Function _ Problem 01:44
157 Action Function _ solution 04:16
158 Traditional Reducer _ Problem 01:03
159 Traditional Reducer _ solution 04:08
160 Real World _Problem 01:51
161 Real World _ solution 07:01
162 Dad Joke Break Advanced State Management 00:34
163 Intro to State Optimization 01:23
164 Optimize state updates _ Problem 01:38
165 Optimize state updates _solution 03:40
166 Dad Joke Break State Optimization 00:33
167 Intro to Custom Hooks 10:09
168 Hook Function _Problem 00:36
169 Hook Function _ solution 02:19
170 useCallback _ Problem 01:18
171 useCallback _ solution 02:19
172 Dad Joke Break Custom Hooks 00:30
173 Intro to Shared Context 04:56
174 Context Provider _ Problem 00:47
175 Context Provider _ solution 03:03
176 Context Hook _ Problem 00:43
177 Context Hook _ solution 02:29
178 Dad Joke Break Shared Context 00:37
179 Intro to Portals 01:56
180 createPortal _ Problem 01:00
181 createPortal _ solution 01:18
182 Dad Joke Break Portals 00:29
183 Intro to Layout Computation 03:18
184 useLayoutEffect _Problem 01:19
185 useLayoutEffect _solution 01:44
186 Dad Joke Break Layout Computation 00:29
187 Intro to Imperative Handles 02:43
188 useImperativeHandle _Problem 01:12
189 useImperativeHandle _ solution 02:47
190 Dad Joke Break Imperative Handles 00:24
191 Intro to Focus Management 03:02
192 flushSync _Problem 01:24
193 flushSync _solution 03:11
194 Dad Joke Break Focus Management 00:42
195 Intro to Sync External State 03:56
196 useSyncExternalStore _Problem 00:49
197 useSyncExternalStore _solution 02:05
198 Make Store Utility _Problem 00:36
199 Make Store Utility _solution 01:20
200 Handling Server Rendering _Problem 02:27
201 Handling Server Rendering _solution 03:36
202 Dad Joke Break Sync External State 00:34
203 Outro to Advanced React APIs 01:31
204 Intro to Data fetching 07:46
205 Throwing Promises _Problem 00:58
206 Throwing Promises _Solution 04:05
207 Error Handling _Problem 00:47
208 Error Handling _ Solution 03:04
209 Formal Status _Problem 00:41
210 Formal Status _Solution 01:11
211 Utility _ Problem 01:25
212 Utility _Solution 03:40
213 use React _Problem 00:10
214 use React _Solution 00:39
215 Dad Joke Break Data fetching 00:33
216 Intro to Dynamic Promises 04:37
217 Promise Cache _Problem 01:43
218 Promise Cache _Solution 04:11
219 useTransition _Problem 01:57
220 useTransition _Solution 02:05
221 Pending Flash _Problem 03:17
222 Pending Flash _Solution 01:55
223 Dad Joke Break Dynamic Promises 00:37
224 Intro to Optimistic UI 06:12
225 Optimistic UI _Problem 01:34
226 Optimistic UI _Solution 05:15
227 Form Status _ Problem 01:13
228 Form Status _Solution 03:04
229 Multi-step Actions _Problem 00:59
230 Multi-step Actions _ Solution 03:05
231 Dad Joke Break Optimistic UI 00:26
232 Intro to Suspense img 02:43
233 Img Component _Problem 01:02
234 Img Component _ Solution 03:34
235 Img Error Boundary _Problem 01:48
236 Img Error Boundary _Solution 01:35
237 Key prop _Problem 04:41
238 Key prop _Solution 02:01
239 Dad Joke Break Suspense img 00:44
240 Intro to Responsive 03:03
241 useDeferredValue _Problem 01:16
242 useDeferredValue _Solution 03:01
243 Dad Joke Break Responsive 00:27
244 Intro to Optimizations 05:49
245 Parallel Loading _Problem 00:54
246 Parallel Loading _Solution 01:56
247 Server Cache _Problem 01:45
248 Server Cache _Solution 01:44
249 Dad Joke Break Optimizations 00:31
250 Outro to React Suspense 01:19
251 Advanced React Patterns Intro 03:23
252 Intro to Composition 04:48
253 Composition and Layout Components _ Problem 00:55
254 Composition and Layout Components _Solution 07:52
255 Dad Joke Break Composition 00:34
256 Intro to Latest Ref 10:48
257 Latest Ref _ Problem 05:10
258 Latest Ref _Solution 08:07
259 Dad Joke Break Latest Ref 00:34
260 Intro to Compound Components 03:32
261 Compound Components _ Problem 01:14
262 Compound Components _ Solution 03:19
263 Compound Components Validation _ Problem 01:19
264 Compound Components Validation _Solution 02:39
265 Dad Joke Break Compound Components 00:34
266 Intro to Slots 05:11
267 Slot Context _Problem 01:23
268 Slot Context _ Solution 06:08
269 Generic Slot Components _ Problem 00:59
270 Generic Slot Components _ Solution 02:41
271 Slot Prop _Problem 01:41
272 Slot Prop _ Solution 10:49
273 Dad Joke Break Slots 00:21
274 Intro to Prop Collections and Getters 02:30
275 Prop Collections _Problem 01:10
276 Prop Collections _Solution 00:58
277 Prop Getters _Problem 03:34
278 Prop Getters _Solution 05:32
279 Dad Joke Break Prop Collections and Getters 00:30
280 Intro to State Initializer 01:55
281 Initialize Toggle _Problem 00:20
282 Initialize Toggle _Solution 04:38
283 Stability _Problem 01:23
284 Stability _Solution 01:20
285 Dad Joke Break State Initializer 00:37
286 Intro to State Reducer 03:05
287 State Reducer _Problem 00:46
288 State Reducer _Solution 02:20
289 Default State Reducer _Problem 00:42
290 Default State Reducer _Solution 01:51
291 Dad Joke Break State Reducer 00:32
292 Intro to Control Props 05:17
293 Control Props _Problem 03:25
294 Control Props _Solution 06:03
295 Dad Joke Break Control Props 00:47
296 Outro to Advanced React Patterns 01:25
297 React Performance Intro 04:40
298 Intro to Element Optimization 03:45
299 Reusing Elements _Problem 01:53
300 Reusing Elements _Solution 01:15
301 Element Props _Problem 00:41
302 Element Props _ Solution 02:31
303 Context _ Problem 01:49
304 Context _Solution 04:12
305 Memoize Elements _Problem 02:06
306 Memoize Elements _Solution 01:29
307 Memoize Components _ Problem 01:06
308 Memoize Components _Solution 05:39
309 Dad Joke Break Element Optimization 00:31
310 Intro to Optimize Context 01:58
311 Memoize Context _Problem 01:20
312 Memoize Context _Solution 01:01
313 Provider Component _Problem 00:53
314 Provider Component _Solution 03:55
315 Split Context _Problem 01:58
316 Split Context _Solution 05:29
317 Dad Joke Break Optimize Context 00:52
318 Concurrent Rendering Intro 14:20
319 useDeferredValue + memo _Problem 02:40
320 useDeferredValue + memo _Solution 05:26
321 Dad Joke Break Concurrent Rendering 01:04
322 Intro to Code Splitting 04:34
323 lazy _ Problem 03:11
324 lazy _Solution 04:40
325 Eager Loading _Problem 01:28
326 Eager Loading _Solution 01:13
327 Transitions _Problem 01:20
328 Transitions _ Solution 03:59
329 Dad Joke Break Code Splitting 00:19
330 Intro to Expensive Calculations 05:05
331 useMemo _Problem 01:57
332 useMemo _Solution 03:08
333 Web Worker _Problem 04:25
334 Web Worker _Solution 05:13
335 Async Results _Problem 02:11
336 Async Results _Solution 07:51
337 Dad Joke Break Expensive Calculations 00:31
338 Intro to Optimize Rendering 05:59
339 Component Memoization _ Problem 01:24
340 Component Memoization _Solution 01:38
341 Custom Comparator _ Problem 02:01
342 Custom Comparator _Solution 05:30
343 Primitives _Problem 01:50
344 Primitives _Solution 01:41
345 Dad Joke Break Optimize Rendering 00:19
346 Intro to Windowing 05:55
347 Virtualizer _Problem 01:33
348 Virtualizer _Solution 08:14
349 Dad Joke Break Windowing 00:30
350 Outro to React Performance 03:05
351 React Server Components Intro 05:22
352 Intro to Warm Up 03:02
353 Static React App _Problem 02:15
354 Static React App _Solution 04:45
355 Dad Joke Break Warm Up 00:27
356 Intro to Server Components 10:36
357 RSCs _Problem 04:06
358 Async Components _ Problem 00:43
359 Async Components _Solution 02:01
360 Streaming _Problem 02:01
361 Streaming _ Solution 03:45
362 Server Context _Problem 03:55
363 Server Context _Solution 03:12
364 Dad Joke Break Server Components 00:28
365 Intro to Client Components 14:20
366 Node.js Loader _Problem 01:46
367 Node.js Loader _Solution 04:25
368 Module Resolution _Problem 01:25
369 Module Resolution _Solution 03:00
370 Dad Joke Break Client Components 00:37
371 Intro to Client Router 02:30
372 Client Router _Problem 03:02
373 Client Router _Solution 11:55
374 Pending UI _Problem 03:20
375 Pending UI _Solution 07:59
376 Race Conditions _Problem 01:53
377 Race Conditions _Solution 02:46
378 History _Problem 01:27
379 History _Solution 02:36
380 Cache _Problem 04:50
381 Cache _Solution 07:41
382 Dad Joke Break Client Router 00:50
383 Intro to Server Actions 05:00
384 Action Reference _ Problem 01:16
385 Action Reference _Solution 09:26
386 Client Side _Problem 02:05
387 Client Side _ Solution 03:13
388 Server Side _Problem 01:21
389 Server Side _Solution 08:12
390 Revalidation _Problem 06:12
391 Revalidation _Solution 04:15
392 History Revalidation _ Problem 01:14
393 History Revalidation _Solution 02:31
394 Dad Joke Break Server Actions 00:34
395 Outro to React Server Components 02:19
396 Getting into Open Source with Aakansha Doshi 36:21
397 Enhancing Forms using React 19 with Aurora Scharff 31:03
398 Jenna Smith on AI, Building Radix, and Tokenami 41:46
399 Evan Bacon brings React Server Components to React Native 38:15
400 Kateryna Porshnieva on Building Accessible Apps with React 19 31:57
401 React's Evolution: Past, Present, and Future with Lee Robinson 31:22
402 Matt Brophy on Remix, React Router, and Open-Source 37:14
403 Michelle Beckles on Community Building and Developer Health 33:22
404 Under the Hood of React 19 with Rick Hanlon 38:03
405 Sam Selikoff on React's Impact in Modern Web Development 34:04
406 Lydia Hallie on JavaScript, React, and the Future of Web Development 31:32
407 Sebastian Silbermann on Testing, Tooling, and Transitions With React 19 36:24
408 The Importance of Accessibility in Modern Web Development With Shruti Kapoor 28:16
409 Sunil Pai on Changing Lives with Powerful Software, PartyKit, and Durable Objects 44:53
410 Theo Browne on His Personal Experience as a Web Developer 47:48
411 Dominik Dorfmeister on His Open-Source Journey 35:39

Similar courses to Learn React 19 with Epic React v2

React Js A-Z With Laravel - For Beginner to Advanced Level
The Software Architect Mindset (COMPLETE)

The Software Architect Mindset (COMPLETE)ArjanCodes

Duration 12 hours 6 minutes 39 seconds
MERN Stack Web Development with Ultimate Authentication
Master Custom React Hooks with TypeScript

Master Custom React Hooks with TypeScriptfullstack.io

Duration 2 hours 21 minutes 3 seconds
Project React. Build a complex React project as a total beginner
Professional TypeScript Training by Matt Pocock | Total TypeScript
Crack the Frontend Interview with React

Crack the Frontend Interview with Reactzerotomastery.io

Duration 1 hour 6 minutes 53 seconds
Build a ChatBot with Nuxt, TypeScript and the OpenAI Assistants API
Advanced React For Enterprise: React for senior engineers
React Query - Essentials (v2)

React Query - Essentials (v2)Tanner Linsley

Duration 2 hours 54 minutes 5 seconds