ReactJS Industrial Training - Course Contents
Basics of JS
What is ES6
Block scope, let & const
Spread and Rest operators
Object literal improvements
Static properties and methods
Iterators and Iterables
Set and Map
What is React?
Templating using JSX
Working with React Create Element, Expressions, Using logical operators, Specifying attributes, Specifying children
Significance of component architecture
Types of components
State and props
What is state and it significance
Read state and set state
Passing data to component using props
Validating props using propTypes
Supplying default values to props using defaultProps
Using React key prop
Using map function to iterate on arrays to generate elements
Event Handling in React
Understanding React event system
Understanding Synthetic event
Passing arguments to event handlers
Working with forms
Understand the significance to defaultValue prop
Using react ref prop to get access to DOM element
Routing with react router
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 RedirectComponent
Using Prompt component to get consent of user for navigation
Path less Route to handle failed matches
What is redux
Install and setup redux
Creating actions, reducer and store
Immutable.js for immutable datastructures
What is Immutable.js?
What is React Redux
Why React Redux
Install and setup
Presentational vs Container components
Understand high order component
Understanding mapStateToProps and mapDispatchtToProps usage
Unit Testing in react
Understand the significance of unit testing
Understand unit testing jargon and tools
Unit testing react components with Jest
Unit testing react components with enzyme
What is 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
Server-side rendering with React
What is server-side rendering (SSR)?
Working with renderToString and renderToStaticMarkup methods
Feature of ReactJS
Virtual DOM- Like an actual DOM, virtual DOM is also a node tree that lists the elements and their attributes and content as Objects and their properties. React’s render function creates a node tree out of the react components. Then, it updates this tree in data model caused by various actions done either by the user or by the system.
One-way Data Binding- Unlike other frameworks, ReactJS follows unidirectional data flow or one-way data binding. The main benefit of One-Way-Data binding is that throughout the application the data flows in a single direction which gives you better control over it.
Learning Curve- With a basic knowledge of programming you can learn ReactJS. If you have previous knowledge of HTML, You can easily learn ReactJS.
Benefits of ReactJS
Single Page Application.
Entire page remains the same but only a few components change.
A Code is easy to scale and maintain.
More functionalities as HTML is created from JS
Isomorphic Rendering(Server side rendering)
Easy to learn and use.