Skip to main content

Make 20 React Apps

12h 20m 3s
English
Paid

Course description

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

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 90 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing

Watch Online Make 20 React Apps

0:00
/
#1: Hello!

All Course Lessons (90)

#Lesson TitleDurationAccess
1
Hello! Demo
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

Unlock unlimited learning

Get instant access to all 89 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Comments

0 comments

Want to join the conversation?

Sign in to comment

Similar courses

React Query: Server State Management in React

React Query: Server State Management in React

Sources: udemy
React Query has become the go-to solution for server state management in React apps, and for good reason! This smart, comprehensive solution makes it easy to ke
7 hours 39 minutes 49 seconds
FULL Authentication WITH REACT JS NEXT JS TYPESCRIPT

FULL Authentication WITH REACT JS NEXT JS TYPESCRIPT

Sources: udemy
This is simply the best course on the internet if you want to build and deploy the best authentication system that you can take and use in all of your projects
6 hours 52 minutes 28 seconds
Advanced Animating React with Framer Motion

Advanced Animating React with Framer Motion

Sources: leveluptutorials
Welcome to Advanced Animating React with Framer Motion! In this series, we will dive into more advanced concepts as well as discuss what is new in Framer Motion
2 hours 57 minutes 30 seconds
React and Laravel: Breaking a Monolith to Microservices

React and Laravel: Breaking a Monolith to Microservices

Sources: udemy
Microservices Architecture, React, Next.js, Laravel, Docker, RabbitMQ, Event Driven Microservices, Internal APIs, Redis. Learn how to create a Monolith using React and Laravel t...
15 hours 7 minutes 45 seconds