under construction

Build a website with Jekyll and publish it

With the Jekyll framework (or static website generator), you can create a proper website in a short amount of time and with little technical knowledge.

Websites made with Jekyll are simple, easy to maintain and versatile, since they are only static. Meaning it basically is just a bunch of files, without any database like for instance Wordpress needs. What’s also nice is the fact that you can publish your website online for free on a lot of places, like Github Pages, Netlify or Digital Ocean.

1 Get started with your project

In order to build a Jekyll website you’ll have to set up a couple of requirements on your own machine.

  • A Github account. Sign-up for an account here.
  • Git installed locally.
  • Ruby, which comes installed on MacOS and most of Linux by default.

Configuring Git

Start the terminal so we can connect your Github account with git. First, set the your username and emailadres.

git config --global user.name "your github username"
git config --global user.email "your email adress"

You can list the configuration to check if user.name and user.email are correct.

git config --list

1.2 Set-up Ruby

Jekyll is build with Ruby, so you’ll have to have it installed locally for your operating system. You can check if that is the case by checking it’s version.

ruby -v

Use the official installation instructions. Ruby uses RubyGems for package management. Jekyll is such a package or Gem.

2 Start a Jekyll project

3 Customized your website

4 Publish your website

Jekyll can be hosted for free on a lot of places, like Github Pages or on the free tier at Digital Ocean, called App Platform.

4.1 Publish via Github Pages

You can follow along with the instructions, or go see the official Github Docs for setting this up.

Turn on Pages

In order to publish your website on Github Pages, go to the page of your repository and navigate to Settings and then Pages.

Create a new branch

####

4.2 Publish via Digital Ocean

4.3 Get a proper domain

5 What’s next