Typescript

Restrict null and undefined via Non-Nullable-Types in TypeScript

Understand TypeScript’s Control Flow Based Type Analysis

Define Custom Type Guard Functions in TypeScript

Make Properties and Index Signatures Readonly in TypeScript

Represent Non-Primitive Types with TypeScript’s object Type

Use TypeScript’s never Type for Exhaustiveness Checking

Overload a Function with TypeScript’s Overload Signatures

Collect Related Strings in a String Enum in TypeScript

Specify Exact Values with TypeScript’s Literal Types

Model Alternatives with Discriminated Union Types in TypeScript

Infer Types for Rest and Spread Properties in TypeScript

Query Properties with keyof and Lookup Types in TypeScript

Transform Existing Types Using Mapped Types in TypeScript

async / await using TypeScript Course Overview

Simplify Asynchronous Callback Functions using async/await

Promise Fundamentals using TypeScript

Write Async Functions with the async/await Operators

Execute Promises in Parallel and Serial using async / await

Asynchronous Iteration using for-await-of

Introduction to Static Typing

Using Type Inference in TypeScript

Union Types and Type Aliases in TypeScript

Distinguishing between types of Strings in TypeScript

Using Interfaces to Describe Types in TypeScript

Creating a Class in TypeScript

Sharing Class Behavior with Inheritance in TypeScript

Using Assertion to Convert Types in TypeScript

The Basics of Generics in TypeScript

Practical Generics in TypeScript

Add type safety to CSS using TypeStyle

Reusable styles using TypeStyle mixins

Add responsive styles using TypeStyle Media Queries

Style CSS pseudo-classes using TypeStyle

Style CSS pseudo elements with TypeStyle

Compose CSS classes using TypeStyle

Use TypeStyle keyframes to create CSS animations

Load raw CSS in TypeStyle

Use fallback values in TypeStyle for better browser support

Generate static css + html files using TypeStyle

Render HTML/CSS server-side using TypeStyle

Why use TypeScript with React

Bootstrap a TypeScript + React project

Create stateless React components using TypeScript

Create stateful React Components using TypeScript

Publish a React component with TypeScript

Test React components and dom using Enzyme

Test React Applications with Cypress

Understand the FizzBuzz coding problem and its solution

Sort arrays in TypeScript

Case insensitive sorting for string arrays

Determine if two strings are an anagram

Determine if a string is a palindrome

Bubble sort using TypeScript

Quicksort algorithm using TypeScript

Insertion sort algorithm using TypeScript

Merge sort algorithm using TypeScript

Binary Search Algorithm using TypeScript

Find the repeated item in an array using TypeScript

Create random integers in a given range

Stack implementation using TypeScript

Queue implementation using TypeScript

Implement a singly linked list in TypeScript

Implement a doubly linked list in TypeScript

Parse a string to an integer

Shuffle an array

Implement the heap data structure using JavaScript

Find Max Items and Max Height of a Completely Balanced Binary Tree

Implement the Heapsort algorithm using TypeScript / JavaScript

Minimum / Maximum Maintenance algorithm implementation using JavaScript / TypeScript

Sum of the most common algorithmic arithmetic series

Median Maintenance algorithm implementation using TypeScript / JavaScript

Maximum Contiguous Subarray algorithm implementation using TypeScript / JavaScript

Set up ESLint to Audit Accessibility Issues in React

Use react-axe to Audit Accessibility Issues at Runtime during Development

Use the axe Browser Extension to Audit a Web Page for Accessibility Issues

Use tota11y to Visualize Accessibility Issues

Use a High Contrast Browser Extension to Find Color Contrast Accessibility Issues

Change Display Preferences on Mac to Find Color Contrast Accessibility Issues

Enable High Contrast Mode on Windows

Access and Customize VoiceOver Settings on MacOS

Navigate a Webpage with VoiceOver in Safari

Test for Landmark Region Accessibility Issues in React

Define Landmark Regions of a web page using ARIA roles

Define Landmark Regions of a web page using HTML5 sectioning elements

Test for Heading Level Accessibility Issues

Correctly Define Heading Levels of a Web Page

Test for Form Control Label Accessibility Issues

Ensure Form Controls have Accessible Labels

Add Accessible Labels to Elements Whose Labels are Not Clear Enough

Add Accessible Labels to Provide Elements with More Context

Add an Accessible Label to an Element from the Text of Other Elements

Add Accessible Descriptions to Elements

