Introduction About Web Development
Web Development Introduction
Web Application Architecture
Types of Web Application
Modern Web Development
Front End Development Introduction
IDE Setup for Web Development
HTML and CSS
JavaScript
Course Syllabus
Node JS–A JavaScript Runtime
Node JS installation
Node JS Shell
Creating your first JavaScript Program
Running JavaScript Code using the Node JS
Difference between Node JS and NPM
Creating New Node Project
Bringing Library Code using the NPM
Different kinds of Dependencies
Managing NPM Scripts
JavaScriptProgramming Language -Basic
An Introduction to JavaScript
JavaScript Fundamentals
JavaScript Coding Block and Syntax
Variables and Data Types
Declaring New Variable
Assigning Value to The Variable
Reassigning Value to the Variable
Constant in JavaScript
Number, String, Boolean
Null and undefined in JavaScript
Data Types Conversion
Different Types of Operators
Comparison Operators
JavaScript Programming Language –Fundamentals
Conditions Introduction
If Conditions
Multiple If Conditions using the else if conditions
Logical Operators in conditions
Switch Cases Statement
Default in Switch Cases
Loops Introduction
For Loops
While Loops
Do while Loops
Function in JavaScript
Function Expressions
Parameters in Functions
Optional Parameter in Functions
Return in Functions
Function Invoking
Objects
JavaScript Programming Language –Intermediate
Methods for Number, String
Array Methods
Array Push, Pop, Slice Methods
Loop an Array using For Each Methods
Map, Filter,and Reduce Methods
Class in JavaScript
Class Syntax
New Keyword
Creating an Object using a Class
Properties and Methods
Constructors in Class
This Keyword
Class Inheritance
JavaScript Programming Language –Advance
Arrow Function in JavaScript
Sync and Async Difference
Introduction to Async Programming
Call-backs and its examples
Promises Introduction
Resolve and Reject in the Promises
Then, Catch and Finally in Promises
Converting a function to Async
Await keyword and its examples
Error Handling in JavaScript
Try Catch –Error Handling
Modular Programming
Difference between the Common JS and ES16 Import and Export
Working with JSON Data
JSON Methods
React Introduction
Creating your first React Application
Understanding React Files and Folder Structure
Running the React Application
Modifying the React App
Modifying Index.html file
Creating your First Components
Introduction About Client-Side Rendering
React DOM Introduction
React Components
Components Introduction
Different Types of Components
Stateless Components Creation
Extending the React Components
Stateful Components Creations
Rendering Single Tag
Render method in Class Components
Advantage of Class Components
Export default Importance
Importing the Components
Using Components in the Application
JSX Introduction
JSX introduction in JavaScript
How JSX works
How JSX is different from HTML
How JSX is Rendered in The DOM
JSX attributes
JavaScript code inside JSX Tags
JSX Dynamic Values
Style Attribute in JSX
Calling Component inside the JSX
React Fragments
Props in React
Child Components
Easy Way of Using React Fragments
Styling the Components
Styling the Components
Styling the Components using JSX Attributes
Styling the Components using Style Tag
Importing Style to the Components
Using Style Framework inside the React App
React State
State introduction
Creating State inside the Components
Different Types of State Creations
Accessing State in Components
Changing State using Set State Methods
Correct Way to Update the State
Passing State to Other Components
React Props
React Props Introduction
Accessing Props in Components
PropTypes Introduction
Prop Types for Props Validation
Props Default Value
Rendering Props using Map Methods
Event Handling
Event Handling Introduction
Event Listeners
Event Listener Types
Event Functions
Event Objects
Prevent Defaults in an Event
Passing Parameters to theEvents Function
Binding Events to the Components
Different types of Event Binding
Synthetic Events
Component Lifecycle
React Lifecycle Methods
Component Did MountMethod
Component Will Unmount Method
Advantage of Using Component Lifecycle
Component Lifecycle Example
React Hooks
React Hooks Introduction
React Hooks in States
Use State
React Hooks in Effect
Use Effect
Creating Custom Hooks in React
Other Hooks in React
Use Context
React Forms
Forms Introduction
Basic Form Creation
Control Form Creation
Controlled Components
Uncontrolled Components
Default Value
Form Input Value Change
Form Submit
Form Data Validation
React Router
Router Setup
React Routers Introduction
React Routers Installation
React Routers features
Single Page Application
Hash Router
Browser Router
Route Configuration
Switch Components
Route Params
Nested Routes
Page Navigations
Nav Link and Link Components
Route Redirect
Pathless Routes
React Redux
React Redux Introduction
React Redux Installation
React Redux Setting
Container Components
Presentational Components
High Order Components
Redux Architecture
Redux Action
Redux Reducers
Redux Store
Principles of Redux
Redux Middleware Introduction
Redux Middleware Choice
Redux Sagas
Saga Helpers
Promises versus Sagas
Generators in Redux-Saga
Saga Methods
Data Fetching from the Endpoints
Data Fetching Introduction
What JSON Data?
REST API Approach
Fetching Data using GET HTTP Method
Posting Data using POST HTTP Method
Updating Data Using PUT HTTP Method
Deleting Data Using DELETE HTTP Method
Disadvantages of REST API
GraphQL Introduction
Advantages of GraphQL
GraphQL Architecture
Datatypes in GraphQL
Modifiers
Schema
GraphQL API Building
Apollo Client Introduction
Apollo Client Setup
Building the Application
Building app for the Production
Creating Build using React Scripts
App Configuration
Webpack Configuration
Installing NPM Serve Package
Build Code in Build Folder
Understanding Build Files
Deploying Build Using Serve Package
Arivu
Front end Trainer
Front end Training Expert worked as front end developer for five years, he is an expert in Javascript, angular, react, devops, nodejs, cloud. He is good at mentoring for career guidance
React JS Training in Bangalore Key Skills
- JSX, Props, State
- Component Lifecycle
- Stateful Components
- Stateless Components
- React HTTP Requests
Advantages in TutorsBot
- Placement Team for Job Assurance to Course Enroller
- Professional Trainer from IT Industry
- Deidicated Support Team for Training and Development
- Practical Training Program includes Hand On Project Session
- More than 150 Subject Matter Expert Community
- Five Years of Training Services Provider
- Placed More than 850 Students
