Node with React- Fullstack Web Development

Node with React: Fullstack Web Development, available at $119.99, has an average rating of 4.35, with 232 lectures, based on 14770 reviews, and has 88573 subscribers.

You will learn about Create boilerplate starter projects with React, Redux, Express, and Mongo Understand common web technologies and design patterns to connect them together Master deployment techniques between the production and development environments Make an app with Google OAuth authentication Learn to effectively create and send emails from a backend server Accept and process credit card payments from users This course is ideal for individuals who are Anyone who wants to learn how to build full stack apps with the latest in web technology It is particularly useful for Anyone who wants to learn how to build full stack apps with the latest in web technology.

Enroll now: Node with React: Fullstack Web Development

Summary

Title: Node with React: Fullstack Web Development

Price: $119.99

Average Rating: 4.35

Number of Lectures: 232

Number of Published Lectures: 219

Number of Curriculum Items: 232

Number of Published Curriculum Objects: 219

Original Price: $174.99

Quality Status: approved

Status: Live

What You Will Learn

Create boilerplate starter projects with React, Redux, Express, and Mongo

Understand common web technologies and design patterns to connect them together

Master deployment techniques between the production and development environments

Make an app with Google OAuth authentication

Learn to effectively create and send emails from a backend server

Accept and process credit card payments from users

Who Should Attend

Anyone who wants to learn how to build full stack apps with the latest in web technology

Target Audiences

Anyone who wants to learn how to build full stack apps with the latest in web technology

Note: This course assumes you’ve got the basics of React and Redux down. ?Check out my course ‘Modern React with Redux’, its the perfect preparation!

Go beyond the basics of React and Redux! ?This course will teach you to combine the ultra-popular React, Redux, Express, and MongoDB technologies to build?a fullstack web application.

Advanced Deployment??You will learn it. ?Billing/Payments??Included. ?Handling Email??Of course!

What Will You Build?

All of my courses are ‘learn-by-doing’: no boring endless lectures with Powerpoints, only live, interactive coding examples.??In this course we’ll build one massive web application that profiles the advanced features of React, Redux, Express, and Mongo. ?By putting each concept into a real app, you’ll get a better idea of when to use each?unique and powerful feature.

Build a large feedback-collection app.?This mega app will include the full gamut of features, including everything from authentication to email handling. ?You’ll learn how to build an app that can be used to send mass emails to a big list of users for the purpose of collecting feedback. ?It’s my goal to ensure you understand each feature we build into this app so you can apply them to your own personal or professional projects in the future.

Here’s what we’ll learn:

Learn the architectural considerations of building a full stack app

Connect a front-end Create-React-App server to a NodeJS and Express backend

Communicate data from your Mongo database to your React application

Understand how to route user requests on the front end with React Router and on the backend with Express

Build reusable user inputs with Redux Form, complete with navigation

Handle credit cards and receive payments from your users with Stripe

Engage your users with automated emails

Enhance authentication flows in your app with Google OAuth authentication

Separate production and development resources with advanced API?key handling techniques

Educate your users on how to use your app with?custom build?landing?pages

I’ve built the course that I would have wanted to take when I was learning to build fullstack apps. A course that explains the concepts and how they’re implemented in the best order for you to learn and deeply understand them.

Course Curriculum

Chapter 1: Course Overview – Start Here!

Lecture 1: Course Resources

Lecture 2: Join Our Community!

Lecture 3: App Overview

Lecture 4: App User Flow Walkthrough

Lecture 5: Tech Stack

Lecture 6: App Mockups

Chapter 2: Server Side Architecture

Lecture 1: Application Architecture

Lecture 2: Relationship Between Node and Express

Lecture 3: Generating Express Apps

Lecture 4: Express Route Handlers

Lecture 5: Important Info About Heroku and Deployment

Lecture 6: Deployment Checklist

Lecture 7: [Render] Git and GitHub Setup

Lecture 8: [Render] Registration, Creating a Service and Deployment

