React.js Training in Seattle

Section 01: Self Paced Learning Curriculum

• Lesson 01: Course Introduction

  13:35Preview

  • 1.01 Course Introduction

    03:25

  • 1.02 What is React

    04:03

  • 1.03 Setting up the Environment

    06:07

• Lesson 02: Project 1- Starting (GitHub Finder) and Setting up React

  32:46Preview

  • 2.01 Project Introduction

    03:21

  • 2.02 Creating a React Application and Viewing the File Structure

    10:32

  • 2.03 Create React App (CRA) Cleanup and Preparation

    06:36

  • 2.04 Introduction to JavaScript Syntax Extension (JSX) and Fragments

    06:22

  • 2.05 Expressions and Conditionals in JavaScript Syntax Extension (JSX)

    05:55

• Lesson 03: Components, States, and Props

  57:19Preview

  • 3.01 Component, Props and Prop Types

    10:47

  • 3.02 Getting Started with Component States

    09:08

  • 3.03 Lists and Passing a State with Props

    08:30

  • 3.04 Stateless Functional Components

    07:18

  • 3.05 Handling Hypertext Transfer Protocol (HTTP) Requests and Updating States

    09:05

  • 3.06 Spinner Component and Refactoring

    07:19

  • 3.07 Environment Variables

    05:12

• Lesson 04: Event, Passing Props, React Router, and More

  01:17:59Preview

  • 4.01 Events and Search Components

    07:58

  • 4.02 Passing Props up and Searching Users

    08:28

  • 4.03 Clearing Users from Your State

    07:26

  • 4.04 Setting up an Alert State and Component

    09:45

  • 4.05 Setting up a React Router

    08:43

  • 4.06 Adding a Single User Component and Data

    11:37

  • 4.07 Creating a User Component User Interface (UI) and Layout

    13:09

  • 4.08 Repos and the RepoItem Component

    10:53

• Lesson 05: Refactoring Hooks and Context API

  01:45:08Preview

  • 5.01 Overview of Hooks and Context Application Programming Interface (API)

    07:33

  • 5.02 Using a Search- Class to Function with the use State Hook

    07:28

  • 5.03 Using a User Class to Function with the use Effect Hook

    08:30

  • 5.04 App Class Function Component

    08:15

  • 5.05 Implementing the Context Application Programming Interface (API) and Using the Reducer

    12:38

  • 5.06 Creating Reducers

    12:28

  • 5.07 Moving User State to the Context Application Programming Interface (API)

    15:37

  • 5.08 Moving Repos State to the Context Application Programming Interface (API)

    04:24

  • 5.09 Creating an Alert Context Workflow

    12:56

  • 5.10 Creating the Home and NotFound Components

    04:41

  • 5.11 Preparing and Deploying to Netlify

    10:38

• Lesson 06: Project 2- Contact Keeper– Mongo DB, Express, React, and Node (MERN) and Setting up an Express Server

  38:21Preview

  • 6.01 Project Introduction

    03:35

  • 6.02 Setting up MongoDB Atlas

    05:17

  • 6.03 Creating Dependencies and a Basic Express Server

    09:20

  • 6.04 Setting up Backend Routes

    11:17

  • 6.05 Connecting MongoDB to the Application

    08:52

• Lesson 07: Backend User, Contacts, and JSON Web Tokens (JWT) Authentication

  01:12:38Preview

  • 7.01 User Model and Validation

    11:31

  • 7.02 Hashing Passwords and Registering Routes

    08:03

  • 7.03 Creating and Responding with a JavaScript Object Notation (JSON) Web Token

    06:34

  • 7.04 Creating an Authentication Route

    09:00

  • 7.05 Authenticating Middleware and Protecting Routes

    10:26

  • 7.06 Creating a Contact Model and Getting the Contacts Route

    06:54

  • 7.07 Adding a Contact Route

    08:05

  • 7.08 Updating Contacts and Deleting Routes

    12:05

• Lesson 08: Setting up Your Client and Contacts User Interface (UI)

  01:50:25Preview

  • 8.01 Setting up React and Concurrently

    04:58

  • 8.02 Setting up Cleanup, Navbar, and a Router

    15:32

  • 8.03 Creating Contacts, Context, and a Global State

    09:54

  • 8.04 Creating the Contacts and ContactItem Components

    14:22

  • 8.05 Creating the ContactForm Component

    17:13

  • 8.06 Deleting a Contact from the User Interface (UI)

    05:51

  • 8.07 Setting and Clearing Current Contacts

    06:50

  • 8.08 Adding Actions for Editing and Updating Contacts

    12:09

  • 8.09 Creating a Contact Filter Form and State

    16:24

  • 8.10 Creating a Basic Add and Delete Animation

    07:12

• Lesson 09: React or Express Authentication

  01:30:36Preview

  • 9.01 Creating Authentication Context and Initial State

    08:30

  • 9.02 Creating Register and Login Forms

    10:41

  • 9.03 Creating Alert Context, States, and Components

    17:00

  • 9.04 Creating a User Registration Form

    17:20

  • 9.05 Loading a User and Setting a Token

    15:20

  • 9.06 Creating User Login

    07:38

  • 9.07 Creating the Logout and Navbar Components

    08:10

  • 9.08 Creating the PrivateRoute Component

    05:57

• Lesson 10: Integrating and Deploying the Contacts Application Programming Interface (API)

  47:05Preview

  • 10.01 Adding Contacts to the Database

    10:45

  • 10.02 Getting and Clearing Contacts

    14:51

  • 10.03 Deleting Contacts

    04:49

  • 10.04 Updating Contacts

    03:16

  • 10.06 Preparing and Deploying to Heroku

    13:24

• Lesson 11: Project 3- Start IT Logger (Redux)- Components and User Interface

  01:22:58Preview

  • 11.01 Project Introduction

    05:31

  • 11.02 Setting up React and the JavaScript Object Notation (JSON) Server

    08:48

  • 11.03 Setting up Materialize Cascading Style Sheets (CSS)

    08:38

  • 11.04 Creating the SearchBar and Logs Components

    11:33

  • 11.05 Creating the LogItem and Preloader Components

    10:50

  • 11.06 Creating the AddBtn and AddLogModal Components

    20:34

  • 11.07 Adding the Edit and Tech Modal Components

    17:04

• Lesson 12: Redux State Management

  01:15:20

  • 12.01 Setting up the Redux Store and Provider

    11:33

  • 12.02 Setting up Logs Reducer, Actions, and Types

    13:52

  • 12.03 Connecting Redux to a Component

    10:09

  • 12.04 Adding Logs

    09:30

  • 12.05 Deleting Logs

    07:48

  • 12.06 Updating Logs

    14:41

  • 12.07 Searching Logs

    07:47

• Lesson 13: Technicians State and its Components

  32:59Preview

  • 13.01 Techs Reducer, Actions, and Components

    10:34

  • 13.02 Using the Select Component

    07:02

  • 13.03 Adding Technicians

    07:11

  • 13.04 Deleting Technicians

    08:12