
Course Introduction.
Information about using the course.
Instruction on Installing create-react-app
Understanding React Project Structure
Setting up SASS for the project
A quick introduction to JSX ( JavaScript XML ) syntax.
Styling React components using Inline Styles ( JS in CSS ) , CSS file and SASS
Building reusable components
How to pass props in the components
Understanding React.fragment
Destructing components props
Rendering component based on condition
Understanding Higher Order Components that takes component as argument and returns a component
useState hook for creating local state
Understanding how hooks works internally
Understanding rules for creating and using hooks
Understanding complex state which holds more than simple primitive types.
Adding click and other events to components
Understanding communication between parent and child component
creating multiple local using useStates
Understanding Keyword events
Building your own custom hook
Adding onChange event to an input element
referencing element using useRef hook
component lifecycle methods
Add lifecycle method using useEffect hook
fetching data using Async Await
Memoization using useMemo hook
creating your own custom hook to hold previous state
useLayoutEffect hook for synchronous layout update
Create a custom hook for fetching data
Setting up Routes for a single page application
Managing global states using Redux
Using React with Redux
Understanding Testing Unit Testing
Building a tic tac toe app.
Building your own component library
Creating a reusable button
Type Checking with proptypes
This is a modern and comprehensive React JS course that focuses on only the latest version of React with hooks ( "no classes"). We will cover the following: You will learn react from scratch , no prior knowledge of react required.
Fundamentals like JSX, component communication, events, fragments, Higher Order Components, and more.
Understand best way to organize files in a react project using common patterns for folder structure
Built-in hooks like useState, useEffect, useReducer, useContext, useDebugValue, useMemo, useRef, useLayoutEffect.
Build our own custom hooks.
Use create-react-app , a command line interface ( CLI ) to swiftly create react projects.
Build a Single Page Application ( SPA ) using react-router-dom
Global State Management with Redux and Redux thunk
Learn unit testing , snapshot testing, mocking in React with Jest and React testing Library .
Build a To-Do app using react
Build a complete drag-n-drop app using react
Build a reusable component library and a documentation site using react styleguidist
Build a documentation site using react storybook
All the code examples are provided in github for your reference.
Many coding exercise to practice
Learn how to upload your react project on github
One of the best feature of this course is its simplicity. All the coding samples are very easy to understand. I prefer to use real-time use cases to explain concepts.