Learn how to connect a custom React app to an Nginx reverse proxy for a Node server with Docker Compose. We will create the React app from scratch using Webpack and Express. We will also learn how to handle CORS related issues with Nginx.
💻 My Software 💻
My Chrome Extension WittCepter - chromewebstore.google.com/det...
📚 My Courses 📚
courses.wittcode.com
👩‍💻 Download Code 👨‍💻
blog.wittcode.com
⌛ Timestamps ⌛
0:00 - Introduction
0:12 - Project Demonstration
1:18 - Project Architecture Overview
2:02 - Environment Variable Setup
2:52 - Node Project Initialization and Webpack Installation
4:48 - Configuring Webpack
6:33 - Creating a React App
8:33 - Coding an Express Server
10:25 - Adding Hot Module Replacement to Express
12:03 - Creating a Node Docker Image
12:37 - Configure Nginx as a Reverse Proxy
14:06 - Nginx Reverse Proxy and CORS
16:46 - Creating a Nginx Docker Image
17:03 - node_modules and Docker Issues
18:10 - Creating a Node Service with Docker Compose
18:49 - Creating a Nginx Service with Docker Compose
19:50 - Debugging
20:43 - Project Demonstration and CORS Demonstration
22:20 - Outro