Dive into a comprehensive 3.5-hour video tutorial on React.js for beginners. Master the fundamentals of React, including DOM manipulation, component creation, and state management using hooks like useState and useEffect. Learn to set up a React environment, work with JSX, handle user inputs, implement conditional rendering, and interact with external APIs. Build practical projects such as a counter button and a search bar while exploring concepts like props, styling, and component lifecycle. By the end of this in-depth guide, gain the skills to create dynamic and interactive web applications using React.js.
Overview
Syllabus
- Introduction
- What is the DOM?
- React vs ReactDOM
- Setting up React
- Babel & JSX
- JSX Interpolation
- React Components
- Create React App
- Structuring React components
- Building the CountButton component
- useState hook & React state management
- React functional component lifecycle
- Reusing components
- Props
- Props vs State
- Styling & style props
- External style sheets
- Building a search bar
- Handling inputs in React
- onUpdate input event
- Building a clear input button
- Conditional rendering
- Rendering a list of items & the map function
- The “key” prop
- Using the filter function to filter our list
- Making the SearchBar more reusable
- useEffect hook
- Simulating loading data with useEffect
- Adding a loading indicator
- Loading data from an external API
- The “children” prop
- Closing remarks & outro
Taught by
Mike Dane
