How to install Nginx on Alpine using Docker?

Question

I've set up Nginx on a node:20-alpine image and I get no errors, but the server isn't listening on the port specified. When I enter localhost:80 I get a This site can't be reached error.

I have:

FROM node:20-alpine AS react-build

ARG PORT=80

WORKDIR /app

COPY . .

RUN npm install --omit=dev
RUN npm run build

FROM node:20-alpine AS react

WORKDIR /www

RUN apk update
RUN apk add nginx
RUN adduser -D -g 'www' www
RUN chown -R www:www /var/lib/nginx
RUN chown -R www:www /www

COPY --from=react-build /app/lib .
COPY nginx.conf /etc/nginx/nginx.conf

EXPOSE $PORT

CMD ["nginx", "-g", "daemon off;"]

And:

user www;
worker_processes auto;
error_log error.log warn;

events {
  worker_connections 1024;
}

http {
  include /etc/nginx/mime.types;
  default_type application/octet-stream;
  sendfile on;
  keepalive_timeout 2000;
  access_log access.log;

  server {
    listen 80;
    root /www;
    index index.html;
    server_name localhost;
    client_max_body_size 32m;
    error_page 500 502 503 504;

    location / {
      try_files $uri /index.html;
    }
  }
}

After which I run docker builder build . -t react && docker run react.

The result is that everything builds correct, it seems the server is listening and running, no errors, but when I try access it in browser it says the site can't be reached.

What am I doing wrong or what can I try to debug it further?

Answer 1

You have to map the port form the host to the container.

Just run docker builder build . -t react && docker run -p "8080:80" react; by doing so you bind the port 80 of your container to the port 8080 on your local machine.

If you want a docker compose file you can do something like this:

version: '3.9'

services: 
  app:
    build:
      context: .
      dockerfile: Dockerfile
    ports: 
      - "8080:80"

and then just run docker-compose up --build -d