coastal_timesheet/DOCKER.md

Docker Deployment Guide

Production Deployment

Quick Start

# Build and run the production container
docker-compose up -d

# Access the app at http://localhost:8080

Manual Build

# Build the Docker image
docker build -t coastal-timesheet .

# Run the container
docker run -d -p 8080:80 --name coastal-timesheet coastal-timesheet

Development with Docker

Development Server

# Run development environment
docker-compose -f docker-compose.dev.yml up

# Access the app at http://localhost:5173

Docker Commands

Production

# Start services
docker-compose up -d

# Stop services  
docker-compose down

# View logs
docker-compose logs -f

# Rebuild after changes
docker-compose up -d --build

Development

# Start dev environment
docker-compose -f docker-compose.dev.yml up

# Stop dev environment
docker-compose -f docker-compose.dev.yml down

# Rebuild dev container
docker-compose -f docker-compose.dev.yml up --build

Configuration

Environment Variables

• NODE_ENV: Set to "production" for production builds
• Port mapping can be changed in docker-compose.yml

Nginx Configuration

The production container uses nginx to serve static files with:

• Gzip compression enabled
• Client-side routing support (SPA)
• Static asset caching
• Security headers

Ports

• Production: http://localhost:8080
• Development: http://localhost:5173

Architecture

The production setup uses a multi-stage build:

1. Build stage: Compiles the React app using Node.js
2. Production stage: Serves static files using nginx

This results in a lightweight production image (~25MB) that only contains the compiled app and nginx.