Build a super fast website with Hexo and github pages

Preamble

What do you think about having your own personal blog. As both a place to share your knowledge and also a channel for PR for yourself. But you don’t want to spend too much time rebuilding your blog from scratch and then choosing what backend technology to use and what to use. Then you have to spend a decent amount to rent hosting with the domain name. Not to mention that you are not a web developer?

With hexo and github pages will solve these problems for you!

What is hexo?

Hexo is a powerful blog framework that creates static websites simply and quickly using NodeJS. You can write articles in Markdown or other markup languages.

Start right away

With hexo, it is very simple to have a static website immediately with the following statements:

$ npm install hexo-cli -g
$ hexo init blog
$ cd blog
$ npm install
$ hexo server

That’s it! Next, go to http: // localhost: 4000 and see the result:

And done. Very simple, right

Next is to choose a really shimmering template, hexo provides available for them about 311 Themes spoiled for choice you can see here: https://hexo.io/themes/

I chose 1 theme and added it to my website: https://github.com/cofess/hexo-theme-pure

Next is the clone to and put in the blog / themes / pure directory:

git clone https://github.com/cofess/hexo-theme-pure.git themes/pure

and fix the blog / _config.yml configuration file:

theme: pure

So has successfully applied a new theme already. Try seeing the results.

So successful!

To add a page or a post, run the following command:

hexo new [layout] <title>

The layout will look like this:

LayoutPathpostsource / _postspagesourcedraftsource / _drafts

I will add one post to the website with the command:

hexo new post first_post

After running the command, it has created for us a file in the path \ blog \ source_posts \ first-post.md

Open this file and write the content:

---
title: First post
date: 2020-05-31 00:51:14
tags: ['post']
---
this is first post

Save and run and result:

1 post has appeared. Now copy the posts from viblo and just edit some content about the profile in the file \ blog \ themes \ pure_config.yml

So there is also the blog dew.

You can completely create other pages like page about …

Deploy website on github pages

Creating Github Pages is quite simple, you must first have a Github account, create a new repo with the name in the format <github-username> .github.io, because my github username is phamtuananh1996 so I will create a repo with name is phamtuananh1996.github.io

Once Github Pages has been successfully created, our next job is to generate static web and deploy to Github Pages to host. Once deployed, the address to access your blog will be: <github-username> .github.io.

Generating static web and deploying becomes quite simple with Hexo, we just need to fix the blog / _config.yml file with the following content:

deploy:
    type: git
    repo: https://github.com/phamtuananh1996/phamtuananh1996.github.io.git

Change the username to your username.

Proceed to install the plugin hexo-deployer-git :

$ npm install hexo-deployer-git -save

To deploy, run the following 2 commands:

$ hexo generate
$ hexo deploy

And the result is here: https://phamtuananh1996.github.io/

It is done !

Conclude

It took less than 5 minutes for you to have a complete blog with hexo and github pages. What are you waiting for without discovering hexo right away. Above, I just introduced them through the first version.

You can find out more at https://hexo.io/

Hi, Sincerely and decided to win

#hexo #github #programming