Test for Image Alternative Text Accessibility Issues

Define Images with Appropriate Text Alternatives

Test for Insufficient Color Contrast Accessibility Issues

Use Sufficient Color Contrast in Web Page Design

Use More than Color Alone to Convey Information in a Web Page

Define a Live Region to Ensure Dynamic Changes are Announced by Assistive Technologies

Appropriately Set the Focus on Each Page Load of a Web Application

WTF are Accessible Design Patterns?

Course Intro

Enable React Concurrent Mode

Fetch Data with React Suspense

Handle React Suspense Errors with an Error Boundary

Write a generic React Suspense Resource factory

Refactor data fetching with useEffect to Suspense Resources

Where to Position React Suspense and Error Boundaries

Improve Suspense loading states with useTransition

Use CSS Transitions to Avoid a Flash of Loading State

Modify Suspense Config to Avoid a Flash of Loading State

Cache React Suspense Resources

Preload Images to Improve Loading Performance

Create a Custom Suspending Image Component

Implement the Fetch as you Render Approach for Improved Performance

Create a Custom Hook that Creates Resources

Use SuspenseList for Coordinating Suspending Components

Fetch Modules Eagerly for SuspenseList

Wrapping Up with Experimental React Suspense

Course Overview: Modern JavaScript Tooling with React

Initialize an npm Project and git Repository

Add a Project and Push Changes to GitHub with git

Install webpack and create a default bundle

Explicitly Define an Entry Point with a webpack Configuration File

Control the Output of webpack with the mode Setting

Transform Modern JavaScript Features with Babel

Configure webpack to Load JavaScript Files through Babel with babel-loader

Configure babel for React with preset-react

Inject a JavaScript bundle into HTML with the HtmlWebpackPlugin

Update your Bundle with each File Save with webpack's watch Mode

Create Separate webpack Configs for Development and Production with webpack-merge

Serve a webpack Bundle while Developing with webpack-dev-server

Generate Source Maps through webpack for a Better Debugging Experience with source-map

Support Proposed JavaScript Features with Babel Plugins

Automatically Import CSS in JavaScript with webpack using style-loader and css-loader

Hot Reload a React App in Development with react-hot-loader

Avoid Duplicate Commands by Calling one NPM Script from Another

Analyze a Production JavaScript Bundle with webpack-bundle-analyzer

Externalize Dependencies to be Loaded via CDN with webpack

Target specific browsers with babel-preset-env and the babel pollyfill

Asynchronously Load webpack Bundles through Code-splitting and React Suspense

Run a Simple Test with Jest in a React App

Set Up Tests that Render a React Component with Jest and Babel

Set up Testing Globals in an Application with Jest

Configure Prettier to Automatically Format Code

Avoid Common JavaScript Errors with ESLint

Check for Accessibility Issues in JSX with the jsx-a11y ESLint Plugin

Run Linting, Tests and Prettier in git Hooks with Husky

Avoid Deprecated React APIs with React.StrictMode

Create an Error Boundary for a React App

Define Prop Types for a React Class Component

Check for Accessibility Issues in the Browser with react-axe

Create a New Project by Cloning the Boilerplate Project

Course Introduction: Progressive Web Apps in React with create-react-app

Create a Progressive Web App with React and Register a Service Worker

View the Service Worker and the Cache, and Debug a PWA with Chrome’s Dev Tools

Use a Custom Service Worker in a create-react-app PWA without Ejecting

Pre-cache Static Resources with Workbox and View a React PWA Offline

Listen for install and activate PWA Events in a Service Worker

Cache Third Party Resources from a CDN in a React PWA

Cache JSON Data in a React PWA with Workbox, and Display it while Offline

Add an Offline Status Indicator to a PWA with React

Show an Error when a POST or DELETE Fails in an Offline PWA

Add a Custom App Icon to a PWA built with create-react-app

Change the Name and Short Name of a PWA built with create-react-app

Add a PWA to the Home Screen of an iOS or Android Device, and the Chrome App Home Screen

Add Navigation Elements in React to a PWA in Standalone Mode

Access the Camera in a PWA built with React

Add Push Notifications to a PWA with React in Chrome and on Android

Disable Text Selection and Touch Callouts in a PWA on iOS

Change the Status Bar Color on iOS and Android in a PWA

Customize the Splash Screen of a PWA built with create-react-app

Do a PWA Audit with Lighthouse using Chrome Dev Tools

