|
Module 1: Getting Started
|
|
|
|
What is ReactJS? | Introduction to ReactJS
9:00
|
Preview
|
|
|
Environment Setup for ReactJS
10:00
|
Preview
|
|
|
Directory Structure of React App
11:00
|
|
|
|
Work flow of React App
7:00
|
|
|
Module 2: Next Generation ES6 JavaScript (Optional)
|
|
|
|
What is JavaScript ES6?
6:00
|
|
|
|
ES6 let and conts keywords
7:00
|
|
|
|
ES6 Arrow function in JavaScript
7:00
|
|
|
|
ES6 Arrow function with "this" keyword
4:00
|
|
|
|
ES6 Template Literals
7:00
|
|
|
|
ES6 Array and object destructing
8:00
|
|
|
|
ES6 Import and Export keywords
8:00
|
|
|
|
ES6 Promises
7:00
|
|
|
|
ES6 Rest parameter and Spread operator
9:00
|
|
|
|
ES6 Array Map Method
5:00
|
|
|
|
ES6 Class
|
|
|
Module 3: Understanding the Basic Features & Syntax
|
|
|
|
Introduction to Components.
4:00
|
Preview
|
|
|
Class based and Functional components.
17:00
|
|
|
|
Introduction to JSX.
9:00
|
|
|
|
Understanding Props in React Components.
11:00
|
|
|
|
Understanding State and setState Function
7:00
|
|
|
|
Event handling with methods
8:00
|
|
|
|
Adding CSS to the component.
9:00
|
|
|
|
Module Style for Component.
3:00
|
|
|
Module 4: Working with Lists and Conditionals Rendering
|
|
|
|
Rendering list in React Component
9:00
|
|
|
|
Key Prop & Its Importance
5:00
|
|
|
|
Rendering data conditionally in React Component.
5:00
|
|
|
|
Deleting a data from the state
7:00
|
|
|
Module 5: Understanding the basics of form
|
|
|
|
Handling the form inputs
13:00
|
|
|
|
Working with controlled components.
8:00
|
|
|
|
Registration form along with greeting screen
18:00
|
|
|
Module 6: Styling React Components & Elements
|
|
|
|
Setting the style Dynamically
9:00
|
|
|
|
Adding the class dynamically
5:00
|
|
|
|
Introduction styled-component library.
8:00
|
|
|
|
Media query and hover using styled-component
5:00
|
|
|
|
Using props inside the styled component
7:00
|
|
|
Module 7: Using firebase with ReactJS
|
|
|
|
Setting up the environment for firebase with ReactJS
7:00
|
|
|
|
Setting up the survey project
14:00
|
|
|
|
Handling the name and the answers with state.
13:00
|
|
|
|
Initializing the firebase
5:00
|
|
|
|
Sending the data to the firebase
7:00
|
|
|
|
Setting up the login and register components
7:00
|
|
|
|
Registration of user using firebase
19:00
|
|
|
|
Login of user using firebase
11:00
|
|
|
|
Login with Google using firebase
9:00
|
|
|
Module 8: Multi-Page-Feeling in a Single-Page-App: Routing
|
|
|
|
Converting a template into ReactJS project
15:00
|
|
|
|
Setting up the react-router package
14:00
|
|
|
|
Handling 404 routes
3:00
|
|
|
|
Handling the routes conditionally
8:00
|
|
|
|
Nesting the routes
14:00
|
|
|
Module 9: Diving deeper into components
|
|
|
|
Use state hook to handle state inside functional components
9:00
|
|
|
|
Stateful and stateless component
|
|
|
|
Component lifecycle overview
5:00
|
|
|
|
Class components mounting lifecycle
10:00
|
|
|
|
Class components updating lifecycle
4:00
|
|
|
|
Class components unmounting lifecycle
4:00
|
|
|
Module 10: Handling HTTP requests
|
|
|
|
Understanding the HTTP/AJAX request
6:00
|
|
|
|
Introduction to AJIOX
4:00
|
|
|
|
Fetching data using GET HTTP request.
7:00
|
|
|
|
Displaying the fetched data in the blog project
13:00
|
|
|
|
POSTing data to the API.
7:00
|
|
|
|
Deleting a data using AXIOS
6:00
|
|
|
|
Default Global configuration for AXIOS
3:00
|
|
|
|
Creating and Using AXIOS Instances
5:00
|
|
|
Module 11: The Weather App
|
|
|
|
Getting started for the Weather App
6:00
|
|
|
|
Converting the template into Components
18:00
|
|
|
|
Handling the lat. and lon. using state.
13:00
|
|
|
|
Getting the data using API
18:00
|
|
|
|
Showing loading while fetching data.
5:00
|
|
|
|
Managing the Recent searches
14:00
|
|
|
|
Re-search the recent searched data
8:00
|
|
|
|
Storing the recent searches in localstoage
8:00
|
|
|
Module 12: Redux
|
|
|
|
Understanding state and its complexity
3:00
|
|
|
|
Introduction to Redux & its work flow
3:00
|
|
|
|
Setting up the reducer and store
7:00
|
|
|
|
Dispatching the actions
4:00
|
|
|
|
Adding subscriptions
6:00
|
|
|
|
Connecting React to Redux
5:00
|
|
|
|
Connecting the Store to React
6:00
|
|
|
|
Dispatching Actions from within the Component
8:00
|
|