About TunnelsUp

Jan 1, 2010 the site was initially launched using WordPress because it was simple and fast to get started. As I started building more tools it became harder to incorporate them into the blog. I was losing control of the site! Updates began to be increasingly harder. I was concerned about security (xss, csrf, brute force dictionary attack). It was also time for a complete redesign of the site. So it was perfect timing to use Octopress.

Reasons why I think Octopress was the perfect choice:

  • I switched to using Heroku to host. I wanted to learn how to use this hosting provider. I am using a free account which means I was able to cancel my old hosting provider.
  • There is no admin access to the site. That is, there is no way for a person to login to tunnelsup.com. The comments are all handled by disqus which is handled entirely by their site and not mine. What this means is that there is virtually no foothold for someone to enter my site to deface it. This means security just got a lot tighter which makes me a lot happier especially since I’m a security engineer!
  • The migration from Wordpress to Octopress was really quite simple. I brought disqus (for the comments) and swiftype (for the search results) with me which both had no problem with the move.
  • I liked the look and feel of Octopress right out of the box. Very little customization was done to the theme.
  • It was fun learning Jekyll and Ruby.

I also wanted a redesign to make it more of a knowledgebase and less of a blog. In May 2013 I switched the site to use Octopress, which is a Ruby blogging framework that uses Jekyll. It’s a very fun blogging platform that suits me because it’s for hackers (people who like to take things apart). I like having more control over what’s going on and wanted to get better at ruby.

Here are some of the things I did to get things the way I wanted.

Most of the links worked when migrating from wordpress. They were exactly the same. Some weren’t though. I used an Alias Generator Plugin to pick up any missing pieces. For instance, my if my old site used about.html but the new one is just /about/ then in the about page I would say it can also listen for about.html. This actually generates an about.html page which has a redirect to the actual page.

To get the “tags” to work I am basically using the categories but simply having the url be “tag”. There’s no point in having categories and tags now is there?

A stripped down and basic Bootstrap css file is used only for the front page and articles page. Specifically the customzed Bootstrap includes:

  • Grid System
  • Layouts
  • Tables
  • Buttons
  • Alerts
  • Wells
  • Responsive – Visible/hidden classes
  • Responsive – Narrow tablets
  • Responsive – Tablets to desktops
  • Responsive – Large desktops

Fontawesome is used on the main page for the icons.

Swiftype was used for the searching feature. I followed this guide to get started with it and tweaked the css after to make it look good.

CloudFlare is also used as an extra bonus measure to security.