How to build a site from scratch

Rome was not built in a day and building something great takes time

Posted by Leo Lu on July 31, 2017

Notes: Below are some pointers and observations. The guide is where the actual steps are.

Link to guide: Click Here

Building a site for personal branding

Right now, it’s more important than ever to have a personal brand. The arms race of education continues - nowadays some jobs are listing a master’s degree as a preferred qualification, as if getting a bachelor’s degree isn’t expensive enough. In such a competitive world, a personal brand serves as an excellent differentiator, and what better place to showcase it than on the internet.

Maybe I’ve just slacked off too much in college, but I realize that a lot of what I “learned” in college lacks substance. Instead of taking deep dives into theories that only work in academia, such as the Efficient Markets Hypothesis, or doing case studies, I’d rather build things, which is where web design comes into play.

Learning HTML, CSS, and Javascript for elementary technical understanding

I built my website as a way to showcase my experiences, writing, and (a tiny bit of) technical expertise. I built it using HTML and CSS, a tiny bit of Javascript for tracking, and hosted it on Github Pages for free. I used name.com for my domain name (which is why it costs $15/year to run this site).

Now, you might be wondering why I didn't use something like Squarespace, Wordpress, or Strikingly to create a site without using HTML, CSS, or Javascript. Well, I chose to do it from scratch to get a better understanding of how everything works, and this was the perfect exercise to learn through experimentation and many trials and errors. From doing this, I'm now able to take a look at the code of simple websites and understand how it works, and also customize templates to suit my own needs, which I did for my current site.

However, this site didn’t start out looking like this – it looked more like this: hankquinlan.github.io

The above link shows a sample website that can be built in around 4 hours assuming zero knowledge of HTML and CSS. I got my start by taking the codeacademy HTML & CSS course found here: codeacademy.com/learn/web and afterwards followed this guide, which I highly recommend: jmcglone guide

I’m picking up where the guide left off. Despite taking the codeacademy course and following the guide, I still had some troubles in building my simple site coming from a non-technical background and this guide is to help make the customization of the sample website a bit easier.