React: All You Need to Know with Practical Project

Course Curriculum

Chapter 1: Introduction

Lecture 1: Course Overview

Lecture 2: What is React

Lecture 3: What is Virtual DOM

Lecture 4: Install Nodejs on Windows OS

Lecture 5: Install Nodejs on Mac OS

Lecture 6: Install Nodejs on Linux OS

Lecture 7: Setup a React Project

Chapter 2: JSX Element and Rendering JSX Element

Lecture 1: What is JSX Element

Lecture 2: JSX More Detail

Lecture 3: Rendering JSX Element

Chapter 3: Component and Props

Lecture 1: What is Component

Lecture 2: What is Props

Lecture 3: Export and Import Component

Lecture 4: Root Component

Lecture 5: Children Property

Lecture 6: Class Based Component

Chapter 4: State and Life Cycle Method

Lecture 1: What is State

Lecture 2: More About State

Lecture 3: Component Did Mount

Lecture 4: Update State

Lecture 5: Component will Unmount

Lecture 6: State in Functional Component

Lecture 7: Event Handler

Lecture 8: Passing Parameter to Event Handler

Chapter 5: Conditional Rendering List and Key

Lecture 1: What is Conditional Rendering

Lecture 2: Conditional Rendering More Detail

Lecture 3: List

Lecture 4: List Key Props

Lecture 5: Counter App

Chapter 6: React Form

Lecture 1: Controlled Form vs Uncontrolled Form

Lecture 2: Input Element

Lecture 3: Textarea Input Element

Lecture 4: Select Input Element

Lecture 5: Checkbox Input Element

Lecture 6: Radio Input Element

Lecture 7: Submit Input

Lecture 8: Registration Form

Chapter 7: Higher Order Component

Lecture 1: What is Higher Order Component

Lecture 2: How to Create Higher Order Component

Lecture 3: How to Use Higher Order Component

Chapter 8: Render Props Pattern

Lecture 1: What is Render Props

Lecture 2: Render Props Example

Lecture 3: Render Props Variation

Chapter 9: Context API

Lecture 1: Props Drilling

Lecture 2: What is Context API

Lecture 3: Create Custom Context

Lecture 4: How to Use Context

Lecture 5: Built in Context

Lecture 6: useContext Hook

Chapter 10: React Hook

Lecture 1: React Hook Introduction

Lecture 2: What is useEffect Hook

Lecture 3: Timer Example

Lecture 4: Cleanup Function

Lecture 5: Fetch Data from API Request

Lecture 6: React Memo and useCallback Hook

Lecture 7: useMemo Hook

Lecture 8: useRef Hook

Lecture 9: useReducer Hook

Lecture 10: Complex Counter

Lecture 11: Fetch Post List Example

Lecture 12: Fetch Post List by useReducer Hook

Lecture 13: Custom Hook

Chapter 11: React CSS

Lecture 1: React Stylesheet

Lecture 2: CSS Style in Html

Lecture 3: Inline CSS

Lecture 4: CSS Module

Lecture 5: Dynamic CSS

Chapter 12: React Router

Lecture 1: What is React Router

Lecture 2: Route Configuring

Lecture 3: Nav Link

Lecture 4: Active Link

Lecture 5: Navigate Programmatically

Lecture 6: Not Found Route

Lecture 7: Dynamic Route

Lecture 8: URL Params

Lecture 9: Search Params

Lecture 10: Nested Route

Lecture 11: Relative Link

Lecture 12: Source Code

Chapter 13: React Blog Project

Lecture 1: Project Requirement Analysis

Lecture 2: Initiating Nodejs Project

Lecture 3: MongoDB Install on Windows OS

Lecture 4: MongoDB Install on Mac OS

Lecture 5: MongoDB Install on Linux OS

Lecture 6: Add MongoDB Database Reference to Nodejs Project

Lecture 7: Setup Email Credentials

Lecture 8: Aws S3 Bucket Setup