Make 10 More React Apps

Build real apps and get real-world React experience. These React videos will teach you specific parts of React so that you can grow your skills and React tools.

44 lessons3.6 hours
Make 10 More React Apps

The Apps You'll Build

We'll build a series of apps that you can use to learn React. These will be fun apps that will teach you the practical skills needed to build your own React applications.

App Preview

Chat Box

App Preview

Multi-Step Form

App Preview

Memory Matching Game

App Preview

Drag and Drop Math Card

App Preview

Browser

App Preview

Real-Time Search

App Preview

Charting the Weather

App Preview

Shopping Cart

App Preview

Typing Tester

What You'll Learn

  • The React basics
  • Functional React components
  • React hooks like useState() and useEffect()
  • Handling user events
  • JSX and Rendering templates
  • Props and State
  • Creating and organizing components
  • Building real-world React applications

Course Content

44 lessons3.6 hours

Getting Started

26 minutes
Welcome!
VS Code Setup
Terminal Setup
GitHub Files

#1. Chat Box

1 minutes
Preview
Visualizing Messages
Typing Indicator
Animations

#2. Multi-Step Form

27 minutes
Preview
Multi-Step with Router
Forms and Validation
State w/ React Context
Animating Routes
Disabling Links

#3. Memory Matching Game

25 minutes
Preview
Displaying Pokemon
Flipping Cards
Handling Winning

#4. Drag and Drop Math Card

28 minutes
Preview
Handling Dragging
Handling Dropping
Storing Values in State

#5. Browser

2 minutes
Preview
Showing iframes
Choosing and Adding
Address Bar
useReducer()
Closing Tabs

#6. Real-Time Search

23 minutes
Preview
Algolia Setup
React Components

#7. Charting the Weather

52 minutes
Preview
Strategy
Geocoding Addresses
Charts
Weather in Charts

#8. Shopping Cart w/ Context and Reducer

30 minutes
Preview
Cart Components
Context & Reducer
Cart Modal

#9. Typing Tester

1 minutes
Preview
Showing Characters
Finding Typos
Countdown & WPM