REACT JS
Module 1: What is React JS?
- React JS Introduction
- Advantages of React JS
- Work flow of React JS
- Scope of React JS
Module 2: Overview of JSX
- Introduction of Virtual DOM.
- Difference between JS and JSX.
- React Components overview
- Containers and components
- What is Child Components?
- What is Namespaced components?
- What are the JavaScript expressions available in JSX?
Module 3: React JS Environment Setups
- Node setup
- How to use NPM?
- How to create package.json and purpose of it?
- ES6 Introduction and features.
- Webpack Overview
- Best IDE for React JS and How to write optimized code in React JS?
- React JS browser plugins overview.
Real-time Practicals
- NPM Installation by locally and Globally
- Create a Basic App with React JS and other Supported NPMs.
Module 4: A Real-Time Application by using React JS
- Create a React component with JSX template.
- How to create Nested Components?
- What is React JS render?
- React Props overview.
- Introduction of Props validation with data types.
- Flow of States, Initialize states and update states.
Real-time Practicals
- Create a Small React Module
- Use All the states in in the created Application.
Module 5: React JS forms and UI
- Lists of Form components.
- Setup Controlled and Uncontrolled form components.
- Control Input elements.
- How to set default values on all formats of Input elements.
- React JS Form validations.
- How to write Styles?
- Animations overview
Real-time Practicals
- Create a React Form.
- Client-side form validation.
- Applying form components.
- Submit and Rest the form.
Module 6: React JS Component Life Cycles Overview
- Initial Render
- Props Change
- Stage Change
- Component willMount
- Component didMount
- Component Unmount
Real-time Practicals
- Applying Different Lifecylces in the Application.
- When to choose Appropriate lifecycles.
Module 7: Routing in React JS and Other JS concepts
- Single Page Application Overview.
- How to configure React Router?
- History of Router
- How to Handle Conditional statement in JSX?
- IIFE in JSX for complex logic overview.
Real-time Practicals
- Create a Single Page Application.
- Applying Routing.
- Dynamically render the components based on the url.
Module 8: Event Handling in JSX
- onBlur, onKeyUp, onChange and other useful primary events in React JS.
- How to Sharing events between the components?
Real-time Practicals
- Communicate Data between components.
- Applying all lists of events.
Module 9: How to write Styles in React JS?
- CSS and inline styles in React JS overview.
- Introduction to styled components
Real-time Practicals
- Styling the application using styled component
- How to use Animations in the Application.
Module 10: React Router with Navigation
- How to Load the router library?
- Configure the React Router?
- How to Pass and receive parameters?
- Integration of React-cookie overview.
Module 11: Flux overview
- What is Flux Architecture?
- What are the Flux Components available?
- Stores.
- Dispatchers.
- View Controllers.
- Actions.
- Views.
- How Flux works?
- Flux and React works together.
Module 12: Redux Overview
- Introduction to One Store.
- Provider Component
- Actions.
- Reducers.
- sagas
- Dispatchers
- View Controllers
- Selectors
Real-time Practicals
- Redux application Development with Real-time Project
Module 13: Unit Testing Overview
- What are the necessary Tools required for Unit Testing?
- React Unit Testing overview
- Introduction to JEST.
- How to Test React Component?
- How to Test React Router?