Blogging for Dummies: Hexo GitHub Pages Edition

, , , ,

Step-by-Step Guide to Create a Hexo GitHub Pages Blog

Hexo is a fast, simple, and powerful blogging framework. This guide will walk you through the process of creating a Hexo blog and deploying it to GitHub Pages.

Prerequisites

Before you begin, make sure you have the following installed:

  1. Node.js
  2. Git

Step 1: Install Hexo

Open your terminal and run the following command to install Hexo globally:

1
npm install -g hexo-cli

Step 2: Set Up Your Blog

Create a new directory for your blog and navigate into it:

1
2
mkdir my-blog
cd my-blog

Initialize a new Hexo project:

1
2
hexo init
npm install

Step 3: Configure Your Blog

Open the _config.yml file in the root of your Hexo project with a text editor and configure your blog settings. Pay special attention to the url, title, and author settings.

Step 4: Create a New Post

You can create a new blog post using the following command:

1
hexo new post "My First Post"

This will create a new Markdown file in the source/_posts directory. Open this file and edit your post.

Step 5: Generate Static Files

Generate the static files for your blog:

1
hexo generate

You can preview your blog locally by running:

1
hexo server

Open http://localhost:4000 in your browser to see your blog.

Step 6: Deploy to GitHub Pages

Create a GitHub Repository

  1. Go to GitHub and create a new repository named username.github.io, where username is your GitHub username.

Install Hexo Deployer

Install the Hexo deployer for GitHub Pages:

1
npm install hexo-deployer-git --save

Configure Deployment Settings

Open the _config.yml file again and add the following deployment settings at the bottom:

1
2
3
4
deploy:
  type: git
  repo: https://github.com/username/username.github.io.git
  branch: main

Replace username with your GitHub username.

Deploy Your Blog

Run the following command to deploy your blog to GitHub Pages:

1
hexo deploy

Step 7: Visit Your Blog

Open your browser and navigate to https://username.github.io to see your live blog.

Optional: Customize Your Theme

Hexo supports a variety of themes. You can find themes in the Hexo Themes gallery. To install a theme:

  1. Download the theme and unzip it into the themes directory of your Hexo project.
  2. Update the _config.yml file to set the theme value to the name of your new theme.
  3. Customize the theme settings as needed.

Conclusion

You have successfully created and deployed a Hexo blog on GitHub Pages. Happy blogging!