I have been procrastinating on building a personal blog for quite a while. It is one of those things that you know it is important and would do great good to you, but you just can’t seem to find time to finally work on it (and, yes, almost always, it is just your another excuse).
Things have changed after I am half way through this awesome book (Soft Skills: The software developer’s life manual) by John Sonmez. The book again emphasizes the importance of a well-maintained blog to your personal brand and your career as a developer, among other good career tips. More importantly, it teaches a few really practical GTD tricks that seems to have cured with my procrastination so far (FYI, I am using them right now to write this blog post).
So, here your are, at my new blog “Commit Logs” at commitlogs.com, where I will be blogging about programming, data science and technology in general.
Alright, enough talking, let’s see some code :).
So you have decided to build your own blog. There are a couple of questions that you need to ask yourself.
Where you want to host your blog?
I chose Github Page, instead of a more traditional wordpress based host, because 1) I already use Github on a daily basis for other projects 2) there is no over-head to set up a database 3) it provides a free 300Mb storage space.
What framework you want to use?
Whether you want to use customized domain name?
I would strongly recommend as it is important to build your own personal brand and it really only costs a few bucks a year. It is also very easy to set up. More on this later.
You can keep on reading if you (smartly) decided to host your shiny new blog on Github Page using Hexo ;).
Before started, you need to make sure
git are installed locally. If not, you can get them installed easily with the follwing commands in terminal (note that I am assuming your are using a Mac).
In case you haven’t already, you should also install
homebrew, which I, among a lot of other folks, believe is the best package manager on Mac.
$ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
$ brew install git
git is installed successfully with
npm is its package manager, which will be installed automatically together with
$ brew install node
Check if they are installed successfully with
node --version and
Set up Hexo
Hexo can be installed locally with one line of command.
$ npm install hexo-cli -g
Suppose you want to save all files related to your blog under a local folder named
$ hexo init myblog
Surprise, surprise, you have already successfully built your blog locally with a sample blog post. Visit http://localhost:4000/ to find it out!
Choose a Hexo theme
One of the advantages of Hexo is that its community has contributed to a great number of awesome themes for your blog (you can, of course, build your own if you desire). You can find a list of samples on their website or Github wiki.
Pick the one that you like (I am using next, the theme of this blog, as an example) and install it under your
$ hexo clean
To apply the installed theme, you just need to modify
Note that, there are actually two
_config.yaml files. One is directly under
myblog/ and the other is under
myblog/theme/next, which is specific to each theme and used to modify a theme. I am not going into too much details about the configuration of
myblog/theme/next/_config.yaml. You can usually find pretty good documentation under the git repo of the theme that you chose.
To see the new appearance of your blog, excute the following commands and refresh the page http://localhost:4000/.
$ hexo clean
Add useful plugins
Besides themes, the Hexo community also develops many useful plugins that can be enabled pretty easily. Take the ones that I use for this blog for example. You can install them via
$ npm install hexo-generator-feed --save
and then edit the
myblog/_config.yaml by adding the following lines.
These plugins will generate three files
myblog/public/ after you generate the site to enable RSS feed and other utilities (details can be found under the git repos for these plugins).
So far, you have finished almost 80% of local development work, isn’t it easy?
Set up Github Page
Now, let us set up the Github Page for the new blog. Every Github user account has one repo to host a blog page and the repo has to be named as
username.github.io. Here is my repo for example https://github.com/LeiG/LeiG.github.io.
You just need to create an empty repo with a name of the required format. It is exactly the same as what you would do with other repos, so I am going to skip the details here. A good Github wiki page may help if you run into any issues (see creating-a-new-repository).
Deploy to Gihub Page
Here comes the most important step. That is, you need to deploy your local blog to Github Page. Don’t freak out. It is just as simple as all the previous steps.
First, you will need to install a plugin
$ npm install hexo-deployer-git --save
and add the following to
LeiG with yours).
After that, deploy to Github is as easy as a one-line command. If you run into any permission issues, it may be that you need to add ssh key to your Github account (see here).
hexo d -g
Note Hexo blog can be deployed to multiple platforms. Here I only cover the Github part, but you can find all the details on this wiki page.
Okay, if you have followed through all the steps, you should now be able to access your Github Page at LeiG.github.io (replace
LeiG with your own username)!
Set up customized domain name
If you are serious about this blog thing, I would recommend you to get a customized domain name. You can get one for a few bucks very easily and it would greatly help your personal brand. Plus, it just feels so cool to have a space on the Internet that is yours.
I registered my domain name commitlogs.com with Namecheap, which is one of many similar services, but I find it very easy to deal with.
Add a CNAME file
After you decide on your domain name, you need to add a CNAME to the git repo. Take my domain name
commitlogs.com for example, you need to create a file named
myblog/public that contains only one line of content.
Set up the DNS
Use the setup at Namecheap, you first navigate to your Domain List >> Advanced DNS option and set up the DNS as the following:
- Click the Add New Record button and then select
A Recordfrom the list. You will then enter
@for Host and
188.8.131.52for IP Address. Leave the TTL as
- Add another new
A Recordwith the same
@for Host, but
184.108.40.206for IP Address. Leave the TTL as
- Add a new
CNAME Record. For Host set
wwwand for the IP Address use your Github Page address with trailing period (e.g.
Save the changes and you are all set, although it may take some time for the changes to propagate.
Create a new post
You can now post your first blog article or generate a new page to start your exciting blog journey.
$ hexo new "my_first_blog_post" #create a new blog post
Hexo automatically generate a Markdown file under
myblog/source/_posts/ and you can use your favorite Markdown editor to open it and generate awesome content right away.
Congratulations on your new blog!
Hope you enjoy this post and feel free to leave a comment if you have any questions. Remember, the only way to build a successful blog is to consistently produce high quality content.
Let’s back each other up!