How to Install Jekyll Static Website Generator on Ubuntu 20.04

This note refers from this Youtube tutorial. Some details are a little bit different and I hope this can help you build up and debug your website or blog on your local server(You can also use Git to push your updated file to Github, but this would take a few minutes to see the actual update on your online web):

1. Open a terminal(ignore the conda environment you already installed, just use the default environment)

   

2. sudo apt install make build-essential curl git tree -y
   

   

3. sudo apt install ruby ruby-dev -y
   

   

4. gedit ~/.bashrc
   

   Then you will open a file named .bashrc, go to the bottom of the file and then add these two lines on that:

   export GEM_HOME=$HOME/gems 
   

   export PATH=$HOME/gems/bin:$PATH
   

   

   Then source your .bashrc file:

   source ~/.bashrc
   

5. gem install jekyll bundler
   

   

   PS: if you met the problem for installation about the version, try this command:

   gem install sass-embedded -v 1.54
   

6. Then, install jerkII through

   sudo apt install jekyll
   

   Update on Oct 21,2024: I found this step always has problem that may cause so many errors. If you met the similar error like

   Traceback (most recent call last):
       12: from /usr/local/bin/jekyll:23:in `<main>'
       11: from /usr/local/bin/jekyll:23:in `load'
       10: from /var/lib/gems/2.5.0/gems/jekyll-4.2.0/exe/jekyll:8:in `<top (required)>'
        9: from /var/lib/gems/2.5.0/gems/jekyll-4.2.0/exe/jekyll:8:in `require'
        8: from /var/lib/gems/2.5.0/gems/jekyll-4.2.0/lib/jekyll.rb:191:in `<top (required)>'
        7: from /var/lib/gems/2.5.0/gems/jekyll-4.2.0/lib/jekyll.rb:12:in `require_all'
        6: from /var/lib/gems/2.5.0/gems/jekyll-4.2.0/lib/jekyll.rb:12:in `each'
        5: from /var/lib/gems/2.5.0/gems/jekyll-4.2.0/lib/jekyll.rb:13:in `block in require_all'
        4: from /var/lib/gems/2.5.0/gems/jekyll-4.2.0/lib/jekyll.rb:13:in `require'
        3: from /var/lib/gems/2.5.0/gems/jekyll-4.2.0/lib/jekyll/drops/collection_drop.rb:3:in `<top (required)>'
        2: from /var/lib/gems/2.5.0/gems/jekyll-4.2.0/lib/jekyll/drops/collection_drop.rb:4:in `<module:Jekyll>'
        1: from /var/lib/gems/2.5.0/gems/jekyll-4.2.0/lib/jekyll/drops/collection_drop.rb:5:in `<module:Drops>'
   /var/lib/gems/2.5.0/gems/jekyll-4.2.0/lib/jekyll/drops/collection_drop.rb:10:in `<class:CollectionDrop>': undefined method `delegate_method_as' for Jekyll::Drops::CollectionDrop:Class (NoMethodError)
   Did you mean?  DelegateClass
   

   Please use the following commands to deal with it:

   PACKAGES="$(dpkg -l |grep jekyll|cut -d" " -f3|xargs )"
   

   sudo apt remove --purge $PACKAGES 
   

   sudo apt autoremove
   

   sudo gem install jekyll jekyll-feed jekyll-gist jekyll-paginate jekyll-sass-converter jekyll-coffeescript
   

   Well, after you run above step, you may also see some problem, but, ignore them and they would not effect your final usage.

   gem install jekyll -v 3.0.0
   

7. Then, you can download the example web project from their official website to test whether your installation is successful.

   jekyll new jekyll.example.com
   

   

8. Then go to the web directory

   cd jekyll.example.com 
   

   and use

   tree 
   

   to see the website project structure.

   

9. Run

   bundle add webrick
   

   to install webrick.

   

10. Finally, you can run the example web project on your local server by running jekyll serve --host=0.0.0.0

    (Note: you may occur this problem as the picture shown below:

    

No worry about that~ Just close the terminal and then open a new terminal again in your project location to run the same command, then you will see:

The website can been seen on your default browser as shown below:

———————–UPDATE———————————-

Sometimes when you may meet the problem like that:

No worry about that, you can just change the input command like this:

bundle exec jekyll serve --host 0.0.0.0

Then the problem will be dealt with.