Connect a React App to Nginx Reverse Proxy for Node Server with Docker Compose
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.
📚 Docker Compose Crash Course 📚
https://courses.wittcode.com
💻 My Software 💻
My Chrome Extension WittCepter - https://chromewebstore.google.com/det...
👩💻 Download Code 👨💻
https://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
Watch video Connect a React App to Nginx Reverse Proxy for Node Server with Docker Compose online without registration, duration hours minute second in high quality. This video was added by user WittCode 09 May 2024, don't forget to share it with your friends and acquaintances, it has been viewed on our site 987 once and liked it 20 people.