ReactJS Training Course

The ReactJS Training Course by THE HUB OF KNOWLEDGE is a practical, industry-focused program designed to help learners master modern front-end web application development using React.

This hands-on course provides comprehensive knowledge of building fast, dynamic, and interactive user interfaces using ReactJS. Participants will learn component-based architecture, JSX, state management, hooks, routing, API integration, reusable UI development, and modern front-end best practices required for professional web application development.

The program combines expert-led instruction, coding exercises, and real-world projects to ensure learners gain practical expertise in developing scalable single-page applications (SPAs) and responsive web interfaces. Whether you are a beginner in web development or an experienced developer looking to upgrade your skills, this course equips you with industry-ready ReactJS development capabilities.

The main goal of this React Certification course is to familiarize you with the process and equip you with the skills necessary to become a professional React developer. Through self-paced, instructor-led training, he learns the basics of React to understand and create React components and build applications using Redux.

Course Outline

This course covers the following concepts:

Day 1 • Overview
➢ Understand the View Technology
➢ MVC – Model View Controller
➢ MVVM - Model–View–ViewModel
• What is React?
➢ Understanding View Technology
➢ Single Page Applications
➢ Multi Page Applications
➢ Node and NPM basics
➢ Managing project dependencies
➢ Initialize a Project
➢ package.json
• React Basics
➢ DOM vs Virtual DOM
➢ How does the Virtual DOM work?
➢ Introduction
➢ Installation and basic setup
➢ React CLI tool
➢ create-react-app
➢ Create a new React App
➢ Application Structure
➢ Hello World Application • JSX
➢ What is JSX?
➢ Babel
➢ React.createElement
➢ Embedding Expressions in JSX
➢ Attributes with JSX
➢ Props & Children
➢ Styling with JSX
➢ Referencing JS variables in JSX
• React Components
➢ Creating Components
➢ Functional Components
➢ Class Components
➢ Extending React.Component
➢ Stateless Functions
➢ Rendering Component
➢ Referencing DOM Elements
➢ Higher Order Components
➢ React Elements & JSX
➢ Rendering
➢ Sending and Receiving Props
➢ setting Default Props 
• React State
➢ What is Component State?
➢ Working with Component State
➢ State vs. Props
➢ Initializing State
➢ Updating State
➢ Working with Forms
➢ Refs
➢ Lifting State Up

Day 2
• React - Composing Components
➢ Sibling Components and Keys
➢ Parent and Child Components
➢ Lifecycle Methods
➢ Component Life-Cycle
• React – Events
➢ Handling User Inputs
➢ Event Handlers
➢ Controlled Components
➢ Uncontrolled Components
• Rendering List and conditional
• Axios
➢ Installation
➢ Make XMLHttpRequests from the browser
➢ Intercept request and response
➢ Promise API Support
➢ Get
➢ Post
➢ Put
➢ Delete
➢ React Routing
➢ React Router Dom
• Browser Router
➢ Route
➢ Link
➢ Passing Parameter
➢ Building multipage SPA with React routing
• React Hooks
➢ Introducing Hooks
➢ useState()
➢ useEffect()
➢ useReducer()
➢ useContext()
• Production Build
➢ Webpack
➢ Testing React Applications
➢ Introduction to unit testing

Day 3
• Redux
➢ Introduction
➢ Pure Functions
➢ State Management
➢ Three Principles
➢ Single source of truth
➢ State is read-only
➢ Changes are made with pure functions
• Core Concepts
➢ Actions
➢ Reducers
➢ Store
• Mapping State to Props
• Mapping Dispatch to Props
• Testing ReactApp
• Deploying React App Lab Setup
• Microsoft Visual Code IDE
• Node.js
• Google Chrome Browser
• Desktop PC / Laptop with Windows O.S
• Internet connection