---
layout: post
author: Aaron
title: 2022 Week 38 How to create a static website with Jekyll and deploy it on GitHubPages
---
Prerequisits
Install
Git
Install
Ruby
Install Jekyll and Bundler
$ gem install jekyll bundler
Local Repository
Clone the repository to a local directory:
SSH
$ git clone --recursive SSH_URL
HTTPS
$ git -c http.sslVerify=false clone --recursive HTTPS_URL
Directories
Create two directories: docs and localDev.
$ mkdir docs
$ mkdir localDev
docs will contain the content of the website later on.
localDev will contain our Jekyll project.
Create Jekyll Project
Move to the localDev-directory:
$ cd localDev
Create a new Jekyll-project at localDev-directory:
$ jekyll new --skip-bundle .
(make sure you got the dot)
Open the Gemfile that Jekyll created and comment out the line which starts with
gem "jekyll"
Add the github-pages gem by editing the line starting with # gem "github-pages".
Change this line (# gem "github-pages") to:
gem "github-pages", "~> GITHUB-PAGES-VERSION", group: :jekyll_plugins
You can find the actual version of GitHub-pages
here.
Now save and close the Gemfile.
Now still being at the localDev-directory, install the bundle:
$ bundle install
Optionally you can make changes at the
_config.yml file.
Learn Jekyll
Follow
this guide to learn Jekyll. Make sure that all files and directories you create are in the localDev-directory.
Note that building locally will not work according to commenting out gem "Jekyll" at the Gemfile. (Atm I didn't check if this is right)
Build Project
After creating all necessary files and dirs, you can make a production build:
Note that all files at _site will be cleared!
$ JEKYLL_ENV=production bundle exec jekyll build
Your Jekyll-project was now build and stored at _site.
Now move the content of the localDev/_site to docs:
$ mv /localDev/_site docs
And push your changes to your central GitHub-Repository.
Publish Website
Now
publish your repository on GitHub Pages.
Select your
branch and as
folder /docs and hit Save.
Now you have to wait, this can take up to 10 minutes.
On the top of the page a box will appear with the url of your website.
Happy developing!