React JS Online Training
Overview
Get an overview of ReactJS Architecture and its key features.
Use state and props of React to manage data.
Gain knowledge on how to handle events, async actions, and data flow.
Understand the usage of React middleware and React router.
Learn the advanced features of Redux and unit testing in React.
Code the React with online integrated development environment(IDE) like an expert.
Who should attend ReactJS training?
Front-end programmers.
UI Developers and Technical Leads
Full Stack Developers
QAs, Architects, and Technical Project Managers
Developers upgrading from AngularJS, EmberJS or other similar UI Javascript frameworks.
What projects are included in this ReactJS training course?
We will provide two real-time projects under the guidance of a professional trainer, who will explain you how to acquire in-depth knowledge on all the concepts involved in these projects.
Prerequisites
Should have knowledge on the basics of HTML and CSS
Should have knowledge of the basic concepts of JavaScript.
Market Demand
Currently, there are numerous job opportunities available for ReactJS developers all over the world
On average, the certified ReactJS professionals are earning $120,000 USD per annum.
Many top multinational companies are hiring certified ReactJS professionals around the globe.
- History of Javascript
- What is ES6
- A word on bable
- Block scope, let & const
- Template literals
- Arrow functions
- Spread and Rest operators
- Object literal improvements
- Destructuring
- Classes
- Inheritance
- Static properties and methods
- Promises
- Iterators and Iterables
- Generators
- Modules
- Set and Map
- What is React?
- Why React?
- React version history
- React 16 vs React 15
- Just React – Hello World
- Using create-react-app
- Anatomy of react project
- Running the app
- Debugging first react app
- Working with React. create Element
- Expressions
- Using logical operators
- Specifying attributes
- Specifying children
- The significance of component Architecture
- Types of components
- Functional
- Class based
- Pure
- Component Composition
- What are state and its significance
- Read state and set state
- Passing data to a component using props
- Validating props using prop Types
- Supplying default values to props using default Props
Understanding component lifecycle
- Understanding React event system
- Understanding Synthetic event
- Passing arguments to the event handler
- Using react to key prop
- Using map function to iterate on arrays to generate elements
- Controlled components
- Uncontrolled components
- Understand the significance of defaultValue prop
- Using react ref prop to get access to DOM element
Understand React Portals
Under error boundaries
React’s new fibre Architecture
- Setting up react router
- Understand routing in single page Applications
- Working with BrowserRouter and HashRouter components
- Configuring route with Route component
- Using Switch component to define routing rules
- Making routes dynamic using route params
- Working with nested routes
- Navigating to pages using Link and NavLink component
- Redirect routes using Redirect Component
- Using Prompt component to get the consent of user for navigation
- Pathless Route to handle failed matches
- What is Redux
- Why Redux
- Redux principles
- Install and setup redux
- Creating actions, reducer and store
Immutable.js for immutable data structures
- What is React Redux
- Why React Redux
- Install and setup
- Understand high order component
- Understanding mapStateToProps and mapDispatchtToProps usage
- Why redux middleware
- Available redux middleware choices
- What is redux saga
- Install and setup redux saga
- Working with Saga helpers
- Sagas vs promises
- What is server-side rendering (SSR)?
- Why SSR
- Working with renderToString and renderToStaticMarkup methods
- Understand the significance of unit testing
- Understand unit testing jargon and tools
- Unit testing react components with Jest
- Unit testing react components with enzyme
- Using sinon to mock
- What is webpack
- Why webpack
- Install and setup webpack
- Working with webpack configuration file
- Working with loaders
- Quick word on code splitting, lazy loading, tree shaking
- Setting up Hot Module Replacement