Mastering React: Front-End development with React Js

Way to Learn
 Project 1: self-learning -A Project with vanilla JavaScript
 Project 2: Using React Project
 Project 3: Using react framework – Next.js

Review: HTML, CSS, SCSS

1. Getting Started
 What is React
 Setting Up the Development Environment
 First React App
 Hello World
2. ECMAScript 6 (ES6 )
 Introduction
 Let vs Var vs Const
 Objects
 The this keyword
 Binding this
 Arrow Functions
 Arrow functions and This
 Array.mp Method
 Object Destructing
 Spread Operator
 Classes
 Inheritance
 Modules
 Named and Default Exports
3. Components
 Introduction to component
 Setting up the Project
 First React Components
 Attributes
 Rendering
 Handing Events
 State
 Setting up a project with component

4. Composing Components
 Introduction to Composing Components
 Passing data to components
 Passing children
 Debugging react apps
 Props vs state
 Lifecycle hooks
 Mounting phase
 Updating phase
5. Pagination, filtering, Sorting
6. Routing
 Setup
 Adding Routing
 Switch
 Link
 Route Props
 Query String
7. Forms
 Building a Bootstrap form
 Handing form submission
 Refs
 Controlled elements
 Common errors
 Validation
8. Calling Backend services
 JSON placeholder
 HTTP clients
 Lifecycle of a request
 Installing MongoDB
 Setting up Node Backend
 Adding HTTP and log service
9. Authentication and Authorization
 Registering a new user
 Handling the registration
 JSON web Tokens
10. Deployment
 Environment Variable
 Production Builds
 Getting stared with Heroku
 MongoDB in the cloud
 Deploying the Front-end
11. Introduction on NEXT.JS framework
 Setting project
 pages

 Routes
 Form
 Deployment