Learn React Hooks By Building A Real Application

7h 14m 44s
English
Paid

Course description

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

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

Comments

0 comments

Want to join the conversation?

Sign in to comment

Similar courses

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

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

Sources: Ryan Fitzgerald
Master the creation of full-fledged Chrome extensions from scratch to production! Learn how to develop powerful, functional Chrome extensions using a modern...
10 hours 3 minutes 45 seconds
MERN Stack React, Socket io, Next.js Express,MongoDb, Nodejs

MERN Stack React, Socket io, Next.js Express,MongoDb, Nodejs

Sources: udemy
If you are a person who is not picky about a CSS framework and wants to learn how to create enterprise-grade, practical full stack app using new technologies, then this course i...
13 hours 2 minutes 12 seconds
The Official React Query Course - query.gg

The Official React Query Course - query.gg

Sources: ui.dev (ex. Tyler McGinnis)
React Query has been one of the fastest growing and most popular third party libraries in the React ecosystem, and this course will teach you everything you...
4 hours 17 minutes 17 seconds
The essential guide to Firebase with React.

The essential guide to Firebase with React.

Sources: udemy
Create modern app using modern technologies. Do you want to create web applications with Firebase and React ?. This is the course for you.
31 hours 20 minutes 9 seconds
React for Beginners

React for Beginners

Sources: codewithmosh (Mosh Hamedani)
React is the most popular JavaScript library for building front-ends. It was created by Faceook and is widely used for building web, mobile, and desktop apps.
7 hours 58 minutes 3 seconds