Getting Started
- What You Will Need for this Course
- Install React 16.7 to Use React Hooks
- What are React Hooks?
Moving from Classes to Function Components (useState, useEffect)
- Introducing the useState Hook
- Use Previous State with useState
- Toggle State with useState
- Introducing the useEffect Hook
- Cleaning up Side Effects in useEffect
- Using / Cleaning up Multiple Listeners in useEffect
- Cleaning up Listeners without a Supportive API
- Comparing Function Component and Class Components
Building Stateful Components with Functions
- Implementing a Login Form with Multiple State Values
- Implementing a Register Form with a Single State Value
- Comparing Ways of Managing State
Data Fetching with Hooks / Replacing Class Lifecycle Methods (useEffect, useRef)
- Intro to Data Fetching Project
- Fetching Data on component Mount with useEffect
- Using Async / Await for Fetching Data in useEffect
- Fetching Search Results on Component Update with useEffect
- Fetching Data upon Submitting Form
- Using the useRef Hook on our Search Input
- Displaying Loading State with useState
- Error Handling and Displaying Errors with useState
- Styling our Project with TailwindCSS (Optional)
Building a Complete CRUD App with React Hooks / Replacing Redux
- Project Setup for our CRUD App
- Avoiding Props Drilling with React Context and the useContext Hook
- Replacing Redux with the useReducer Hook
- Combining useContext and useReducer to Make Initial App State
- Styling our TodoList Component with TailwindCSS
- Toggling Todos / "TOGGLE_TODO" case
- Removing Todos / "REMOVE_TODO" case
- Adding Todos and TodoForm Component / "ADD_TODO" case
- Updating Todos / "UPDATE_TODO" case
- Improving our App
Connecting our App to an API
- Creating / Deploying our API to Persist App Data
- Creating a Custom Hook to Fetch Initial App Data
- Delete Request to Remove Todos
- Performing Post Request to Add Todos
- Performing Patch Request to Toggle Todos
- Finishing our App
