11# NGINX w/ Static Files (React Vite)
22
3- This is a demo app that follows a production-grade development workflow using
4- NGINX as a prodcution server to serve static SPA React app files generated by
5- Vite.
3+ This is a demo of a single-container app that follows a professional and a
4+ production-grade CI/CD workflow using NGINX as a prodcution server to serve
5+ static SPA React app files generated by Vite.
66
77![ react app served by NGINX in a Docker container] ( https://i.ibb.co/8DMJhDqT/Screenshot-2025-09-16-at-22-53-18.png )
88
9- ## Production Grade Workflow:
9+ The deployment workflow below will run every time we open a pull request from a
10+ feature branch into ` main ` branch. GitHub Action will start the tests, and if
11+ tests pass the code will be automatically deployed to an AWS ElasticBeanstalk
12+ application.
13+
14+ ## Production Grade CI/CD Workflow:
1015
1116### Development Phase
1217
@@ -26,10 +31,14 @@ Vite.
2631- New code is merged into ` main ` to production
2732- NGINX is the production server responsible for serving the Vite React app.
2833
34+ ![ react app served by NGINX in a Docker container] ( https://i.ibb.co/RkntmDNp/Screenshot-2025-09-17-at-20-25-01.png )
35+
2936## Tools of The Trade
3037
31- - Docker
32- - Docker Compose
38+ Docker was used in production to build the container in AWS ElasticBeanstalk,
39+ while Docker Compose was used locally during development along with Docker
40+ volumes to synchronise changed files and .
41+
3342- AI-generated tests
3443- Default SPA React app generated by Vite
35- - [ NGINX] [ https://hub.docker.com/_/nginx ] Docker image
44+ - [ NGINX] ( https://hub.docker.com/_/nginx ) Docker image
0 commit comments