Trying out Atom editor

I work daily with an editors and I've already shared with you guys my love for Sublime Text. This doesn't mean I do not try and get interested in other editors. I actually follow and contribute (ok - only once so far) to the Brackets editor which I found very interesting but at the end not entirely covering my use cases/workflow.

Recently Github released their own editor - Atom. I wanted to test it out, but at the moment there are only Mac builds.


Option 1: Install from PPA

sudo add-apt-repository ppa:webupd8team/atom
sudo apt-get update
sudo apt-get install atom

Option 2: Build latest version of Atom

These are the requirements to be able to build:

  • OS with 64-bit architecture
  • node.js v0.10.x
  • npm v1.4.x
  • libgnome-keyring-dev sudo apt-get install libgnome-keyring-dev
  • sudo npm config set python /usr/bin/python2 -g to ensure that gyp uses Python 2

And to build this is these would be the commands to type:

git clone
  cd atom
  script/build # Creates application at /tmp/atom-build/Atom
  sudo script/grunt install # Installs command to /usr/local/bin/atom
  script/grunt mkdeb # Generates a .deb package at /tmp/atom-build

Playing around

Now it's time to play around - create own package / find a bug to dig a bit into the code and or contribute in the Atom community guide, Splitting Atoms.

Adding Disqus comments to a Jekyll blog

Because Jekyll only serves static html pages, I need to use another component/system, that will handle and store the comments for me. Disqus is one of the different solutions out there and is definitely the one that handles the most traffic in the web (interesting read How Disqus Went Realtime With 165K Messages Per Second And Less Than .2 Seconds Latency).

How to setup Disqus in your Jekyll blog

Step1: Sign up for an account

Head to Disqus and sign up for an account. They have a really simple sign up process that gets you started in less than 2min.

Step2: Get the code!

After setting up your site, Disqus will propose install instruction for several blog tools. In our case, you should use "Universal Code".

Get the code and put save it in _include/comments.html

