Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to Set Up and Configure Jekyll Development Site on Ubuntu 16.04
In this article, we will learn how to setup and configure Jekyll Development Site. Jekyll provides the benefits of the Content Management System (CMS) with performance and security which appears in the database-driven sites. It is also called as blog-aware which has features of handling the date-organized contents. It is especially suitable for the people who work off-line, which also provides the lightweight editor with content management which has the version control for tracking the changes made on their websites.
Prerequisites
- A machine with Ubuntu 16.04 installed.
- A user with Sudo permissions on the machine.
Installing the Jekyll Development Site on Ubuntu 16.04
Before we start the actual installation, we will first update the system with the below command.
$ sudo apt-get update Output: Hit:1 http://in.archive.ubuntu.com/ubuntu xenial InRelease Get:2 http://in.archive.ubuntu.com/ubuntu xenial-updates InRelease [95.7 kB] Hit:3 http://security.ubuntu.com/ubuntu xenial-security InRelease Hit:4 http://in.archive.ubuntu.com/ubuntu xenial-backports InRelease Fetched 95.7 kB in 1s (58.1 kB/s) Reading package lists... Done
Once the update is done, we will install the dependencies required for the Jekyll, as we needed Ruby and the development libraries like Make and GCC to compile and install the Jekyll.
$ sudo apt-get install ruby ruby-dev make gcc
Output:
Reading package lists... Done Building dependency tree Reading state information... Done … … Setting up libgmp-dev:amd64 (2:6.1.0+dfsg-2) ... Setting up libjs-jquery (1.11.3+dfsg-4) ... Setting up make (4.1-6) ... Setting up manpages-dev (4.04-2) ... Setting up rubygems-integration (1.10) ... Setting up ruby-dev:amd64 (1:2.3.0+1) ... Setting up ruby (1:2.3.0+1) ... Setting up rake (10.5.0-2) ... Processing triggers for libc-bin (2.23-0ubuntu3) ...
Once the installation is completed, we can install Ruby’s gem package along with Jekyll as a bundle.
Below is the command to install the Jekyll Development server using the gem installer.
$ sudo gem install jekyll bundler Fetching: liquid-3.0.6.gem (100%) Successfully installed liquid-3.0.6 Fetching: kramdown-1.12.0.gem (100%) Successfully installed kramdown-1.12.0 Fetching: mercenary-0.3.6.gem (100%) Successfully installed mercenary-0.3.6 .. .. .. Installing ri documentation for rb-inotify-0.9.7 Parsing documentation for listen-3.0.8 Installing ri documentation for listen-3.0.8 Parsing documentation for jekyll-watch-1.5.0 Fetching: bundler-1.13.6.gem (100%) Successfully installed bundler-1.13.6 Parsing documentation for bundler-1.13.6 Installing ri documentation for bundler-1.13.6 Done installing documentation for bundler after 5 seconds 19 gems installed
Configuring the Firewall to Allow Jekyll
First, we will check the status of the Firewall so that the site is permitted for the development sire on the web browser. Below is the command to check the status of the Firewall –
$ sudo ufw status Output: Status: active To Action From -- ------ ---- 22 ALLOW Anywhere 80 ALLOW Anywhere 22 (v6) ALLOW Anywhere (v6) 80 (v6) ALLOW Anywhere (v6)
As we can see that, only SSH and WWW services have enabled means port 22 and port 80 are allowed, we need to open port 4000 for the Jekyll which is a default port for the Jekyll development server.
Below is the command to enable 4000 port on the firewall –
$ sudo ufw allow 4000 Output: Rule added Rule added (v6)
Now, we will check the Firewall status for cross checking the port 4000 if it is enabled or not.
$ sudo ufw status Output: Status: active To Action From -- ------ ---- 22 ALLOW Anywhere 80 ALLOW Anywhere 4000 ALLOW Anywhere 22 (v6) ALLOW Anywhere (v6) 80 (v6) ALLOW Anywhere (v6) 4000 (v6) ALLOW Anywhere (v6)
As the necessary ports are open for the development, we will create the development sites.
Creating a Demo Development Site
In our home directory, we will create a scaffolding for the demo site in a folder called www.
$ cd ~ $ jekyll new www OutPut: New jekyll site installed in /home/ubuntu/www. Running bundle install in /home/ubuntu/www... Fetching gem metadata from https://rubygems.org/........... Fetching version metadata from https://rubygems.org/.. Fetching dependency metadata from https://rubygems.org/. Resolving dependencies... Using public_suffix 2.0.4 Using colorator 1.1.0 Using ffi 1.9.14 Using forwardable-extended 2.6.0 Using sass 3.4.22 Using rb-fsevent 0.9.8 Using kramdown 1.12.0 Using liquid 3.0.6 Using mercenary 0.3.6 Using rouge 1.11.1 Using safe_yaml 1.0.4 Installing minima 2.0.0 Using bundler 1.13.6 Using addressable 2.5.0 Using rb-inotify 0.9.7 Using pathutil 0.14.0 Using jekyll-sass-converter 1.5.0 Using listen 3.0.8 Using jekyll-watch 1.5.0 Using jekyll 3.3.1 Installing jekyll-feed 0.8.0 Bundle complete! 3 Gemfile dependencies, 21 gems now installed. Use `bundle show [gemname]` to see where a bundled gem is installed. Post-install message from minima: ---------------------------------------------- Thank you for installing minima 2.0! Minima 2.0 comes with a breaking change that renders '<your-site>/css/main.scss' redundant. That file is now bundled with this gem as '<minima>/assets/main.scss'. More Information: https://github.com/jekyll/minima#customization ----------------------------------------------
This will specify the default theme with its Gemfiles, we will now run the bundle for installing the themes.
$ cd www $ bundle install Output: Using public_suffix 2.0.4 Using colorator 1.1.0 Using ffi 1.9.14 Using forwardable-extended 2.6.0 … … Using jekyll-watch 1.5.0 Using jekyll 3.3.1 Using jekyll-feed 0.8.0 Bundle complete! 3 Gemfile dependencies, 21 gems now installed. Use `bundle show [gemname]` to see where a bundled gem is installed.
The tree structure of the www will look like the below –
. ├── about.md ├── _config.yml ├── Gemfile ├── Gemfile.lock ├── index.md └── _posts └── 2016-11-15-welcome-to-jekyll.markdown 1 directory, 6 files
We need to make some configuration changes in the _config.yml file before we proceed for the next steps.
$ vi ~/www/_config.yml Output: The configuration file will be looks like this title: Your awesome title email: your-email@domain.com description: > # this means to ignore newlines until "baseurl:" Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description. baseurl: "" # the subpath of your site, e.g. /blog url: "ubuntu-16" # the base hostname & protocol for your site, e.g. http://example.com twitter_username: jekyllrb github_username: jekyll # Build settings markdown: kramdown theme: minima gems: - jekyll-feed exclude: - Gemfile - Gemfile.lock
We need to find the below line and need to replace the example with your domain name for the site
url: "http://example.com" # the base hostname & protocol for your site, e.g. http://example.com
Once the configuration is completed, we now start the Jekyll’s web server.
Starting the Jekyll’s Server
We needed to start the Jekyll’s web server which will support the site development by monitoring the files in the directory which will also generate the static web-site and any time the changes are saved.
$ jekyll serve --host=192.168.2.117 Output: Configuration file: /home/ubuntu/www/_config.yml Configuration file: /home/ubuntu/www/_config.yml Source: /home/ubuntu/www Destination: /home/ubuntu/www/_site Incremental build: disabled. Enable with --incremental Generating... done in 0.372 seconds. Auto-regeneration: enabled for '/home/ubuntu/www' Configuration file: /home/ubuntu/www/_config.yml Server address: http://192.168.2.117:4000/ Server running... press ctrl-c to stop.
Once the server is running, the Web site is running and up we can access the site using the IP address or the domain name as this is demo site we will access it from the local IP address, https://192.168.2.197. In this article, we shall learn to set up and configure Jekyll and install the dependencies and configure the Jekyll to set up a demo website, we also learn how to start the Jekyll web server.
53 Views
