React: Creating and Hosting a Full-Stack Site

React: Creating and Hosting a Full-Stack Site
React: Creating and Hosting a Full-Stack Site
English | MP4 | AVC 1280×720 | AAC 48KHz 2ch | 2h 41m | 483 MB

You’ve learned React and can create amazing front-end interfaces. But deploying them requires more. You need logic—and a place to put it. By combining your front-end UI with a back-end solution and cloud hosting, you can build powerful and interactive full-stack applications. In this project-based course, Shaun Wassell shows how to combine React, Node.js, and Amazon Web Services (AWS) in a full-stack, full-featured website, including user-friendly forms for posting articles and comments. Learn how to create an interface from React components, develop a Node.js server, tie in a MongoDB database, and deploy your site on Amazon Web Services. By the end of the course, you’ll have the skills to take your client services to the next level: full-stack web applications that are truly interactive.

Topics include:

  • Creating the app component
  • Using React-Router links
  • Setting up an Express server
  • Route parameters in Express
  • Adding the comments functionality
  • Installing and adding MongoDB to your project
  • Rewriting the endpoints
  • Adding React hooks
  • Adding buttons and forms
  • Pushing code to GitHub
  • Running a full-stack app on AWS
Table of Contents

1 React for full-stack solutions
2 What you should know
3 Installing Node.js and npm

Creating a React Front End
4 Why React
5 Setting up a React project
6 Creating the app component
7 Creating blog pages
8 Using react-router links
9 URL parameters with react-router
10 Creating and linking the articles list
11 Making the articles list modular
12 Creating a 404 page in React

Creating a Node Back End
13 Why Node.js
14 Setting up an Express server
15 Testing an Express server with Postman
16 Route parameters in Express
17 Automatically updating with nodemon
18 Adding comments functionality
19 Adding comments

Setting Up MongoDB
20 Why MongoDB
21 Installing MongoDB
22 Adding MongoDB to Express
23 Rewriting the upvote endpoint
24 Rewriting the comments endpoint

Connecting the Front and Back Ends
25 The Fetch API
26 Adding React hooks
27 Calling useEffect at the right time
28 Adding Fetch to pages
29 Displaying comments
30 Adding an Upvote button
31 Adding an Add Comment form, part 1
32 Adding an Add Comment form, part 2
33 Adding an Add Comment form, part 3

Hosting the Site
34 Preparing the app for release
35 Pushing code to GitHub
36 Creating and SSHing into an AWS instance
37 Setting up an AWS instance
38 Running a full-stack app on AWS

39 AWS resource teardown
40 Next steps