You are currently viewing Jekyll on Ubuntu 24.04 with Nginx

Jekyll on Ubuntu 24.04 with Nginx

Please visit and support Jekyll!

The procedure I used installing Jekyll on Ubuntu 24.04 with Nginx.
There are several ways of doing this and this is how I did it.
See the https://jekyllrb.com/docs/installation/ubuntu/ official documentation</a> for details.


Installing Jekyll

Like always, start by updating.

sudo apt update
sudo apt upgrade

Then install the dependencies:

sudo apt install ruby-full build-essential zlib1g-dev

To add environment variables to your ~/.bashrc, run:

echo '# Install Ruby Gems to ~/gems' >> ~/.bashrc
echo 'export GEM_HOME="$HOME/gems"' >> ~/.bashrc
echo 'export PATH="$HOME/gems/bin:$PATH"' >> ~/.bashrc
source ~/.bashrc

Run the following from your home directory:

gem install jekyll bundler

That’s all for the installation part.


Setup Jekyll

To start a new Jekyll website in ./mysite run:

jekyll new mysite

mysite is just an example. It can pretty much be anything you want.

Enter the directory created:

cd mysite

To develop and see the changes in real-time, run

bundle exec jekyll serve --livereload

This will start hosting your site on http://localhost:4000.

The --livereload automatically refreshes the page on changes.
Visit the creator of this great theme to find out more https://chirpy.cotes.page/posts/write-a-new-post/.
He covers more detail in how to actually use Jekyll for your new site.

And as mentioned earlier, the official documentation is found at https://jekyllrb.com/docs/.


Install and setup Nginx to serve the generated website.

sudo apt install nginx
sudo systemctl start nginx
sudo systemctl enable nginx

Inside the directory we created the site earlier, there’s a directory called _site/.
This is where the finished site ends up after running jekyll build.
This is also from where I serve the website with Nginx.

In order to let Nginx serve the directory, the user that runs Nginx, www-data need to have access to it. username is the user that owns the directory.

sudo usermod -aG www-data _username_

Next up we want to make a config file for Nginx.
Use your favorite editor.
I’ll be using Nano.

sudo nano /etc/nginx/sites-available/jekyll.conf

Paste the following and edit the directory and domain.  

server {
        listen 80;
        server_name www.domain.com,domain.com;
        location / {
            root /home/_username_/jekyll/jekyll-chirpy/_site/;  # Directory containing static files. Yours may vary.
            index index.html index.htm;
            try_files $uri $uri/ =404;  # Serve 404 if file not found
        }
}

You probably want to use SSL for your site as well (optional but recommended).
Start by installing certbot.

sudo apt install certbot python3-certbot-nginx

Run certbot to get a certificate.  

sudo certbot --nginx --agree-tos --redirect --hsts --staple-ocsp --email you@example.com -d yourdomain.com,www.yourdomain.com

By this time your site should be up and running.

Good luck!