Introduction to React
1 lesson
-
The Missing Introduction to React
06:52
Rendering view in React
10 lessons
-
Rendering view with HTML
01:57
-
Bootstrapping React in HTML
02:07
-
Render an element with React.createElement
03:30
-
Rendering nested elements with React.createElement
04:34
-
What is JSX?
03:34
-
Creating view with JSX
04:49
-
The relation between HTML and JSX
04:15
-
Accessibility and ARIA in JSX
02:38
-
Interpolating values in JSX
03:58
-
Using expressions in JSX
06:23
Introduction to Components
11 lessons
-
Introduction to Components
05:52
-
Pure functions
03:12
-
Components as functions returning view
04:11
-
Passing props to Components
05:15
-
The children prop
06:43
-
Setting up a dev environment with create-react-app
11:07
-
Isolating Components as exports and imports
04:26
-
Adding an event handler to an element
07:12
-
Adding state with the useState hook
07:31
-
One-way Data Flow in Components
07:43
-
Building re-usable Components
09:43
The React virtual DOM vs the browser DOM
2 lessons
-
Introduction to the React reconciler
06:12
-
Introduction to the React Dev Tools
08:32
A deeper dive into Components
14 lessons
-
Conditional rendering with an if statement
12:02
-
Conditional rendering with the ternary operator
01:27
-
Conditional rendering with the boolean AND operator
03:59
-
Interpolating Arrays in JSX
03:14
-
Exploring Array.map
04:04
-
Using Array.map to render an Array
02:56
-
Understanding the key prop
12:11
-
Filtering collections client side with Array.filter
08:20
-
Mapping an Object to view
04:07
-
Handling basic side effects
13:40
-
Understanding shallow dependency checks
05:29
-
Using the empty dependency Array in useEffects
07:31
-
Cleaning up after side effects
11:05
-
JavaScript closures and the useEffect hook
17:11
Forms in React
10 lessons
-
Creating controlled Components
10:29
-
Binding multiple form controls to Component State
08:54
-
Submitting form data
05:51
-
Updating form State from code
03:31
-
Using a textarea
03:56
-
Using a select
04:55
-
Using a checkbox
04:35
-
Grouping checkboxes together
06:52
-
Using radio buttons
08:17
-
Loading data into a form
09:48
Thinking in Components
5 lessons
-
From design to rough Component outline
04:09
-
Building a static React view from the design
21:27
-
From static view to statefull app
15:48
-
Making sure the app is accessible
06:55
-
Identifying re-usable code
15:48
HTTP Requests
7 lessons
-
Understanding HTTP requests
04:47
-
Create a basic HTTP server in Node Express
05:48
-
Fetching data from the server
15:00
-
Sending data to the server
09:44
-
Avoiding State changes on unmounted Components
04:51
-
Using async/await
03:36
-
Setting custom HTTP headers
03:21
Routing
5 lessons
-
Adding React Router to your application
11:29
-
Navigating with the router’s Link Component
06:36
-
Understanding route parameters
13:53
-
Updating the browser title
09:49
-
Making routing accessible
09:29
Application Build
19 lessons
-
Introduction to the application
07:49
-
Adding a header and footer
08:06
-
Displaying the menu
20:20
-
Displaying the ice cream images
10:29
-
Adding a loading message
25:37
-
Routing to an edit component
19:50
-
Creating the main navigation
03:49
-
Fetching the menu item in the edit component
18:45
-
Editing the data in a form
37:53
-
Routing accessibility
31:29
-
Adding a skip navigation link
07:59
-
Building a validation system
14:19
-
Displaying validation messages
10:25
-
Accessible validation
21:09
-
Deleting a menu item
07:04
-
Fetching the stock ice cream list
09:53
-
Displaying the stock list
18:37
-
Extracting the edit form
23:36
-
Creating the add page
18:59
Get the complete bundle...
Everything you need to start mastering React today
Job-ready training
Nail that interview with your new skills that will set you apart.
All the best practices
Best practices, design patterns, performance and architecture.
Stream or download
Learn at home at your own pace, download for offline viewing.
Expert knowledge
Built by Google Developer Experts, there's no better place to learn web.
StackBlitz examples
Access full course source code and experiment in the browser too!
Slack community
Exclusive access to our members-only community (6,500+ members).
React Kickstart Bundle
2 courses

Limited time offer ⚡
React Master Bundle
6 courses




Secure SSL encrypted payments

30-day money back guarantee
These courses are empowering thousands with expert knowledge - they will you too. If you're disappointed for whatever reason, you'll get a full refund.

Location + Student discounts
Not-so-good exchange rate (i.e. India/Brazil)? Are you a student? Contact us for a coupon with your location or student details.
🎉 Get 5 more courses for just $120 extra!
Upgrade to the full React Master bundle and save 💰

Brought to you by Todd Motto, multi-award winner, world-wide conference speaker and workshop leader. Google Developer Expert
-
React Basics
85 lessons -
React Styling
9 lessons -
React State Management
23 lessons -
React Router
Almost ready -
React Masterclass
Almost ready -
React Universal
Almost ready