Lecture 9: [Heroku] Installing the Heroku CLI

Lecture 10: [Heroku] Verifying Deployment

Lecture 11: [Heroku] Followup Deployments

Chapter 3: Authentication with Google OAuth

Lecture 1: Intro to Google OAuth

Lecture 2: The OAuth Flow

Lecture 3: Overview of Passport JS

Lecture 4: Passport Setup

Lecture 5: The Google OAuth API

Lecture 6: Google Project Setup and Enabling the Google OAuth API

Lecture 7: Securing API Keys

Lecture 8: Google Strategy Options

Lecture 9: Testing OAuth

Lecture 10: Authorized Redirect URIs

Lecture 11: OAuth Callbacks

Lecture 12: Access and Refresh Tokens

Lecture 13: Nodemon Setup

Chapter 4: Adding MongoDB

Lecture 1: Server Structure Refactor

Lecture 2: The Theory of Authentication

Lecture 3: Signing In Users with OAuth

Lecture 4: Introduction to MongoDB

Lecture 5: Remote vs Local MongoDB Instances

Lecture 6: MongoDB Atlas Setup and Configuration

Lecture 7: Connecting Mongoose to Mongo

Lecture 8: Breather and Review

Lecture 9: Mongoose Model Classes

Lecture 10: Saving Model Instances

Lecture 11: TokenError: Bad Request

Lecture 12: Mongoose Queries

Lecture 13: Passport Callbacks

Lecture 14: Encoding Users

Lecture 15: Deserialize User

Lecture 16: Enabling Cookies

Lecture 17: Testing Authentication

Lecture 18: Logging Out Users

Lecture 19: [Optional] A Deeper Dive

Chapter 5: Dev vs Prod Environments

Lecture 1: Dev vs Prod Keys

Lecture 2: MongoDB Atlas Production Setup and Configuration

Lecture 3: Generating Production Resources

Lecture 4: Determining Environment

Lecture 5: Version Control Scheme

Lecture 6: [Render] Production Environment Variables

Lecture 7: [Heroku] Production Environment Variables

Lecture 8: Fixing Proxy Issues

Chapter 6: Moving to the Client Side

Lecture 1: Important Update About React App Generation

Lecture 2: React App Generation

Lecture 3: A Separate Front End Server

Lecture 4: Running the Client and Server

Lecture 5: Important Create React App Proxy Update

Lecture 6: Routing Stumbling Block

Lecture 7: The Beauty of Create React Apps Proxy

Lecture 8: [Optional] Why This Architecture?

Chapter 7: Developing the Client Side

Lecture 1: Async/Await Syntax

Lecture 2: Refactoring with Async/Await

Lecture 3: Important Note About Proxy

Lecture 4: Front End Tech

Lecture 5: Client React Setup

Lecture 6: ReactDOM warning with React v18

Lecture 7: Installing Root Modules

Lecture 8: Troubleshooting NPM

Lecture 9: createStore Strikethrough in Code Editor

Lecture 10: Redux Review and Setup

Lecture 11: The Auth Reducer

Lecture 12: Finishing Reducer Setup

Lecture 13: Why We Care About Auth

Lecture 14: React Router Setup

Lecture 15: Route Configuration

Lecture 16: Matching Routes with Exact

Lecture 17: Always Visible Components

Lecture 18: Materialize CSS

Lecture 19: Webpack with CSS

Lecture 20: Header Design

Lecture 21: Current User API

Lecture 22: Additional Proxy Rules

Lecture 23: Basics of Redux Thunk

Lecture 24: Refactoring the App

Lecture 25: Testing FetchUser

Lecture 26: Refactoring to Async/Await

Lecture 27: AuthReducer Return Values

Lecture 28: Accessing State in the Header

Instructors

Stephen Grider
Engineering Architect

Rating Distribution

1 stars: 111 votes

2 stars: 130 votes

3 stars: 777 votes

4 stars: 3733 votes

5 stars: 10019 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!