At this day and age, building a web blog yourself almost seems like an outdated thing to do. Most people can get by with using Wordpress or Wix, which does most of the blog-building work for you and let you focus on actual writing. However, some people (me, for example) still prefer to have things done a certain way, and instead of navigating through thousands of templates and plugins we would rather build a simple static website to house our posts and thoughts. If you are one of us, you will find Hexo just the right tool for “Hexo your own blog”, which is what they like to say.

What’s Hexo?

Hexo is a simple yet powerful framework for generating static websites. Static website refers to the website that has fixed content and only displays information without and server side scripting or database design. In other words, you will not be able to have readers push data (for example comments) to you unless you use some extra plugins.

To me this is perfect, since I am not expecting a lot of comments, and all I need is to have a webstie that stores my notes, which if I don’t write down somewhere I will probably forget. When I first started, I looked into Flask and Django, but quickly realized that I am spending way too much time on figuring out how to organize authentication and databases, while having very little time to actually write. Plus, Hexo has a variety of plug-ins that cater to your specific needs. For one, many Hexo themes allows using Disqus for commenting, which is one functionality that’s always nice to have.

Getting started

Enough said, let’s start building a website with Hexo!

Using hexo is extremely easy, but first you will need the following:

  • Install Node.js
  • Install Git and create a Github account
  • An easy-to-use text editor (Sublime, VScode, Atom, etc)

Once the above are installed, we can install Hexo by running

1
npm install -g hexo

Now you are ready to hexo your own blog!
First, start with

1
hexo init [your website folder name]

this will initialize a repository under [your website folder name].
To spin up a default Hexo website, do

1
2
cd [your website folder name]
hexo generate

This will generate the static files (html, css, etc) for your website with hexo default options. You can now view your website on local hosting by running

1
hexo server

you will see output similar to the following

INFO Start processing
INFO Hexo is running at http://localhost:xxxx . Press Ctrl+C to stop.

Copy the url to your broswer, and viola! Welcome to your website!
This website is created using Hexo’s default theme “landscape”, which looks like this:
landscape theme

Hexo offers a wide selection of themes, you can pick and choose the ones you like from here. This site uses the “Yilia-plus” theme. To install a theme, follow the instructions on the theme’s Github read me. Once installed, modify the theme setting in _config.yml to your theme’s name.

Useful commands

Now that your blog is up and running, you can use the following commands to create new posts and pages

1
hexo new [layout] "postName"

This will generate a new post (markdown file) to source\_posts\post\postName.md. You can write your blog post by modifying this file. The file uses Markdown syntax, a short Markdown cheatsheet can be found here.

Once you are done with the blog post, save it and preview your post using

1
hexo server

To get ready for deployment, do

1
hexo clean

which cleans the old static files. Then do

1
hexo generate

to generate the updated static files.

If you already have your site hosted somewhere (like github pages), simply do

1
hexo deploy

and then your new blog post should be online and ready to be viewed by your readers!

What’s next

The majority of this posts follows from my friend Xi’s post which follows from this Chinese post. The original post contains more details, but it does require you to be able to understand Chinese. There are other excellent resources online on how to use Hexo and what features it provides, so feel free to Google around. I will also post stuff about using Hexo whenever I have time or find some interesting features. Have fun blogging!