Hacker Stories

Search through Hacker News articles and discussions. Find tech news, discussions, and insights.

Docker Setup Instructions

Prerequisites

• Docker installed on your system
• Docker Compose (optional, for easier management)

Building and Running the Container

Method 1: Using Docker Commands

1. Build the Docker image:

   docker build -t my-react-app .

2. Run the container:

   docker run -d -p 3000:80 --name my-react-app-container my-react-app

3. Access your application: Open your browser and go to http://localhost:3000

Development vs Production

Development Setup

For development with hot reload, you might want to use a different approach:

# Development Dockerfile (Dockerfile.dev)
FROM node:18-alpine

WORKDIR /app

COPY package*.json ./
RUN npm install

COPY . .

EXPOSE 5173

CMD ["npm", "run", "dev", "--", "--host"]

Run development container:

docker build -f Dockerfile.dev -t my-react-app-dev .
docker run -p 5173:5173 -v $(pwd):/app -v /app/node_modules my-react-app-dev

Production Optimization

For production, you can add an nginx configuration file:

nginx.conf:

server {
    listen 80;
    server_name localhost;
    root /usr/share/nginx/html;
    index index.html;

    # Handle client-side routing
    location / {
        try_files $uri $uri/ /index.html;
    }

    # Cache static assets
    location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg)$ {
        expires 1y;
        add_header Cache-Control "public, immutable";
    }
}

Uncomment the nginx configuration line in the Dockerfile to use it.

Troubleshooting

1. Port already in use: Change the port mapping -p 3001:80
2. Build fails: Check if all dependencies are in package.json
3. Container doesn't start: Check logs with docker logs container-name
4. Permission issues: Make sure Docker has proper permissions