JTD Courses

Welcome to the course

Environment setup

Anatomy of a React project

Writing a React component

React lifecycle

The React state

Understanding component props and re-rendering

Importing CSS into React components

Writing a calculator part 1

Writing a calculator part 2

React website setup

Component children

React routing

Route parameters and HTML slicing part 1

Route parameters and HTML slicing part 2

Services and portfolio pages part 1

Services and portfolio pages part 2

Working with forms in React part 1

Working with forms in React part 2

Using Formik

Yup form validation schemas

Setup of REST API using LoopbackJS

Creating models

Model observers

Model relations

ESLINT

Subclassing access tokens

Persisting data using MongoDB

Creating data

Updating data

Finding model instances part 1

Finding model instances part 2

Deleting model instances

Creating post collection

Roles and rolemapping

Applying access control to our post model

Adding an editor role

Creating a category model

File storage and collection part 1

File storage and collection part 2

Custom remote methods and file uploads part 1

Custom remote methods and file uploads part 2

Creating login route

Adding a login form

Wrapping components

Dispatching actions

Creating our store and reducers

Integrating remote API calls

Applying middleware

Material-UI intro

Drawer and CSS

Drawer collapsing and animations

Icons, lists, links

Main content class

Persisting reducers using localStorage

Basic tables

Fetching posts and users from our API

Fab buttons

Setting up Redux, Material-UI and Formik for our add post page

Material-UI forms with Formik

Flex display and connecting our post form to our database via Redux part 1

Flex display and connecting our post form to our database via Redux part 2

Editing existing posts

Uploading post images part 1

Uploading post images part 2

Integrating Quill as a content editor

Loading posts on the front-end part 1

Loading posts on the front-end part 2

Loading more posts on demand

Single post page

Registering new accounts

Posting comments and adding relations and ACLs to our API part 1

Posting comments and adding relations and ACLs to our API part 2

Deploying React apps with NGINX

Deploying our API using PM2 and NGINIX part 1

Deploying our API using PM2 and NGINIX part 2

Deploying our API using PM2 and NGINIX part 3

Creating a chat app

Creating our chat store

Websocket connections

Sending socket messages

Creating signup and login forms

Writing account based logic part 1

Writing account based logic part 2

Using auth tokens

Styling the messenger

Tracking logged in users

Search functionality

Creating new threads and sending to relevant clients

Connecting on page load if already logged in

Get threads on page load

Disconnecting socket sessions

Adding messages and sending to relevant clients

Rendering messages client-side

Rendering messages with user information

Ejecting a React application