This is a post about an earlier version of this site
I started to feel quite blasé about the site I use to market myself! It was already 2 years old and that’s a long time, especially in tech, to regard something as old and probably obsolete - in comparision to the prevailing! Frankly it’s about time that I start catching up with what’s hot in Web!
No to pre-built templates
So, I set to create a new website for myself, again! The tech landscape has changed a lot in the last 2 years - especially the attention given to Mobile first or responsive design. I didn’t want to use a pre-built template that I could buy for a few bucks. Part of my online persuasion stems also from the fact that what you see is what I made. A from scratch development gives me immense flexibility in terms of design, architectural choices and a sense of satisfaction.
Unlike the times before this, I decided to set some ground rules before I set my course to coding. These include architectural choice and a few more guidelines :
- Responsive layout
- Simple and clean UI
- Consistency in Design and Code
- Proper dependency management
- UI and Data isolation
After examining a few popular choices, I arrived at the list below:
AngularJS is freaking awesome! Using Angular material I quickly arrived at a basic template for the website with just one dynamic element - the only changing component of the website - consistency and uniformity, remember?
Once I have a basic template for the site, I just had to make templates for each page - templates because I wanted to maintain isolation between page design and the actual data. Keeping other ground rules in mind, I arrived at below structure for the app.
So far so good. Then I also wanted to have a blog to go along. Install wordpress, right? - I wish it were that simple. Anyway, more on blog setup later.
Rules first! A big no to wordpress - I want to be in full control of my blog and it’s content. So, my obvious choice would be Jekyll - a blog aware static site generator. But then I’m also looking for a uniform and consistent integration of this with the exisiting site. So, I would prefer a blog with a simple JSON API, because I’m already using JSON for user data, but not go so far as a full wordpress setup - that would have been easy though!
Luckily, jekyll is very open! I created templates with JSON structure and HTML output embedded in the JSON. Obviously, there was more to it! Here are some additional tweaks, using jekyll plugins, I did to get a blog that supports rich text content :
- Redcarpet Markdown-HTML convertor
- Category indexes plugin
- Language specific code blocking
- FontAwesome Icons
- A few other plugins in Redcarpet itself
You may check the blog source code for more info on this.
We all love addons! Since everything so far is working great, I decided to throw in a couple of add-ons :
Discuss plugin: Because a blog with no place to voice your opinion would be dull!
Crawler friendly version: As great as AngularJS is, it fails miserably when it comes to dealing with web crawlers! Thanks to Prerender.io, that’s a solved problem now! You can check this setup in the