React Developer


Course Description

React is a JavaScript library for building user interfaces. It was originated by Facebook and is maintained by a a community of individual developers and companies. React can be used as a base in the development of component based web sites and single-page applications. React depends on plugins and libraries for certain features that are a core part of other frameworks. This course will cover plugins for routing (React Router), ajax calls (React Query) and state management (Redux) as well as the core React functionality. This course will highlight the current features in React and highlight the things that have changed. React has evolved quite considerably over the years and some tutorials that you can find on the internet are out of date even if they are only a few years old.

Duration: 5 days


Prerequisites

Understanding of HTML, CSS and JavaScript. This is a beginners course and no experience of React, Angular or Vue is expected.

Introduction

Using Components for Web Application Development - React, Angular & Vue History of React The node.js ecosystem Setting up a development environment

JavaScript ES6 Features

let and const Destructuring The Spread operator Optional chaining (?.) Arrow functions Understanding map operations Types of imports

React Core features

React Hello World React Components Rendering a component Introduction to JSX

React Components

Class Components Functional Components JSX syntax Fragments Props Events Understanding how components are rendered and re-rendered Styling components Conditional rendering Rendering a list Higher order components

React Hooks

What is a "React Hook"? useState; useEffect; useCallback; useMemo

React Forms

Binding to form elements Event handling Validation Understanding state - state management Custom validation

React Router

Single Page Applications
Adding react router to the project
Configuring react router
Query strings and url parameters

React Query

Understanding Ajax A brief history of Ajax calls in React React-Query Create an api using json-server Make an ajax call Loading animation Full Crud example

Authentication

Authentication and Authorization Using OAuth with React Adding Authentication to React Add a Login button Add a Logout button View logged in user profile Create higher order component to apply authentication

Advanced Styling

What are "Styled Components"? Using Bootstrap Material UI Library

Advanced State Management

Understanding State The useState hook What is "prop-drilling"? The useContect hook Introducing Redux Reducers

React Best Practices

Thinking in React Some React anti-patterns Understanding Virtual DOM Component lifecycle Integrating with other libraries

Deploying Your React App

Build your app Upload to firebase Apply a custom domain


React JavaScript Web Development Modern Web Development React Native Front End Web Development Fullstack Web Development MERN Stack