ReactJs from Basic to Advanced

• Introduction
  • Introductionto ReactJS

    In this session we are going to understand

    • What is Single Page Application
    • What is ReactJS
    • What is Virtual DOM
  • Install Required Software

    In this session we will install required software

    • Install NodeJS
    • Install some VS Code extension to speed up development.
  • An intro to NPM

    In this session we will understand about NPM, Package Manager for JavaScript. We will also see how to install a package from npm repository.

  • Create our First React App

    In this session we will create our first React App

  • Explore React App's directory Structure

    In this session we will understand about the directory structure of the first React App. We will also plan to organize our application code in a modular and maintainable directory structure.

• Refresh JavaScript
  • What is Json

    JSON is a format to represent and transfer data.

    Json full meaning is JavaScript Object Notation. It is a lightweight format to represent data.

    const person = {
        firstName: "Neeraj",
        lastName: "Avinash",
    };
    console.log(person);

     

  • What is Destructuring

    Destructuring is to extract specific data from an array or object.

    const numbers = [1, 2, 3];
    const [one, two, three] = numbers;
    console.log(one, two, three);

  • What is Arrow Function

    Arrow functions are a shorter way to write a function

    const hello = () => {
    	console.log("Hello")
    }

  • What is Spread Operator

    Spread operator is used to copy the data from one array or object into another array or object.

    const num1 = [1, 2, 3];
    const num2 = [4, 5, 6];
    const numbers = [...num1, ...num2];

    numbers will have the value 1, 2, 3, 4, 5, 6

• React Components
  • What is Component

    Components are building block of React application. A component can be visualized as some reusable piece of code to do some job. 

    Components are of two types.

    • Class Component
    • Functional Component
  • Component Lifecycle
  • Class Component
  • Functional Components

    Functional components are function based components. After the introduction of Hooks in React, functional components are widely used.

  • Difference between Class and Functional Component
  • What is Props

    In this session we will learn how to pass data from one component to other using props.

  • What is State

    Props and State are vital concepts in React. Unlike the regular variable, State variable preserves information that may change over the Component lifecycle .

    Whenever there is any chnage in the state, the component gets re-rendered.

• Style React Component
• Form Handling
• API call using Axios
• Working with Redux
• Build and Deploy

Neeraj Avinash

• 4.4 Tutor Rating
• 6 Courses
• 5 Students

Full stack Software professional with 18+ years of experience. Having wide exposure to web development for various industries including hospital, domain and hosting, e-learning. Expertise on various technologies PHP, Python, Golang, MySql and PostgreSql, React JS and React Native