I’ve always been fascinated by how great writers can break apart complex systems, stir up emotions, and build worlds. Writing is an especially important skill now, as we live and breathe email, iMessage, and Slack. Where you can find friends, and even a tribe, solely via Twitter.
As with anything I find interesting, I wanted to try doing it myself. With writing, though, I wasn’t sure where or how to start. That is, until I ventured onto Twitter and stumbled upon a circle of people who were creating and inter-mingling in unique and inspiring ways. And it made me want to join in (but that’s a story for another post).
From there, I found David Perell’s guide to writing online (one of my recommended links), and decided to build a website and start a blog.
Here’s how.
I’ve wanted to build a website for a while now, and this was the perfect kick in the butt to follow through.
My goals were simple: play, and get better.
To start, I would need to get something up and running, and be able to connect with other people. Pulling from Perell’s post, I wanted my Minimum Viable Blog to have:
On the UI/technical side, I also wanted to:
To do all of this, I chose a combination of Hugo (to generate the static site content) and GitHub Pages (to host the content).
Hugo is an open-source framework used to generate static websites. You can pick an open-source theme from their list or create your own (this site uses the Ezhil theme), write your posts in Markdown, and use the Hugo command-line tool to generate all of the static HTML and CSS files. Most themes also have built-in support for Google Analytics to track traffic and page views.
GitHub Pages lets you host a website directly from a GitHub repository. With this, I can just push the static files generated by Hugo to my GitHub Pages repository to deploy updates to my site.
Here are the steps I took, with some gotchas along the way:
Goals: lay the foundation for Steps 2 and 3
By doing this, I could immediately play with the domain setup and the HTML content.
The GitHub Pages landing page had surprisingly clear setup instructions, so I followed those and created my user site. It became accessible right away via billyyoung.github.io – Hello World!
I have separate GitHub accounts for work and personal use, and I wanted both credentials (via SSH keys) living on the same computer. Then I could push work code as work-me, and still update this site as normal-me.
Thankfully I’m not the first person who’s been in this situation, and I found a handy post on setting up multiple SSH keys and your SSH config to use the correct credentials based on the repo you’re looking at. Note: the me.github.com mentioned in the post should be <your_username>.github.com.
Once your project is using the correct SSH keys, update the git config of your local repo with the correct username and email:
cd /path/to/local_repo
git config --local user.name "your_username"
git config --local user.email "your_email"
Goals: branding and clout
I could finally put my domain squatting to use! And who doesn’t want a cool domain name in 2019?
GitHub Pages has more great documentation on how to configure a custom domain. The steps break down into:
After finishing all of that (and waiting an hour or so for the DNS updates to propagate), v0 of billy.dev was up and running.
Goal: generate HTML with one command
Hugo’s quick start guide gets you up and running with bare-bones HTML templates, hosted on your local machine. You can load the page, test out content and formatting, and play around with themes you’re interested in. For example, this site uses the Ezhil theme.
I set this up, deployed the content to my GitHub Pages repo, and boom! I was now the proud owner of “Billy’s Test Site” on the internet.
Goal: immediately start building an audience based on your tastes
In the #goals section, I describe my Minimum Viable Blog and all of the pieces it’s made up of.
To actually build it, the work is divided into three categories: content, configs/customizations, and auxiliary services.
The actual content I started the site with was the Start Here and Links pages. These include ideas and topics I’m interested in, and essentially put my tastes on display.
As there’s nothing else on the site at this point, these pages should be sufficient for visitors to get a snapshot of who I am and decide if they want to connect. Kind of like a dating profile of sorts…
Besides content and choosing a theme, there are lots of other ways to fiddle with things and make your site your own.
The main config file for your site is config.toml. Here you can set things like:
The full list of config options is in the Hugo docs. Some themes also have theme-specific configs that you can set (docs for these are usually found in the README in the theme’s git repo).
I also forked the Ezhil theme I’m using, so I can tweak it to fit my purposes, e.g.:
There are an endless number of ways to tinker with the design and settings to make your site your own.
One service I needed was to track page views on my site, and Google Analytics was perfect for this – most Hugo themes have a config option that plugs in your GA Tracking ID to your site to automatically start logging traffic.
To start, sign up for a GA account (and follow this video if you’re lazy like me and don’t want to think about all of the different account options). Once you set up your account, add your Tracking ID to your Hugo config.toml file.
The other auxiliary service I needed was for readers to be able to subscribe to a mailing list. Which brings us to:…
This gets its own section because of the amount of effort that’s required.
To set up an email list in the US, you are required by law to provide a valid mailing address when creating an account on your email marketing platform of choice. You are also required to display this address to all subscribers and potential subscribers of your email list.
Yikes.
Fortunately, you can rent a PO box and use it to satisfy this requirement, instead of having to post your personal address online for everyone to see. Unfortunately, renting a PO box requires you to go out into meatspace AND pay money:
Once you get the keys to your PO box (and more importantly, its address), you’re ready to set up an email list (I use Mailchimp):
“Done is better than perfect” is something my old manager used to say often. Getting something functional out quickly and then iterating on it is often better than tweaking and polishing and tweaking and polishing (sometimes without actually shipping anything in the end).
One of my goals with this site is to get better at writing, and that only comes with practice. Lots and lots of practice. As my friend Visa would say, “be prolific AF”.
And now the real writing challenges begin…
P.S. There are plenty of other ways to build personal websites out there, and I’d love to compare notes! Connect with me on Twitter @billyisyoung if you’re doing something differently, or if you have any feedback or just want to chat.