Learn React Hooks By Building A Real Application

7h 14m 44s
English
Paid

Learn React Hooks by building key features of a realistic app. After teaching this content to thousands, we've packaged it up into and on-demand course just for you.

Read more about the course

Beginner Level

If all you've done is the official React tutorial then you are ready for this course. We'll be starting from the fundamentals and working our way into hooks basics pretty quickly. Hooks allow us to cover topics that are ordinarily advanced sooner. It might feel a little fast but that's what the pause button is for!

Intermediate/Advanced Level

If you're a seasoned React developer, there's no better way to get caught up on Hooks and what it means for your code and team than this course. You’ll get priceless insights into how hooks will help you build great abstractions for your team that will work in new and mature code-bases.

You’re not going to just watch some videos and type along with us, nah, that’s not how you learn. We teach a concept with real-world code, then hand it over to you to do an exercise on your own--which is where the real learning happens. When you’re done, we’ll solidify your understanding as we go deeper into the concepts in the solution videos. 

  • React's Fundamental Composition Model
  • All of the New Hooks
  • Thinking In Effects, Not Lifecycles
  • Composing and Sharing Non-Visual Behavior
  • Data Loading and Caching
  • App-Wide State Management
  • Realtime Updates and Subscriptions
  • Clientside Authentication
  • Performance Considerations and Optimizations
  • Animation

Watch Online Learn React Hooks By Building A Real Application

Join premium to watch
Go to premium
# Title Duration
1 01-hello-world 02:18
2 02-its-just-javascript 02:18
3 03-create-element-signature 02:28
4 04-back-to-jsx 01:58
5 05-using-components 01:30
6 06-defining-components 00:48
7 07-component-reuse-with-props 02:23
8 08-children-prop 03:28
9 09-data-flow.mp4 02:24
10 10-custom-events 03:03
11 11-code-a-long 04:56
12 12-what-declarative-means 03:59
13 13-use-state-intro 02:52
14 14-multiple-states 04:43
15 15-what-to-do-when-anything-happens 02:06
16 16-how-react-works 04:48
17 17-use-state-exercise 01:10
18 18-use-state-exercise-solution 03:55
19 19-phony-hooks 13:29
20 20-handling-an-event-without-react 05:16
21 21-use-ref 02:22
22 22-thinking-in-events 04:19
23 23-use-effect-intro 05:36
24 24-governing-side-effects 05:26
25 25-use-effect-parameters 08:35
26 26-making-our-own-hook 05:00
27 27-reusable-abstraction 01:57
28 28-composing-with-hooks 01:26
29 29-effects-exercise-intro 04:04
30 30-effects-exercise-overview 14:22
31 31-fetching-data 05:08
32 32-intro-to-cleanup-functions 04:36
33 33-how-to-use-a-cleanup-function 03:15
34 34-async-await-with-use-effect 03:00
35 35-subscription-style-async 03:36
36 36-mimicking-use-effect-with-render-props 08:48
37 37-comparing-hooks-and-render-props 03:31
38 38-composing-hooks-together 06:13
39 39-data-loading-exercise-intro 02:00
40 40-data-loading-exercise-overview 08:23
41 41-customize-component-render-positions 10:19
42 42-too-many-props 11:20
43 43-replacing-props-with-compound-components 15:53
44 44-share-state-with-context 05:05
45 45-adding-functions-to-context 01:17
46 46-adding-index-to-context 04:52
47 47-backwards-compatibility 07:40
48 48-children-module 02:25
49 49-compound-components-exercise-intro 05:10
50 50-compound-components-exercise-overview 10:34
51 51-why-we-need-reducers 03:36
52 52-what-is-a-reducer 04:29
53 53-using-usereducer 11:33
54 54-building-a-global-state 15:25
55 55-app-state-exercise-intro 01:51
56 56-app-state-exercise-overview 07:41
57 57-feed-exercise-intro 04:14
58 58-feed-exercise-part-1-solution 04:07
59 59-feed-exercise-part-2 01:35
60 60-feed-exercise-part-2-solution 06:53
61 61-feed-exercise-part-3 01:27
62 62-feed-exercise-part-3-solution 03:43
63 63-feed-exercise-part-4 01:14
64 64-feed-exercise-part-4-solution 05:02
65 65-feed-exercise-with-usereducer 07:45
66 66-feed-exercise-persistent-state 11:02
67 67-animation-and-interpolation-types 06:03
68 68-implementing-animation-hook 19:13
69 69-adding-sound-effects 02:27
70 70-using-react-spring 20:35
71 71-animating-a-non-react-element 03:04
72 72-lazy-refs 04:58
73 73-use-memo 13:10
74 74-memo 11:39
75 75-props-differentiation 05:53
76 76-use-callback 08:14
77 77-use-effect-vs-use-memo 01:24
78 78-goodbye-world 00:23

Similar courses to Learn React Hooks By Building A Real Application

Crack the Frontend Interview with React

Crack the Frontend Interview with Reactzerotomastery.io

Category: React.js, Preparing for an interview
Duration 1 hour 6 minutes 53 seconds
Starting with React & Redux: Build modern apps (2nd edition)

Starting with React & Redux: Build modern apps (2nd edition)udemy

Category: React.js, Redux
Duration 30 hours 13 minutes 51 seconds
React and NestJS: A Practical Guide with Docker

React and NestJS: A Practical Guide with Dockerudemy

Category: React.js, Docker, NestJS
Duration 6 hours 54 minutes 20 seconds
Redux Saga

Redux Sagapluralsight

Category: React.js, Redux
Duration 2 hours 54 minutes 54 seconds
React Hooks

React Hooksui.dev (ex. Tyler McGinnis)

Category: React.js
Duration 3 hours 47 minutes 48 seconds
React Fundamentals

React Fundamentalsui.dev (ex. Tyler McGinnis)

Category: React.js
Duration 4 hours 36 minutes 46 seconds
Complete React Developer in 2025 (w/ Redux, Hooks, GraphQL)

Complete React Developer in 2025 (w/ Redux, Hooks, GraphQL)udemyzerotomastery.io

Category: React.js, Redux
Duration 39 hours 48 minutes
React Router v4

React Router v4ui.dev (ex. Tyler McGinnis)

Category: React.js
Duration 6 hours 44 minutes 1 second
React and WebRTC 2023 & Sharing Location App with Video Chat

React and WebRTC 2023 & Sharing Location App with Video Chatudemy

Category: React.js, WebRTC
Duration 8 hours 11 minutes 54 seconds