How to Start a Static Blog in 10 minutes with Jekyll and Terminal

Nov 13, 2014

Run your own Terminal Blog with Terminal

You probably have seen or heard of Medium.com or at least the bunch of awesome articles created by its huge community of writers.

The platform has been gaining popularity with beginning writers because of its clean design and easy to use input interface but one of the increasingly frustrating limitations is the lack of support for custom domains.

You have a really cool domain name that you don’t want to go to waste, why let Medium get all the traffic?

Terminal, with its easy to use control interface, allows you to setup a blogging platform like Medium in just over 5 minutes.

Let me show you how.

Goal

In this article, I’ll be going through the steps to create your very first Terminal from scratch to launch a self-hosted static site platform called Jekyll which you can easily manage and edit your content all from your Terminal screen.

I’ll also go through with you how to point your custom domain to your own Terminal.

Pre-requisite

You don’t need anything! Just a nice looking browser to follow the tutorial.

Ready?

Lets go.

Step 2: Start a Terminal

For this example, lets use Ubuntu 14.04 LTS. You can use any other distro that want, the concept should be easily transferrable.

Step 3: Install the Dependencies.

Once you’re in your Terminal Dashboard, lets get those dependencies installed.

Lets update your repository package (always do this on a fresh install)

root@ubuntu $ sudo apt-get update

Now, install ruby and its development headers

root@ubuntu $ apt-get install ruby ruby-dev git

Great, now lets install jekyll

root@ubuntu $ gem install jekyll --no-ri --no-rdoc

And that’s it!

Step 4: Launch

Lets grab the Medium-style Jekyll theme that the Terminal Blog is using, to kick start your site.

root@ubuntu $ cd /
root@ubuntu $ mkdir blog/
root@ubuntu $ cd blog
root@ubuntu $ git clone https://github.com/rosario/kasper.git
root@ubuntu $ cd kasper

All done?

Great! Start it!

# in your kasper directory /root/blog/kasper
root@ubuntu $ jekyll serve --watch --host 0.0.0.0
# Jekyll will open a webrick server with a default port of 4000

Now from your own browser (outside of Terminal’s internal browser), visit your terminal. If you look at your browser now, you should see a URL in your address bar like: https://davidchua5.terminal.com/#

Replace davidchua5 with the subdomain that you see and add a -4000 behind.

It will look something like https://davidchua5-4000.terminal.com

Step 5: Setup Access Control

Now, if you were to access the same URL but in a different browser or Incognito/Private Browsing mode, you should be redirected to a login page like below:

That’s not good.

So lets make sure everyone can access your site.

Refresh your page on your Incognito browser and you should be able to see it!

Step 6: Have fun!

So here’s the really fun part! One of the key benefits of Terminal is its persistence. It allows you to open up files on their browser editor while managing your shell instances.

When you pause or close your Terminal, when you restart it, you’re able to have full access and continue where you left off.

This means, you can now launch your site, edit your text like you would in a cloud-hosted platform. Except that you have full control and access over everything that goes on in it.

Lets do a quick demostration.

In your Terminal Dashboard, you should see the file manager on the left hand side of the screen. Click on the “/” at the top of the screen to get you back into the root path and try and navigate into your kasper directory. If you’re lost, the following image should be able to help you out.

Got it? Now, that you’re in /root/blog/kasper. Navigate to the \posts directory and you should see a file like 2013-11-10-welcome-to-jeky...... open it up by double clicking on it.

Now, you should see the contents appearing on the middle of your screen.

Here’s the fun part about Jekyll’s auto-generation function. Whenever you make any changes to the files that it is watching, it will automatically update and regenerate the static file so that the changes is apparent almost immediately.

Add something a new line in the content and save (tip: Ctrl-S works too).

You should see the changes like below.

Now refresh the browser link at the bottom right of the screen.

See the change?

There’s so much more you could do with Jekyll and I’d point you to check out this article by the Jekyll Bootstrap Project.

Step 7: Point your custom domain

Terminal Help

Assuming that you have a domain name that you already have access to, all you have to do is to tell Terminal that you want to use your custom domain.

In your Terminal dashboard, click on Custom Domains and insert your domain inside.

Once you’ve done that and assigned your domain name to a terminal, all you need to do is to access your domain management page and add a CNAME record to point that subdomain to Terminal.

For example, with my above example, I’ve chosen to use letsblog.2launch.us so my CNAME configuration will look something like: