React and Serverless - Fullstack Web Development

Sign up to get an exclusive course launch discount!

Course Overview

In this course, you will build a secure and production-ready fullstack typing application from start to finish. Along the way, you will learn core concepts of developing modern web applications like React, authentication/ authorization, Serverless Functions, and continuous integration. By the end of this course, you will have the knowledge you need to build amazing applications to share with the world!

Here's what you will learn.

Modern React including Hooks and the Context API
Source Control with Git/Github
CSS in JSS using Styled Components
Store Data using the Airtable API
Secure applications using JSON Web Tokens
Build and Deploy Serverless Functions in Netlify
Create a Light/Dark Mode
Deploy to Netlify using Continuous Integration

Who is This Course For

The beginner to intermediate developer who wants to learn how to build secure fullstack applications!

This course is perfect for developers who are interested in building real-world applications with React and love to learn new things. Although most React concepts will be covered in detail, it is expected that you already have basic knowledge of both JavaScript and React. Everything else, you'll learn along the way!

What You'll Get

You'll get full access to the videos and source code for life. You'll also get...

full access to the source code (broken down by video)
exclusive live Q&A sessions
exclusive discord channel
lifetime access and updates

FAQs

Do these videos expire?

Nope, you'll have lifetime access 😀

How do I login and view the course?

You can login at learn.jamesqquick.com. Use the login button in the top right.

Is this course for beginners?

Although most concepts will be covered in detail, it is expected that you already have basic knowledge of JavaScript and React. If you are looking for more beginner resources, shoot me and email and I'll point you in the right direction.

Is there a student discount?

Sure thing! Send me an email at me@jamesqquick.com with a picture of your student ID, and I'll send you a 50% off link.

1. Course Overview and Project Setup

Welcome

3 mins
110 MB

My Setup

6 mins
237 MB

1.1 What We'll Build and Resources

4 mins
164 MB

1.2 Create Starter React Project

7 mins
118 MB

1.3 Add Routing with React Router

8 mins
183 MB

1.4 Create the Navbar

5 mins
95 MB

2. Styling with Styled Components

2.1 Introduction to Styled Components

4 mins
157 MB

2.2 Create Base Styled Components

10 mins
258 MB

2.3 Style the Navbar

12 mins
263 MB

2.4 Style the Home Page

7 mins
142 MB

2.5 Style the Game Page

12 mins
304 MB

3. Game Functionality with React Hooks

3.1 Introduction to React Hooks

4 mins
178 MB

3.2 First Hook To Track User's Score

8 mins
158 MB

3.3 Implement the Timer

20 mins
518 MB

3.4 Listen for User Input

4 mins
79 MB

3.5 Update User Score Based on Input

10 mins
264 MB

4. React Context API to Share State Between Components

4.1 Introduction to React Context

3 mins
132 MB

4.2 Tracking User's Score Between Components

10 mins
203 MB

5. Airtable API and Setup

5.1 Introduction to Airtable

4 mins
158 MB

5.2. Airtable Workspace and API

11 mins
135 MB

6. Serverless Functions for Storing High Scores

6.1 Introduction to Serverless Functions

7 mins
279 MB

6.2. Netlify Init and Setup

12 mins
249 MB

6.3. Creating Your First Serverless Function

14 mins
284 MB

6.4. Serverless Function to Retrieve High Scores

13 mins
355 MB

6.5. Setup Environment Variables

8 mins
169 MB

6.6 Displaying High Scores

19 mins
480 MB

6.7. Create Save High Score Serverless Function

15 mins
461 MB

6.8 Refactoring Common Airtable Code

10 mins
308 MB

6.9. Save Score on Game Over

11 mins
299 MB

6.10. Game Over Bug Fix and Extra Styling

9 mins
238 MB

7. Add Authentication with Auth0

7.1 Introduction to Authentication

3 mins
132 MB

7.2. Sign up and Create Tenant in Auth0

5 mins
46.8 MB

7.3. Add Authentication in React

16 mins
500 MB

Logout Update

Auth0 Dashboard Updates

7.4. Require Username on Sign Up

5 mins
75.1 MB

New React Auth0 SDK

8. Add Security Serverless Functions

8.1 introduction to Authorization (JWTs and Access Tokens)

5 mins
199 MB

8.2 Include Access Token in Save Score Request

12 mins
345 MB

8.3. Retrieve and Parse Access Token

8 mins
258 MB

8.4. Validate Access Token (Updated)

16 mins
494 MB

9. Create Light/Dark Mode with Context API and Hooks

9.1 Introduction to Theming with CSS

1 min
40.8 MB

9.2. Create CSS Variables for Theming

9 mins
245 MB

9.3. Use the Styled Components Theme Provider

9 mins
270 MB

9.4. Create UseTheme Hook

10 mins
294 MB

9.5. Persist Theme Choice in Local Storage

6 mins
135 MB

10 Final Touches

10.1. Styling and Clean Up

10 mins
284 MB

10.2. Final Deploy Configurations in Netlify

6 mins
120 MB

11. Course Wrap Up

11.1 What's Next

4 mins
173 MB

11.2 Wrap Up

2 mins
67.3 MB

Hi! I'm James

I'm a developer, speaker, and teacher with a passion for web development, design, and developer tools. I have taught tens of thousands of students online/in-person and am excited to share with you.

In my spare time, I run a YouTube channel, play co-ed soccer with my wife, spend time with my dogs, and can solve a Rubik's cube in under two minutes.

X Facebook Instagram Youtube Website