A preface

I don’t know if you have this feeling, but if you use some online blogs to write articles, you will dislike too many advertisements, which will affect the reading experience, so there is the birth of personal blog; Of course, personal blog also has many shortcomings. After all, it is not their own development, can only apply other people’s theme template, it is inevitable that the function of some defects, life is not satisfying, nine out of ten, build personal blog is the same;

The personal blog set up by the knowledge seeker is as follows, and the experience address is as follows:

zszxz.github.io/

Readers interested in this area can refer to this article to build

Ii. Preparations

  • You need a GitHub account;
  • Node.js and NPM must be installed and basic knowledge is required.
  • Install Git for Windows (or another Git client).

Register at github: github.com/

Node official website: nodejs.org/en/download… (Version 10 or above)

After the installation is complete, run the following command in the CMD window to display the version number.

node -v
Copy the code

Git-scm.com/

Enter the user name email address

$git config --global user. Email "user_email" # $git config --global user User_email Specifies the mailbox registered with GitHubCopy the code

View the mailbox with the configured user name

$ git config user.name
$ git config user.email
Copy the code

Github configures SSH keys to search for configurations. Otherwise, the repository cannot be published

Three installation hexo

Hexo is a simple, fast and powerful Github Pages based blogging framework that supports the Markdown format and has many excellent plugins and themes. See github.com/hexojs/hexo for more details

Create the myBlog directory, such as the knowledge Seeker directory

C:\mydata\book\myBlog
Copy the code

Open git Bash in the myBlog directory and run the following command to install hexo

npm install hexo-cli -g
Copy the code

Then execute the following command to actually pull the hexo code from Github

 hexo init 
Copy the code

The contents of the list are as follows

  • The Themes directory houses the blog theme information.
  • The source directory holds articles
  • _config.yml Stores the hexo configuration file

Next, execute the following set of commands. Install NPM dependencies and compile static files

npm install
hexo g
Copy the code

After the command is executed, the public directory is added to the folder for storing static files

Then execute the local preview command

 hexo s
Copy the code

If http://localhost:4000/ is displayed, the local setup is successful.

4 Basic Configuration

Since the default hexo static page is ugly, we need to customize the theme;

There is a hello-word.md file in the source/_post directory. Replace it with our own hello-word.md article

Then use the following command to create the blog post

Hexo new "file name"Copy the code

You can write anything you want in there

Then execute the following set of commands to clear the cache, regenerate the local preview, and run

hexo clean
hexo g
hexo s
Copy the code

The homepage of the re-run site looks like this

Open the _config.yml file to modify the title and restart by author

Open the url to find the interface is really ugly

IO /themes/ choose your favorite theme and click on the github address to copy the code address

Use the following command to download the theme to the thems directory

git clone https://github.com/justpsvm/hexo-theme-primer.git themes/primer
Copy the code

Find the following position at the end of _config.yml and replace the theme name downloaded from thems directory

Execute the three sets of commands again

hexo clean
hexo g
hexo s
Copy the code

Then create a repository on Github with a name format of; User name. github. IO

Installing and deploying plug-ins

$NPM install hexo-deployer-git --save #Copy the code

Modifying Deployment Configurations

Then execute the following set of commands

hexo clean
hexo g
hexo s
hexo d
Copy the code

After each modification, run the preceding command to issue the modification again.

The browser displays zszz.github. IO /. The following information is displayed:

Five hexo command

Common command

  1. Hexo new “postName” # new post
  2. Hexo clean # Clean the cache
  3. Hexo generate # Generate static pages to the public directory
  4. Hexo Server # Enable preview access port (default port 4000, ‘CTRL + C’ to close server)
  5. Hexo deploy # to GitHub
  6. Hexo help # View help
  7. Hexo version # View the version of hexo

abbreviations

  1. hexo n == hexo new
  2. hexo g == hexo generate
  3. hexo s == hexo server
  4. hexo d == hexo deploy

Combined command

  1. Hexo S-G # generated and previewed locally
  2. Hexo D-G # generated and uploaded

Vi. Subsequent Migration

If you switch computers, hexo is easy to migrate. Store myBlog content to Github and pull it from another computer, as shown below

_config.yml
package.json
.gitignore
scaffolds/
source/
themes/
Copy the code

Then install the Hexo environment

npm install -g hexo
Copy the code

Install dependencies

NPM install hexo-deployer-git --save Install RSS plugin NPM install hexo-generator-feed --save NPM install hexo-generator-sitemap --saveCopy the code

check

hexo g
hexo s
Copy the code

Finally, if you write well, you can pay attention to my public number: knowledge seeker