A beginner’s guide to a cheap website

About 9 years ago, when I was curious to get myself a website, the only name that came to my mind was godaddy.com. I was then working with Google as a Search Quality Evaluator and knew enough about web hosting and domain registration to set out on the journey of setting up a website. Obviously, the first one that I looked up was www.nikhildev.com, and yes, it was available. So I went ahead about paid up about 200 INR at that time to buy just the domain. But once bought, came the bigger chunk of investment that I had to make. The hosting. GoDaddy was probably offering hosting at about 1000INR per year. But I’m talking 9 years back. And it was big money back then. I however went ahead and bought the first year of hosting.

It was time for me to show off all those HTML and CSS skills that I had gathered over the years. Armed with 1GB of storage and 10GB of bandwidth, I felt pretty empowered. So I worked up the first version of the website.

As you can see, the only image on the site was my logo in white (CSS based text rotation was not available back then). I wanted the site to be super fast to load and as lean as possible.

This stayed pretty standard for a few months until I discovered wordpress. Honestly, I was blown away by the templating system and ease of posting new content. GoDaddy gave me 1 mysql database back then. So, a few hours of hard labour setting things up (during office hours) and my very first wordpress blog was up.

Here is what it looked like back then

I must admit, coming for a very static website, I was pretty happy with this.

I pretty much stuck with wordpress all this while, renewing the domain and paying for the hosting as well. But when I looked into the specifics of how much money I was paying vs. how much of the hosting resources I was using, I realized that I was throwing all that money away. I barely used 100MB of hosting space, my bandwidth was way below 1GB and majority of it came from search crawlers and as time flew by, I started fewer posts.

So, come 2015, I’ve come to a decision to pay just for the domain and absolutely nothing for the hosting. And so, I starting looking for alternatives for hosting. Before that, there were a few things that I had to re-consider.

1. I barely write any posts these days on my website.
2. I don’t host the images on my site any more.
3. I don’t receive high traffic.
4. I don’t need PHP or any server side scripting language.

So, the checklist for my new platform narrowed down to the following criteria.

1. The platform should be able to serve a single index.html at the root.
2. It should serve static assets like Javascript and images.
3. Pushing updates to it should be easy.
4. Should support AngularJS.

The first candidate that came to my mind was Google’s AppEngine. But I have previously run into errors pertaining to the quota exceeding the free account limit. So, AppEngine was out of question.

That’s when I discovered Github pages. I have been using Git for over an year now and am quite comfortable with the whole deployment cycles. But the amazing things about github pages is that it lets you host a page at <your_username>.github.io

You could host HTML files, images, js files, python and everything else that be saved on a Github repository. And the best part being, you can assign your custom domain to point to your github page. The only down side is that all your code is in a public repo unless you pay for a private repo.

So, the final phase of the transition began. Here is a glimpse of my site before the revamp.

So, I took a couple of days of time out and start working on a barebones site. Something that is minimalistic. Something, that didn’t make you navigate all over the site. A place where the content was easily discoverable. So, getting down to the drawing board, these are the 3 main categories/pages that I needed.

1. Photography (basically a placeholder to redirect users to my photography website www.nixclix.com)
2. Writings (I didn’t want to call it a blog since I wasn’t intending it to be some kind of a log)
3. Contact (Just my email along with some social links)

All the information had to be in-the-face and non confusing.

Next came the step of designing the UI. Now, all of you mac users who want to work on design concepts just for the web, I highly recommend Sketch 3 by Bohemian Coding. It just get the work done. You are free to try it for 30 days, but trust me, 100 USD is too little a price for this.

Once done, I starting converting all of it to HTML/CSS. I used fullpage.js for the beautiful navigation and fluidy scrolling between sections using # structure. Initialized a git repo, pointed it to my github pages repo and committed iteratively. And voila! Everything worked perfectly.

Now comes the tricky part. The part to configure custom domains for github pages. Github has pretty detailed documentation around it, but it can get a little confusing at times. My domain www.nikhildev.com is registered with Namecheap. I found this great article called “Setting the DNS for GitHub Pages on Namecheap” by David Ensinger that helped me greatly.

Once all the DNS changes are made, it might take up to 72 hours for the DNS changes to all the servers. And that’s it. Here is the final complete site.

And how much am I paying for the entire setup? A little over 9USD/yr.

This set up might not be for everyone, but for someone who just wants to maintain a simple site and does not want to shell out cash for hosting, I find this as the best option(although you might need some help around pushing changes to your repo).

If you have any questions around the content, or if you have suggestions to improve this article, please feel free to write to me. My contact info can be found at http://nikhildev.com/#contact