Scribd
Upload
58 views19 pages

React Online Training

This document provides an overview of React JS with TypeScript including prerequisites, learning plan, core modules like hooks and Redux, server-side integration with Node and Express, and two final projects including an e-commerce and social media application.

Uploaded by

srsjava01.2023
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
58 views19 pages

React Online Training

This document provides an overview of React JS with TypeScript including prerequisites, learning plan, core modules like hooks and Redux, server-side integration with Node and Express, and two final projects including an e-commerce and social media application.

Uploaded by

srsjava01.2023
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 19

React JS

with TypeScript
a MERN & Full Stack Course
React JS
with TypeScript
By NAVEEN SAGGAM
Founder UiBrains Technologies
What is React JS

 It’s an open source library to build Rich User Interfaces


 Used to develop Single Page Applications
 Developed & Maintained by Facebook
 Released in 2013
 Current version 17.0.0 (Oct, 2020)
 Most popular front end library as of today along with Angular
Pre-Requisites

 Basic Knowledge on HTML


 Basic Concepts on CSS
 Good Understanding of JavaScript with Functions & ES6 Features
 Bootstrap knowledge is added advantage
 Visit : UiBrains Technologies YouTube Channel for above tech Stack.
React JS Learning Plan

React
Hooks

Final Major Redux ,


Projects Thunk

React Core
Module

Node ,
Prime React
Express ,
Components
MongoDB

Material UI
React JS Core Module

 Creation of First Application using react-app & folder structure


 Creation of custom component with class & functional
 Applying styles using CSS , Inline , Internal , External
 Adding Bootstrap to React JS Application & Examples
 Manage Props & States in Custom Components
 Events Handlings in React JS with Examples
 Form Handlings in React JS with Examples
 Conditional & List Rendering in React JS
 Components Life-Cycle in React JS
 Context API in React JS
 HTTP Calls in React JS using Axios
 React Routing Concept & Examples
 Big Basket Application using React JS
React JS Hooks

 Hooks are a new addition in React 16.8. They let you use state and other React features
without writing a class
 Introduction to React Hooks
 useState Hook
 useEffect Hook
 useRef Hook
 useContext Hook
 useReducer Hook
 Big Basket Application Using Hooks
Redux , Thunk , Saga

 Introduction to plain Redux with Examples


 Using multiple Reducers
 Implement Redux with React JS with examples
 useSelector() , useDispatch() Examples
 Redux-Logger Configuration
 Redux-Dev Tools Configuration for Debugging
 Redux-Thunk Configuration & Examples
 Introduction to React Saga
 Big Basket Application with Hooks & Redux
Introduction to Material UI

 React components for faster and easier web development. Build your own design system,
or start with Material Design
 Layout Components
 Input Components
 Navigation Components
 Data Display Components
Introduction to Prime React

 The ultimate collection of design-agnostic, flexible and accessible React UI


Components.
 Input Components
 Buttons
 Data Components
 Panels in Prime React
Unit Testing with React JS

 Introduction to Unit Testing


 Introduction to Test Driven Development
 Integration of JEST Framework with React
 Generation of Test Coverage Reports
 Integration of other Testing libraries
Server Side Integration

 Implementation of Node JS Server with Routing


 Implementation of Express JS with Routing
 Introduction to REST API and Development
 Integration of Mongo DB with local & Cloud
 Developing Models with Mongoose Library
Final Project – 1
(React Kart – an Online Shopping App)
 Bootstrap Layout with Responsive side nav with Full Page landing page
 Implementation of React Routing & Navigation for various links
 JSON Web Token (JWT) based Authentication
 Image upload functionality for products
 Server side with Node , Express JS with Mongo DB integration
 Backend Data modeling with Mongoose
 Stripe Payments integration for products purchase
 Final Application Deployment to Heroku App
 Future implementations of the projects
Final Project – 2
(React Social – a Social Media Application)
 Bootstrap Layout with Responsive side nav with Full Page landing page
 Implementation of React Routing & Navigation for various links
 JSON Web Token (JWT) based Authentication
 Server side with Node , Express JS with Mongo DB integration
 Backend Data modeling with Mongoose
 Final Application Deployment to Heroku App
 Future implementations of the projects
Real
Images
Other Applications
Course Information (05-RCJS-EVNG)
 Total Duration 50days (100 hrs.)
 Live & Hands-on Training on Each Technology
 Covers basics to Advanced level with App Development
 Daily videos , Files , Slides Sharing for Practice
 Class Timings 6PM – 8PM IST(Daily 2hrs)
 Monday - Saturday (Sunday Holiday)
 Course Fee : 6000 INR for (Indian) -> screen shot + email + batch code
 100 US-Dollars for (Others)
 Google pay / Phone Pay / Paytm : +91-98 44 80 45 33
[email protected]
Software Installation
 Notepad++
 Node JS
 Mongo DB
 Insomnia / Postman
 Heroku
 Git
 TypeScript
 Editors (WebStorm / Visual Studio Code)
UiBrains
Any Queries ?

You might also like