Learn React js in 3.5 hours with this full tutorial for beginners!

Table of Contents:

• 0:00 - Introduction
• 9:02 - What is the DOM?
• 25:00 - React vs ReactDOM
• 30:10 - Setting up React
• 38:47 - Babel & JSX
• 48:35 - JSX Interpolation
• 51:59 - React Components
• 56:34 - Create React App
• 1:08:52 - Structuring React components
• 1:13:42 - Building the CountButton component
• 1:21:09 - useState hook & React state management
• 1:33:50 - React functional component lifecycle
• 1:36:37 - Reusing components
• 1:38:20 - Props
• 1:44:59 - Props vs State
• 1:46:04 - Styling & style props
• 1:55:10 - External style sheets
• 2:03:45 - Building a search bar
• 2:07:02 - Handling inputs in React
• 2:10:23 - onUpdate input event
• 2:19:00 - Building a clear input button
• 2:23:00 - Conditional rendering
• 2:29:14 - Rendering a list of items & the map function
• 2:34:39 - The “key” prop
• 2:37:33 - Using the filter function to filter our list
• 2:42:01 - Making the SearchBar more reusable
• 2:48:25 - useEffect hook
• 2:58:08 - Simulating loading data with useEffect
• 3:04:51 - Adding a loading indicator
• 3:10:17 - Loading data from an external API
• 3:18:50 - The “children” prop
• 3:24:55 - Closing remarks & outro

Links:
Vs Code - https://code.visualstudio.com/
React Script Tags - https://reactjs.org/docs/add-react-to-a-website.html#step-2-add-the-script-tags
Babel Playground - https://babeljs.io/repl
Babel script tag - https://babeljs.io/setup#installation (click on “In the browser” and scroll down to “usage” section)
Create React App - https://github.com/facebook/create-react-app#creating-an-app
Mac Terminal Tutorial - https://macpaw.com/how-to/use-terminal-on-mac
Windows Terminal Tutorial - https://techtipvault.com/windows/command-prompt-windows-10-cmd-guide/
Fake Store API - https://fakestoreapi.com/docs

#react #reactjs #javascript #web-development