Setting Up Jekyll Site Locally

Introduction

Two years ago, I firstly learned Git, GitHub and built my first Jekyll site hosted on GitHub on Windows. However, because Jekyll does not support Windows without using a virtual machine, I had to upload new materials of my sites to GitHub and watch if the formatting and content were shown correctly on the site every time I wanted to update my site.

Since 2017, I have switched my working environment almost exclusively to Ubuntu, but I still have not got Jekyll installed on my computer and tested my site locally, which is pretty bad for a person who studies computer science. Today, somehow I get a chance to get Jekyll installed and successfully hosted my site locally, which I should have done two years ago. Here I documented the process and caveats for my future references.

Jekyll Installation

To properly install Jekyll, the following software and packages are necessary.

$ sudo apt-get update
$ sudo apt-get install ruby ruby-dev make gcc build-essential nodejs
$ sudo gem install jekyll bundler

Go to the directory of your website containing the Gemfile file.

$ bundle install

If some errors happen, try this before running the above command:

$ sudo gem update --system

Host Jekyll Site Locally

Go to the directory of the Jekyll site.

In _config.yml, leave url blank.

# url:  # Host Jekyll site on GitHub
url: # Leave blank. Host Jekyll site locally on http://127.0.0.1:4000/ by default.

Start Jekyll server:

$ bundle exec jekyll serve

The following message will show if the server started successfully.

Configuration file: /home/marine/Workspace/leimao.github.io/_config.yml
            Source: /home/marine/Workspace/leimao.github.io
       Destination: /home/marine/Workspace/leimao.github.io/_site
      Generating... 
                    done.
 Auto-regeneration: enabled for '/home/marine/Workspace/leimao.github.io'
Configuration file: /home/marine/Workspace/leimao.github.io/_config.yml
    Server address: http://127.0.0.1:4000/
  Server running... press ctrl-c to stop.

Now go to http://127.0.0.1:4000/ in a web browser to view the site.

Changing the localhost url is feasible. But I am not going to learn how to do it for now.

Inconsistencies

So far, everything looks OK except that the coding block does not show properly in the localhost. Someone has also reflected similar problems on GitHub. But I have not found a solution to solve this problem.

Issues

Since Ruby has been upgraded to 2.7, there might be a lot of deprecations warnings due to that Jekyll was not compatible with Ruby 2.7. Please upgrade Jekyll accordingly.

$ sudo bundle update jekyll

Ubuntu RubyGem 3.1.4 has a bug.

$ sudo gem update --system
Updating rubygems-update
Successfully installed rubygems-update-3.1.4
Parsing documentation for rubygems-update-3.1.4
Done installing documentation for rubygems-update after 0 seconds
Parsing documentation for rubygems-update-3.1.4
Done installing documentation for rubygems-update after 0 seconds
Installing RubyGems 3.1.4
Traceback (most recent call last):
	5: from setup.rb:28:in `<main>'
	4: from setup.rb:28:in `require'
	3: from /var/lib/gems/2.7.0/gems/rubygems-update-3.1.4/lib/rubygems.rb:1424:in `<top (required)>'
	2: from /var/lib/gems/2.7.0/gems/rubygems-update-3.1.4/lib/rubygems.rb:1424:in `require'
	1: from /usr/lib/ruby/vendor_ruby/rubygems/defaults/operating_system.rb:49:in `<top (required)>'
/usr/lib/ruby/vendor_ruby/rubygems/defaults/operating_system.rb:50:in `<class:Specification>': undefined method `rubyforge_project=' for class `Gem::Specification' (NameError)

Currently, we could use RubyGem 3.1.3 instead to get around.

$ sudo gem update --system 3.1.3

Connection Reset Errors

When I start the sever locally and I connect the server from my browser, I always see this connection reset error message. Although it seems that it is not affecting the website at all, but it is annoying.

$ bundle exec jekyll serve
Configuration file: /home/leimao/GitHub/leimao.github.io/_config.yml
            Source: /home/leimao/GitHub/leimao.github.io
       Destination: /home/leimao/GitHub/leimao.github.io/_site
 Incremental build: disabled. Enable with --incremental
      Generating... 
                    done in 2.104 seconds.
 Auto-regeneration: enabled for '/home/leimao/GitHub/leimao.github.io'
    Server address: http://127.0.0.1:4000
  Server running... press ctrl-c to stop.
[2020-12-31 11:35:35] ERROR Errno::ECONNRESET: Connection reset by peer @ io_fillbuf - fd:18 
	/usr/lib/ruby/2.7.0/webrick/httpserver.rb:82:in `eof?'
	/usr/lib/ruby/2.7.0/webrick/httpserver.rb:82:in `run'
	/usr/lib/ruby/2.7.0/webrick/server.rb:307:in `block in start_thread'
[2020-12-31 11:35:35] ERROR Errno::ECONNRESET: Connection reset by peer @ io_fillbuf - fd:17 
	/usr/lib/ruby/2.7.0/webrick/httpserver.rb:82:in `eof?'
	/usr/lib/ruby/2.7.0/webrick/httpserver.rb:82:in `run'
	/usr/lib/ruby/2.7.0/webrick/server.rb:307:in `block in start_thread'
[2020-12-31 11:35:35] ERROR Errno::ECONNRESET: Connection reset by peer @ io_fillbuf - fd:18 
	/usr/lib/ruby/2.7.0/webrick/httpserver.rb:82:in `eof?'
	/usr/lib/ruby/2.7.0/webrick/httpserver.rb:82:in `run'
	/usr/lib/ruby/2.7.0/webrick/server.rb:307:in `block in start_thread'

Later I found that if I enter http://localhost:4000 in the browser there will be no such error message. However, if I enter http://127.0.0.1:4000 in the browser the error happens. In addition, this error only happens in Chrome and Chromium, but not Firefox.

This error has bothered me for many years and I still have not come up with a good solution.

References

• Jekyll Upgrading