Tutorial - Build Gatsby with Docker

May 02, 2021

Building static pages with Gatsby is pretty easy, especially if you use one of the many templates provided under https://www.gatsbyjs.com/starters/.
But when it comes to building and deploying it with Docker I could not find any ressources on the web. So I created a Dockerfile myself. That’s the result.

################################################################
#     BUILD
################################################################

FROM node:14.15.1 as build
WORKDIR /app
COPY . .
RUN npm ci
RUN npm run build


################################################################
#     DEPLOY
################################################################

FROM nginx:1.19.2-alpine as deploy

RUN apk --no-cache add bash=~5.0

COPY nginx.conf /etc/nginx/nginx.conf

WORKDIR /usr/share/nginx
COPY --from=build /app/public ./html

I use Gitlab-CI to build this docker-image and push it then to the Gitlab Container-Registry. Afterwards I pull the image from the registry to my server and execute it right there.

used nginx.conf

worker_processes  1;

events {
    worker_connections  1024;
}

http {
    server {
        listen 80;
        server_name  localhost;

        root   /usr/share/nginx/html;
        index  index.html index.htm;
        include /etc/nginx/mime.types;

        gzip on;
        gzip_min_length 1000;
        gzip_proxied expired no-cache no-store private auth;
        gzip_types text/plain text/css application/json application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript;

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