This article has participated in the good article call order activity, click to see: back end, big front end double track submission, 20,000 yuan prize pool for you to challenge!

Hello everyone, I am Brother Chen ~

As a lover of technology, I like to record my experience of learning technology or some of the mistakes I made. My first choice is technology platform (blog). Today, Chen Brother will teach you how to use Github to build your own personal blog platform.

In addition to being a source code communication platform, Github also provides functionality for building blogs. Github is currently used by some big names and teachers (Chen has seen a lot of them).

Access Address:

liyunchen.github.io

01. Environment preparation

Before setting up the Github blog, prepare the environment (install in the following order, don’t get confused)

1. Install git

It-SCm.com/

1. Access the git official address, download the corresponding installation package, and install it (simply click next).

2, after the installation, the right mouse can see: Git Bash Here, click on the open.

3. Enter git –version

This indicates that Git has been installed successfully.

2. Installation node. Js

Official address: nodejs.org/en/download…

1. Visit the official nodejs address, download the corresponding installation package, and install it (simply click Next).

2. After the installation, configure environment variables and enter node -v in the terminal

This indicates that nodejs was installed successfully

3. Install Hexo

Install command: NPM install hexo -g

To test the installation, run the hexo -v command

4. Install the HexO dependency

Command: NPM install –save hexo-deployer-git

Git SSH key

If you’re reading this, you’ve probably heard of Github and signed up for your own account. If you haven’t already, go ahead and do one.

Why do I need to configure an SSH key?

Purpose: You can upload local source code and resources to Github without having to enter your account and password each time.

Check whether the local SSH key has been configured (run the CD ~/.ssh command).

Chen brother here before the configuration, now delete configuration, reconfiguration side, convenient readers can follow the configuration.

Look again at

Can see the tip: / c/Users/Administrator /. SSH: No to the file or directory

Remark:

SSH configuration is saved to c:/ user /Administrator/.ssh

1. Configure SSH

Enter the SSH key

Ssh-keygen -t rsa -c “Email address”

Note: The email address here is the email address bound to the Github account

Enter the ssh-keygen -t rsa -c “email address” command. Enter three times in a row

You can see that an SSH folder is generated under the user folder

Go to the SSH folder and copy the contents of the id_rsa.pub file

Go to the Github home page, click personal Settings, click SSH and GPG Keys on the left, and click New SSH Key

Paste the copy of id_rsa.pub into the key, and select a title.

Click Add SSH Key

The test was successful:

ssh -T [email protected]

After entering the test command, followed by yes, the following message appears indicating success

Configure the account and password

$git config --global user.name "liyunchen" $git config --global user.email "[email protected]Copy the code

Note: Remember to change the user name and email address to your own

Start a personal blog

1. Create a blog

Before we begin, let’s introduce the basic commands of Heox

Hexo new page "pageName" hexo new page "pageName" hexo new page "pageName" hexo new page "pageName" hexo new page "pageName" hexo new page "pageName" hexo new page "pageName" hexo new page "pageName" hexo new page "pageName" hexo new page "pageName" hexo new page "pageName" hexo new page "pageName" 'CTRL + C' to close the server) hexo deploy # to GitHub Hexo Help #Copy the code

Corresponding abbreviations, such as:

hexo n == hexo new

hexo g == hexo generate

Create a new directory to save the blog, such as: D:\ official account \0722

Go to the local blog directory

Initialize a personal blog

Command: hexo init

You can see the following in the blog directory:

# Generate static web pages

Command: hexo g

# preview

Command: hexo s

Error solved:

Problem: Hexo G reported an error,line. MathALL is not funciton problem resolved

Cause: The nodeJS version is earlier than 12

Solution: Two ways

Method 1) Upgrade NodeJS to a version later than 12.0.0

Method 2) Change the value of highlight->enable in config.xml from true to false to avoid exceptions.

In your browser, go to:

http://localhost:4000/

You can see that the access is ok.

But this is just a local preview, and then deploy the blog to Github.

2. Deploy to Github

Create a new Github repository

Give the warehouse a name. Look out! Attention! Attention!

Format of the repository name: username.github. IO

The name of Chen’s warehouse is liyunchen. Github. IO

That’s because the repository name will serve as your github blog address

Edit _config.yml, _config.yml in the directory where the blog is stored

deploy:
  type: git
  repository: [email protected]:liyunchen/liyunchen.github.io.git
  branch: main

Copy the code

Change the repository address to its own

Branch: If your github repository is master or main, fill in main

Release to making

Command: hexo d

Access in the browser

liyunchen.github.io/

You can see successful access

The blog has been deployed to the public network and can be accessed by interested readers

04 Write a blog

After you have set up a blog, you will definitely need to write a blog and sync it to Github. Chen Brother will take you to write a blog

Create a new blog called enge-first-blog

Hexo new ‘enge-first-blog’

View the corresponding folder

You can see that a enge-first-blog.md file is generated, and you can use this md file to write your blog

The default is something like this:

-- Title: Enge first-blog Date: 2021-07-22 14:08:14 Tags: -- Here's where you start writing the textCopy the code

Start writing blog content (Markdown format)

Here Chen Brother uses a previous article as an example

Among them, the role is to view the article, click on the more time to load all the article content

Once you’ve written it, start deploying it to Github

1. Generate an HTML file

hexo g

2. Upload to Github

hexo d

Revisit:

liyunchen.github.io/

You can see that the blog has been synchronized to The Github platform, and the effect can be seen: Read more

05 summary

In this article, I set up my own personal blog from 0 to 1. The process is very detailed, and the errors that may occur are explained and solved. It’s an absolute baby-sitter tutorial. After you finish it

Hope to see this article you can give Chen brother a thumbs up, click to see even better, encourage the original author to keep moving forward. Finally attached Chen brother set up the blog address, all people can access.

Access Address:

liyunchen.github.io