React JS Masterclass

Name: React JS Masterclass
Rating: 4.1 (7 reviews)

Learn and Earn with React JS including Axios, Redux and Hooks

Created bySoftTech Academy

Last updated 6/2021

English

What you'll learn

Using React JS with Redux, Hook and many latest features
learn and use JSX, CRA, components etc.
Using React for real-world project
learn about Props, states, class, arrow functions, conditional rendering, array function
using event handling, importing CSS, DOM and Axios etc

Course content

2 sections • 38 lectures • 4h 4m total length

What is React2:26
Hello World in React7:10
React Without JSX6:21
Classname vs. Class2:43
JSX Restriction3:18
Installing CRA6:15
Install create-react-app with npm and npx, and start a hello world app. Open the browser to view the default template and watch updates.
CRA Folder Structure7:43
Creating Components and Reusing it4:38
Importing Exporting Components5:46
Class Components6:19

Props5:59
Prop-Example-24:16
State7:01
State-Example-25:45
Arrow Function and Binding4:21
Conditional Rendering5:10
Conditional Rending-II6:46
Rendering Arrays and Key Props5:15
Map Function4:43
Filter Function3:19
Explore how filter function works in a React JS Masterclass, using conditions and index to remove items from an array, and compare it with map as a higher-order function.
Eent Handling4:41
Outputting Dynamic Content5:23
Learn to output dynamic content by handling input events and using state in React, updating a paragraph as you type and rendering typed values in real time.
Spread Operator9:22
Object Props Destructuring4:52
React Dev Tools4:51
Class Life Cycle8:56
Functional Component7:08
Explore functional components by building a counter, importing React, and exporting the component. Learn to convert a normal function to a functional component and pass props with destructuring.
useState5:08
useEffect lifecycle in function component9:16
Explore how to implement lifecycle in a functional component with useEffect, including mount, update, unmount, and controlling runs with a dependency array.
Inline Styling5:51
Importing CSS files4:09
Learn how to import CSS files into a React component, apply class names, and use dynamic classes for conditional styling while avoiding global style conflicts.
Dynamic classnames and template literals4:06
Importing Images2:30
Importing SVGS6:28
useRef Hook10:31
Learn how the useRef hook manages DOM references and input values without triggering re-renders, using refs to log or submit input and decide when to use ref instead of state.
Fetching from API Axios11:36
React Routing19:26
Render Props14:57

Requirements

Basic understanding on JavaScript
Windows PC with Microsoft Visual Studio Code installed
Basic idea HTML and CSS

Description

This Course is on React Js - zero to hero, we have structured content from Redux, Hooks and MERN on this Course! In this course we cover

Introduction of React
- React Basics, React on static HTML file, Understanding JSX, className instead of class in tag, installing and generating CRA, understanding CRA folder structure, import , export, making components and reusing components.
React Starting
- Props, States,arrow function and this binding, passing method as props, object/props restructuring, understanding about spread operator, conditional rendering, key props and rendering arrays, array function map, event handling, output dynamic content, useState Hook,useEffect lifecycle method, inline styling, importing css, importing svgs,
- We will also be using DOM, Axios, Routing on React, understanding render props, understanding higher order component function
React State Management
- ContextAPI, Redux, Hook
- Redux Middlewares & Redux Thunk
React Project: This will be focusing on real world project which will revise you all the skills you obtained from this course in one single project.

As ReactJs is javascript library which support both front end at web and back end at server, it is mainly used for creating user interfaces and creating web applications. By the end of this course you will be able to understand the flow and methods on React and how to use it for creating real-world project!

So , Join it now!

Happy Learning!

Who this course is for:

React Enthusiast
Thos who want to work as front end or back end projects with React

React JS Masterclass

What you'll learn

Explore related topics

Course content

React JS- Introduction10 lectures • 53min

Important Concept on React28 lectures • 3hr 12min

Requirements

Description

Who this course is for: