Back to articles
30-Day Cloud & DevOps Challenge: Day 6 — Dockerizing My React Frontend
How-ToDevOps

30-Day Cloud & DevOps Challenge: Day 6 — Dockerizing My React Frontend

via Dev.toMichelle

Yesterday, I packaged my backend into a Docker container. Today, I did the same for my React frontend. But there's a twist, frontend containers are DIFFERENT. No Node.js running. No npm start . Just pure, static files served by nginx. And I learned why nginx is the king of web servers. First: How Frontend Docker is Different Backend Container Frontend Container Runs Node.js server Runs nginx (web server) Needs npm start Just serves static files Code changes often Build once, serve forever Port 5000 Port 80 (standard web port) ~135MB image ~23MB image Analogy: Backend = Restaurant kitchen (active cooking, handling requests) Frontend = Dining room + menu (just shows what's ready) Step 1: Building React for Production Right now, I run React with npm start (development mode). For Docker, I need a production build , optimized, minified, and ready to serve. Navigate to frontend folder cd ~/Desktop/Production-Ready-Microservices-Platform/frontend Build the production version npm run build Wha

Continue reading on Dev.to

Opens in a new tab

Read Full Article
2 views

Related Articles