Module 3: JavaScript

JavaScript Basics

• Include JS in HTML.
• Introducing JavaScript.
• JavaScript Getting Started.
• JavaScript Language Fundamentals.
• Variables.
• Data Types.
• Operators.
• Functions.
• Loops.
• Conditions.
• Array.
• Objects.
• Events.
• DOM.

JavaScript Advanced

• Hoisting.
• Scope.
• Difference between let, var and const.
• Arrow functions vs Normal functions.
• Objects.
• Callbacks.
• Promises.
• Closures.
• Asynchronous JS.
• This.
• Map.
• Filter.
• foreach.
• Push.
• Pop.
• Object Methods.

Module 4: React JS

Introduction to React JS

• Why businesses should use ReactJS.
• Comparing JavaScript, Angular, and ReactJS.
• What makes developers prefer to React over Angular.
• Understanding unified data store and its importance.
• How exactly ReactJS works.
• Reading Task on Features of React and features over Angular JS.

Introduction to JSX

• What is JSX.
• Conditional rendering.
• Expressions in JSX.
• Specifying children with JSX.
• Build a simple product catalog using JSX Elements applying JSX rules.

Components in React

• What is JSX?
• Functional vs Class components.
• Components Lifecycle.
• Pure Components.
• Higher Order components.
State, Props, Event Handling
• What is State and its significance.
• Passing data to component using props.
• Validating props using prop Types.
• Supplying default values to props using default Props.
• Understanding React event system.
• Understanding Synthetic events.
• Passing arguments to event handlers.

Navigation & Routing

• Setting up react-router.
• Understand routing in single-page applications.
• Working with Browser Router and Hash Router components.
• Configuring route with Route component.
• Making routes dynamic using route params.
• Working with nested routes.
• Navigating to pages using Link and Nav Link component.
• Redirect routes using Redirect Component.
• Using Prompt component to get the consent of the user for navigation.
• Pathless Route to handle failed matches.

Hooks in React

• Introducing Hooks, Hooks at a Glance.
• Using the State Hook.
• Using the Effect Hook Rules of Hooks.
• Building Your Own Hooks Context.
• Context in Class.
• Functional Components Updating / Consuming contexts.
Managing state using Redux
• What is Redux.
• Store, Actions, Reducer.
• Redux with React.
• Redux Best practices.
Handling Forms
• Creating a Custom Dynamic Input Component Refs, Controlled elements.
• Handling multiple inputs & common errors.
• Creating reusable controlled elements Basic data Validation.
• Custom validation using joi-browser.
Authentication & Authorization
• Authentication using JWT.
• Storing tokens in Session/Local Storage.
• Using Cookies for authentication.
• Managing Role based access.
Testing React Components
• Using React Testing Library.
• Unit Testing with Jest, Enzyme.