GitHub pages + Hexo + domain binding build personal Blog

Source: Internet
Author: User
Tags ssh buy domain buy domain name purchase domain name git clone aliyun

EnvironmentWindows 10 (64-bit) git-2.7.4-64-bit
Node-v4.4.7-x64
If the above software has been installed, skip and install without installing the download. 1,git Download installation (https://git-for-windows.github.io/)

2,node Download installation (https://nodejs.org/en/)


3. Install NPM tool (you can not install it first, I do RN before, so it has been installed)

4, verify that the installation is successful.

To verify that the installation was successful, we entered the following command on the DOS desktop:

Git--version

Node-v

Npm–v

Appears as follows to indicate success


Github PagesGithub pages Free static site, its characteristics: free hosting, with the theme, support for self-made page.
Creating github pages is simple, as long as you have a GitHub account in the creation of a warehouse on the line, but the warehouse is a regular, the format must be: Yourusername.github.io. Then follow the prompts to keep the next step, very simple.

GitHub Project creation completed, click "Continue to Layouts", click on the release of personal website, our site is good, but this is a github.io end.


HexoHexo is a fast, concise and efficient blog framework. Hexo uses markdown (or other rendering engine) to parse articles, and in a matter of seconds, you can generate static Web pages with beautiful themes. The official website is also built on the GitHub. Create a new blog folder on your computer, typically on a non-C disk (not a system disk), which is used to store your blog files, and then right-click to select Git Bash (You can also open the Hexo official website (https://hexo.io/zh-cn/) to follow the prompts).


NPM Install Hexo-cli-g
HEXO Init Blog
CD Blog
NPM Install
Hexo Server

Now let's start hexo Local service and see what the default blog is, command: Hexo server
Now in the browser to access: Http://localhost:4000/, the effect of the following figure

Choose another theme because the default theme is too popular, so now let's change the subject. You can go here to find the theme: Exo-theme:https://hexo.io/themes/hexo-github-theme-list:https://github.com/hexojs/hexo/wiki/themes have those good-looking hexo themes. : http://www.zhihu.com/question/24422335I choose the yelee:https://github.com/moxfive/hexo-theme-yelee here, if you understand css.js, you can write your own. Of course Hexo also offers a lot of other templates that can be increased according to personal preferences. Enter command: Git clone https://github.com/MOxFIVE/hexo-theme-yelee.git Themes/yelee

Find the _CONFIG.YML, and change the title of the corresponding topic directory.
After the modification is complete, we use the following command to regenerate all the contents of the static blog: Hexo generate, and then restart the Hexo Local Service: Hexo server.

deploy code to GitHub pages after creating a good warehouse, to generate the local SSH secret key to facilitate the computer's Git software to submit content to the Github, in fact, you can not generate local ssh, you can directly use the command or tool upload code (this pure command to submit can refer to the blog before clicking Open link), in git Bash, enter: Ssh-keygen-t rsa-c "Your email address", then enter, return, return, a total of 3 times enter.
Access: HTTPS://GITHUB.COM/SETTINGS/SSH, add a new secret key

The next step is to deploy the local static blog to the Github, the local static blog to sync to Github, we also need to install two with deployment-related Hexo plug-ins, you can achieve the following command:

NPM Install hexo-server--save npm install hexo-deployer-git--save Edit the Global Hexo profile: _config.yml, this can be referenced online.

After editing the global configuration we need to redeploy:

First clear the old files that have been generated: Hexo clean to generate a static file: Hexo generate in Local preview: Hexo server local, Ctrl + C stops the local preview, deploys to Github using the deployment command: Hexo deploy, There is a pop-up balloon below, please enter: Yes


Then access the server address for checking: Http://xiangzhihong.github.io


Through the above several processes we can also sum up: Later, each publish new articles to deploy according to this process: Hexo clean Hexo generate Hexo deploy github pages bound domain name binding domain name, this piece of comparison pits, I refer to the Internet a lot of do not understand, here is a way I grope. Aliyun (million net) +github domain name binding. Purchase domain name is first in the Ali cloud to buy domain name, we can also on the fact of the domain name trading platform to buy.



Domain name resolution in the Aliyun management console, select "Domain name" "Domain Name list" "All domain name" in the domain name just purchased, click the Resolution button
At this time will remind you to choose to resolve to Aliyun host, or other host, you need to create the GitHub on the GitHub pages of the domain Xxx.github.io query, get an IP address.

Admindemacbook-pro:blog admin$ Ping Xxx.github.io
ping prod.github.map.fastlylb.net (151.101.100.133): Data Bytes
Request timeout for icmp_seq 0-bytes from 151.101.100.133:icmp_seq=1 ttl=47 time=69.632
ms


Here is the explanation, here 151.101.100.133 is my github address (is Xiangzhihong.github.io address, you can ping your own xx.github.io).


If you do not fill in, the direct point of the Novice to guide the setting of the door is good.

GitHub resolution in the GitHub Xxx.github.io project, into the "Settings" tab page, in the "Custom domain" function, will just apply for the domain name written in.


Note: Here you can also use another tool to parse dnspod.

Set well, after a while will be able to access, anyway my is very soon, click on the Open link

integrating IntelliJ idea and efficient in order to submit writing efficiency, I personally suggest using IntelliJ ideas as markdown editing tools, which is also a tool for front-end development. Now we use IntelliJ idea to open our local directory.


Since IntelliJ idea's default terminal in Windows is cmd bad, we now need to modify the terminal tool under IntelliJ idea and point it at our accustomed Git Bash, which is easy to operate.


In order to use IntelliJ idea more stably, we need to do this without modifying the theme, Hexo the beginning of the content of the new article needs to be defined:

Categories: The article belongs to the category tags: to indicate the article belongs to the label for example:

---title
: This is the title of the article
date:2016-10-25 17:58:27
Categories: [Hexo,intellij idea]
Tags: [hexo,intellij Idea,git,github,node.js]
---

Open the project's module (shortcut key Ctrl+shift+alt+s)


Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.