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