Introduction to Reusable State and Effects with React Hooks

Environment Setup for React Hooks

Add State with the useState Hook to a React Function Component

Add Linting to Help Enforce Rules when Using React Hooks

Add a Lifecycle Event with the useEffect Hook to a React Function Component

Use the React useRef Hook to Reference a DOM Element or Simulate an Instance Variable

Write Custom Hooks to Share Logic Between React Function Components

Leverage an Existing Community Hook in Your React Function Component

Use the useReducer Hook and Dispatch Actions to Update State

Use the useContext Hook to Wire-up the React Context API

Simulate PureComponent with a React Function Component

Leverage the React useMemo Hook for Expensive Operations

Convert a Render Props Component using a Custom React Hook

Install & Configure the AWS Amplify CLI

Create & Configure an AWS Amplify Project with a React Application

Use the AWS Amplify withAuthenticator HOC to Implement a React User Authorization Flow

Manually Sign Up New Users in React with AWS Amplify Auth Class

Create & Interact with an AWS AppSync GraphQL API with AWS Amplify

Create & Interact with a Serverless REST API with AWS Lambda from React

Store Data in Amazon S3 with React

Deploy Your React Application to AWS Using the Amplify CLI

Install the Prisma VS Code Extension

Initialize Prisma in a TypeScript Node Project

Create a Model for a Table and Run Migrations

Use Prisma Studio to Create a Record

Use Prisma Client to Find Many Records in a Table

Use Prima Client to Select a Subset of Data

Create a Database Record with Prisma Client

Use Express to Create Data Dynamically

Create a Relation Between Two Tables in the Prisma Schema

Use Prisma Client to Query for Related Data

Use Prisma Client to Connect Related Tables when Creating New Data

Limit the Amount of Returned Data with Prisma Client

Create a New Supabase Project

Navigate the Supabase Admin Interface

Create PostgreSQL Tables Using Supabase's Interface

Configure Supabase Auth to Allow Users to Login with GitHub

Use Triggers to Automatically Update Supabase Tables

Set up a Supabase Client in Next.js

Set up a Login Page in Next.js with Supabase's auth.session()

Set up GitHub Authorization with Supabase

Manage Third-Party Authorization Errors in Supabase

Executing Raw SQL using Supabase's Interface

Retrieve Data with a Supabase API Request

Subscribe to Database Changes using Supabase's Realtime Client

Enable Realtime Only for Individual Tables using supabase_realtime

Insert Submitted Data to Supabase Tables

Keep Track of the Current User Using Next.js with Supabase

Logout and Update Users with React and Supabase's upsert Method

Request User Details for a Given User Using Supabase's API

Retrieve and Displaying User Details with User Subscriptions

Deploy a Supabase Application to Production with Cloudflare Pages

Building Supabase Serverless Workflows with Cloudflare Workers

Create a New React Application with the Next.js create-next-app CLI

Add and Style a Grid of Products with Images in a Next.js React App

Add and Configure Products in the Stripe Dashboard for an Online Store

Dynamically Manage a Grid of Products in an Online Store with a JSON Document

Host & Deploy a Next.js React App on Vercel imported from GitHub

Configure a Stripe Checkout Domain for Client-Only Integration

Add a Stripe API Key as an Environment Variable in Next.js & Vercel

Integrate Stripe Checkout to Purchase Products in Next.js with Stripe @stripe/stripe-js Cl

Create a Shopping Cart with the useState React Hook to Manage Product Quantity and Total

Create a Custom React Hook to Manage Cart State

Use the React Context API to Globally Manage Cart State in a Next.js App

Store and Load Cart State from Local Storage to Persist Cart Data When Reloading the Page

Use Next.js Dynamic Routes to Create Product Pages for an Online Store

Create a Shopping Cart Page to Manage Products to Purchase in a Next.js App

Add a Quantity Input to the Cart Page to Add or Remove Items from a Shopping Cart in Next

Build a Page Layout in Gatsby

Create a React Form in Gatsby

Generate Dynamic Routes in Gatsby with Reach Router

Manage Application State in Gatsby with React Hooks

Generate an Access Token for Users with Twilio Serverless Functions

Consume a Generated Twilio Token in Gatsby with React Hooks

Restrict Access in Gatsby with Protected Routes

Connect Video to a Room with React Hooks in Gatsby

Show Video in Gatsby from Remote Participants with React Hooks

Handle Disconnected Participants with React Hooks and the Twilio API