Build a static site with Jekyll and Docker Multistage Builds

You know what’s cool? Static sites. So lets build on with docker and multistage builds :)

Set up a static site

First lets install Jekyll:

gem install jekyll

Then let’s create our site:

jekyll init site

And CD into the site:

cd site

Add a dockerfile

Add the following Dockerfile:

FROM ruby:2.3-alpine AS jekyll-builder
WORKDIR /app
ENV RAILS_ENV production

RUN apk update && apk --update add ruby ruby-irb nodejs ruby-json ruby-rake \
   ruby-bigdecimal ruby-io-console libstdc++ tzdata  \
   libffi-dev libxml2-dev libxslt-dev

# Necessary for some gems which are compiled on bundle install

RUN apk add --virtual build-deps git build-base ruby-dev \
   libc-dev linux-headers && \
   gem install bundler --no-ri --no-rdoc && \
   bundle config build.nokogiri --use-system-libraries

COPY Gemfile* /app/
RUN bundle install --clean --without development test
COPY . /app
RUN bundle exec jekyll build -d ./build --verbose

# Copy to our nginx

FROM nginx:alpine
COPY --from=jekyll-builder /app/build /usr/share/nginx/html

Build it

And then finally build your site:

docker build -t site .

Run it

docker run -p 9090:80 site

Visit it

And then visit your site

open http://localhost:9090