Use Dockup to test out your Jekyll blog

See how your Jekyll blog articles look like before you publish them.

Want to see how your blog will turn out before you publish? Just open a PR on your repo and Dockup will spin up a live blog for you!

Assuming that you have a Jekyll blog in place, let's see how we can dockerise it and create a Dockup Blueprint. We are actually using the theme from Jekyll. You can clone/fork from here.

Once we have the source, let's add a couple of files to the root of our project. We will build the Jekyll source and then serve those files with Nginx.

Dockerise your blog

Dockerfile
nginx.conf
# ============================================================
# Build you je kyll blog
# ============================================================
FROM jekyll/jekyll:stable AS build
RUN mkdir /jekyll-minima
WORKDIR /jekyll-minima
# copy the blog source
COPY . .
# permission for bundle to write gemfile.lock
RUN chmod 777 ./
# Install dependencies
RUN bundle install
# Build
RUN bundle exec jekyll build
# ============================================================
# Serve the build files with NGINX
# ============================================================
FROM nginx as nginx
COPY nginx.conf /etc/nginx/conf.d/default.conf
# Copy build files of the blog
COPY --from=build /jekyll-minima/_site /usr/share/nginx/html
EXPOSE 80

Create Blueprint

Now that we have a Dockerfile added to the source, let's create a Dockup Blueprint.

Make sure you have configured you GitHub account with Dockup. If you haven't done it yet, you can head over to Dockup Settings

Container for jekyll

And that's all! Wasn't that easy?

Now you can test out your articles against PRs, or you can even apply the same steps in configuring a new theme development altogether!

Deploy!

Deployed successfully

One another thing to note here is that, you can apply this very same steps to even test other static website generator tools, say for e.g. Hugo.