Make 20 React Apps

12h 20m 3s
English
Paid

Learn React best practices and concepts that you can use on the job, in side projects, and in any React app.

Read more about the course

What will you learn?

This course is built fully in React Hooks for React in 2020 and beyond. You'll work with:
React templating with JSX
React Hooks:
useState()
useEffect()
useCallback()
useContext()
useRef()
useReducer()
Custom React Hooks
Routing
Authentication
State management
Rendering
Component communication with prop

Who is this for?

This course is for beginner-intermediate developers that want to learn by building.

It's great for those that have some React knowledge but want to create real-world code.

They always say "build to learn". They never say what to build! These 20 apps are fun projects that will introduce us to coding scenarios that we'll encounter in many React apps.

Not sure if you'll like the course? Full refund if you end up not liking anything.

Watch Online Make 20 React Apps

Join premium to watch
Go to premium
# Title Duration
1 Hello! 00:59
2 VS Code Setup 19:12
3 Terminal Setup (npm vs yarn) 05:37
4 Starter and Final Files in GitHub 04:56
5 00 - Pomodoro [PREVIEW] 01:14
6 01 - Time and Start 10:07
7 02 - Stop and Reset 12:29
8 03 - Restarting the Timer [FIX] 01:58
9 00 - Markdown Editor [PREVIEW] 01:30
10 01 - Markdown Editor 14:07
11 00 Browser Tabs [PREVIEW] 01:26
12 01 - Tab Highlight 19:28
13 02 - React Router 16:06
14 03 - Refactoring 03:47
15 00 - Paper Rock Scissors [PREVIEW] 01:06
16 01 - Intro + Handling Choices 10:52
17 02 - Displaying Game State 12:52
18 03 - Choosing Winner 12:56
19 00 - Moving Boxes and Link [PREVIEW] 01:29
20 01 - Setting Up Canvas and Box 09:40
21 02 - Keyboard Arrows 07:58
22 03 - Link Sprites 06:47
23 04 - Custom Hook and Background 04:22
24 00 - Infinite Image Gallery [PREVIEW] 01:03
25 01 - Getting Images from Unsplash 17:34
26 02 - Infinite Scroll 10:57
27 03 - Searching Unsplash 13:43
28 04 - useEffect's 2nd Argument 06:26
29 00 - Trivia [PREVIEW] 01:25
30 01 - Getting and Displaying a Question 16:22
31 02 - Selecting a Category 14:14
32 03 - Handling Right and Wrong 11:22
33 04 - Scoreboard 07:42
34 05 - useTrivia Custom React Hook 08:08
35 00 - Authentication [PREVIEW] 01:54
36 01 - Setting Up Auth0 09:38
37 02 - Starting with the Auth0 SPA SDK 07:25
38 03 - Starting React Context 07:25
39 04 - Adding Auth0 to Context 17:14
40 05 - PrivateRoute 07:37
41 06 - Getting a Token 04:01
42 00 - Web Speech and Timers [PREVIEW] 01:12
43 01 - Creating Timer Forms 11:22
44 02 - Adding a Stopwatch 08:44
45 03 - Adding Speech 10:23
46 00 - Calendar Picker [PREVIEW] 01:04
47 01 - Choosing a Date 09:27
48 02 - Styled Components 12:55
49 03 - Hovering Days 07:59
50 00 - Chat Box [PREVIEW] 00:57
51 01 - Visualizing Messages 07:49
52 02 - Typing Indicator 07:49
53 03 - Adding Animations 04:54
54 00 - Multi-Step Form [PREVIEW] 01:23
55 01 - Multi-Step with Router 10:46
56 02 - Forms and Validation 11:49
57 03 - Storing State with React Context 12:51
58 04 - Animating Routes 07:19
59 05 - Disabling Links 05:53
60 00 - Memory Matching [PREVIEW] 00:46
61 01 - Displaying Pokemon 07:44
62 02 - Flipping Cards 07:37
63 03 - Handling Winning 09:02
64 00 - Drag and Drop Math Card [PREVIEW] 00:56
65 01 - Handling Dragging 10:44
66 02 - Handling Dropping 07:19
67 03 - Storing Values in State 09:20
68 00 - Browser Browser [PREVIEW] 01:35
69 01 - Showing iframes 06:43
70 02 - Choosing and Adding 05:03
71 03 - Address Bar 08:13
72 04 - useReducer 14:25
73 05 - Closing Tabs 13:18
74 00 - Real-Time Search [Preview] 01:39
75 01 - Algolia Setup 09:59
76 02 - React Components for Algolia 11:10
77 00 - Weather Chart [Preview] 01:17
78 01 - High Level Strategy 10:57
79 02 - Geocoding Addresses 15:01
80 03 - Starting Charts 13:17
81 04 - Showing Weather Data in Chart 11:12
82 00 - Shopping Cart [Preview] 12:00
83 01 - Setting Up Components 01:36
84 02 - Context and Reducer 25:00
85 03 - Cart Modal 16:42
86 00 - Typing Tester [Preview] 00:59
87 01 - Showing Characters 08:12
88 02 - Finding Typos 06:47
89 03 - Countdown and WPM 11:24
90 Updates Are Coming 00:22

Similar courses to Make 20 React Apps

Composing Layouts in React

Composing Layouts in Reactfullstack.io

Category: React.js, CSS
Duration 4 hours 38 minutes 12 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
Build a Notion Clone with React and TypeScript

Build a Notion Clone with React and TypeScriptzerotomastery.io

Category: TypeScript, React.js
Duration 7 hours 57 minutes 47 seconds
Add React Storybook to a Project

Add React Storybook to a Projectegghead

Category: React.js
Duration 3 minutes 36 seconds
Fullstack ASP.NET Core and React Masterclass | Learnify

Fullstack ASP.NET Core and React Masterclass | Learnify fullstack.io

Category: React.js, C Sharp (C#)
Duration 20 hours 40 minutes 31 seconds
The Software Architect Mindset (COMPLETE)

The Software Architect Mindset (COMPLETE)ArjanCodes

Category: TypeScript, React.js, Others, Python
Duration 12 hours 6 minutes 39 seconds
React and Django: A Practical Guide with Docker

React and Django: A Practical Guide with Dockerudemy

Category: React.js, Docker, Django
Duration 6 hours 50 minutes 20 seconds
React: Flux Architecture (ES6)

React: Flux Architecture (ES6)egghead

Category: React.js
Duration 49 minutes 50 seconds
React Node FullStack - Ecommerce from Scratch to Deployment

React Node FullStack - Ecommerce from Scratch to Deploymentudemy

Category: React.js, Node.js, MongoDB
Duration 16 hours 15 minutes 14 seconds