<div id="disqus_thread"></div>
<script type="text/javascript">
    var disqus_shortname = 'YOUR_SHORTNAME'; // required: replace example with your forum shortname

    /* * * DON'T EDIT BELOW THIS LINE * * */
    (function() {
        var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
        dsq.src = '//' + disqus_shortname + '';
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
<noscript>Please enable JavaScript to view the <a href="">comments powered by Disqus.</a></noscript>
<a href="" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>

Modify your layouts/post.html and add {% include comments.html %} wherever you want to include the comments (usually... at the bottom!)

And that would be it! Simple!

My Sublime Setup

I use Sublime Text 3 in a daily basis, and I've grown used to certain plugins/setup that make it much more productive for me.

Getting it (Ubuntu)

Option 1: use 3rd party PPA repository:

$ sudo add-apt-repository ppa:webupd8team/sublime-text-3
$ sudo apt-get update
$ sudo apt-get install sublime-text-installer

Option 2: install from source

$ wget
$ sudo dpkg -i sublime-text_build-3059_amd64.deb

Customize Sublime Text

Change fonts

Install and use custom font - I use Adobe Source Code Pro font: Download the font:

$ wget wget

Unzip the zip you just downloaded:

$ unzip

Create a directory in your home directory called ".fonts"

$ mkdir -p ~/.fonts

Move the Open Type fonts (*.otf) to the newly created .fonts directory.

$ cp SourceCodePro_FontsOnly-1.017/OTF/*.otf ~/.fonts/

Rebuild font cache

$ fc-cache -f -v

If you want to install system wide instead of per user, copy the files to /usr/local/share/fonts/ instead of ~/.fonts/.

Go to Sublime Text -> Preferences -> Settings - User and insert:

    "font_face": "Source Code Pro",
    "font_size": 10,


Sublime community is really active and there are really great extensions out there. Here are the ones that I consider essential:

  • Package Control: lets you install, remove and manage your plugins directly from the editor. After installation, just press shift + cmd + P, type install and ENTER
  • Bracket Highlighter: Highlight the brackets, quotes and html tags. Simple - awesome.
  • Dayle Rees Colour Schemes: eye candy themes for Sublime Text 3

Building this blog!

As mentioned previously, I wanted to write a post on how this blog has been built. This website does not contain any interactive content: everything is static and fast - extremely fast. This is to focus on content rather than getting distracted by fancy visual effects.

This blog is built from scratch using Jekyll. As described in their website:

Jekyll is a simple, blog-aware, static site generator. It takes a template directory containing raw text files in various formats, runs it through Markdown (or Textile) and Liquid converters, and spits out a complete, ready-to-publish static website suitable for serving with your favorite web server.

Jekyll does not use any database or web-server: it can be served directly from Dropbox, Github or Amazon S3, so it can rely on the power and speed they offer. In fact, this website relies in many of Amazon Web Services: Amazon S3 (for storing the contents), Route 53 (as the DNS) and Amazon CloudFront (as the CDN).

On the html/css side, the blog uses Normalize and is responsive: you should have a good experience in all of your devices.


Create a static website that will be accessible both through the APEX domain (without the www - and through the www domain ( This post will only focus on the hosting part and not the creation of the site on it-self (there will be another post dedicate to that).

Creating the S3 bucket

The first thing you need to do is create the S3 bucket that will contain the site's files. I recommend you name your bucket according to your website name and domain (if you own the domain, you should name the bucket, although it's not really required when using CloudFront since all requests will be directed to your CloudFront distribution.

Bucket creation

You can now upload your static website (through the console or using other tools, such as s3_website)

Setting up the bucket policy

Additional steps are required to make the site you uploaded to S3 accessible.

  1. Select your bucket
  2. Click on "Permissions", then "Add bucket policy"
  3. Copy-past the following lines (remember to change the bucket name to your bucket namer in the Resource key):
    "Version": "2008-10-17",
    "Statement": [
            "Sid": "Allow Public Access to All Objects",
            "Effect": "Allow",
            "Principal": {
                "AWS": "*"
            "Action": "s3:GetObject",
            "Resource": "*"

Set the bucket to accept a static website

  1. Select your bucket
  2. Click on "Static Website Hosting", then "Enable website hosting"
  3. Check that you corrently set-up the "Index Document" and "Error Document"
  4. Note down the "Endpoint" for later - you could use that to access your website directly

Creating CloudFront distribution

From the previous steps, the site was only available in eu-west-1 (Dublin - Ireland). CloudFront will help us distribute that in the other regions. To do so, follow these steps:

  1. Open the CloudFront tab and click on "Create Distribution"
  2. Select "Web"
  3. Fill-up the settings as follow: 3.1. "Origin Domain Name" -> provide the endpoint you note down previously 3.2. "Default Cache Behavior Settings" -> leave defaults 3.3. In “Distribution Settings” 3.3.1. Complete “Alternate Domain Names (CNAMEs)” (such as and 3.3.2. “Default root object”, write “index.html”. This will indicate CloudFront which file it should retrieve when accessing your distribution directly
  4. Click on "Create Distribuion!"

Setting up Route53

  1. Open the Route53 tab and click on "Create Hosted Zone"
  2. In "Domain Name", input your naked domain (eg: Click "Create"
  3. Select your newly created naked domain and click on "Go to record sets"
  4. Copy the NS entries that were automatically generated for you by Route53 and provide them to your domain provider

Optional (if you want your website to be accessible from bot www and the naked domain):

  1. Click on “Create Record Set”.
  2. In the “Name”, enters nothing, and make sure “Type” is to “A - IPv4 address”.
  3. Click on “Yes” for Alias, and set the CloudFront distribution as “Alias target” (it should be automatically auto-completed for you).
  4. Leave the Routing Policy to “Simple”, and validate the record set.
  5. Go back to 1, but this name enters “www” for name.

Adding RSS to Jekyll blog

One of the caveats of using "vanilla" Jekyll (vs using other tools that are built on top of Jekyll such as Octopress or JekyllBootstrap) is that there is some plumbing to do to add things that are "expected" on a blog engine, such as an RSS feed. An RSS feed comes handy for people that want to follow your site and consolidate everything into an RSS reader (such as feedly).

Adding an RSS feed is as simple as to generate an XML file that contains a lists of your posts. You could generate that by hand or use one of the available templates online. I opted for the last option (why re-invent the wheel?) and used the templates from snaptortoise's jekyll-rss-feeds. Download a template from there (I used feed.xml) and put it wherever you want in your site (/feed.xml for example). You also need to add some configuration variables in your _config.yml:

name: Sebastian's Blog
description: Sebastian occasionally writes about things.

If you want (you should!) make it possible for browser and other software automatically find your RSS feed you should add a meta tag inside your page's header (as described by the RSS advisory board). Here is what I put in my default.html file:

<link rel="alternate" type="application/rss+xml" title="" href="">

And that should be it!

First post!

Hello all! This is my second blogging attempt. One of the reasons (among others) I stopped blogging back then was the pain associated to maintaining a server and the services where the blog was running on (LAMP + Wordpress).

The web has been in a revolution lately, and new technologies have been swarming and being developed. HTML5, css, Javascript, have evolved to highs no-one could have imagined few years ago. A lot of new concepts, frameworks and tools have emerged and have reached a maturity level where they are starting to challenge other more traditional stacks and languages. I feel very disconnected from that world and this second blogging attempts comes as a project to get experience with these new stacks. My post will mostly be related to coding and tech-related topics - my areas of interest.

As mentioned before, maintaining a server and the associated services is painful and time consuming. I decided to explore other options and at the end I decided to go a bit the "un-orthodox" way: this blog is entirely hosted in Amazon S3 and generated with jekyll. I will write a post on it at a later date, but I'm really impressed by the setup and how robust and reliable the setup is. No more server administration, no more expensive web-hosting. I will definitely write a post on the "how to" so that other people learn how to do it!