Do not spend a line, Song Ge taught you on-line personal blog

Previous: I heard your IDEA ball dropped yesterday? Song Ge got you the big move
, there are many small private letter Song Ge partner, Song Ge blog is to find out how to do it, in fact, that I had and we talked again today to talk about.

I remember it was April 2015 15 Contributions my first blog on CSDN, is a study notes, since then opened the way I blog writing, to date more than four years.

This is four years I published on the CSDN blog up to a total of 550 original, CSDN is my base camp, but in the meantime there are intermittently sent a blog on other public platforms, such as sf, blog Park, Denver, Mu class net, but are very fragmented, 2016, when I use GitHub also set up a personal site, but only test a few pages, and there is no good to maintain.

This year out of its own independent blog http://www.javaboy.org, from April to now, blog PV and UV are visible to the naked eye growth rate, I am also very happy. Because we fear most is the personal independence blog traffic, which is why I put this thing dragged on for four years to make one of the reasons, but after really DIY, I personally find to build independent blog much easier than you think, as to the flow, As long as the content OK, flow rate also is not a thing.

Today, I will come and chat with everyone how to build a personal blog.

Technology Selection

Currently still very popular blog site, so I do not really suggest that you go and get a dynamic blog system, so you want to worry about things too much. Use build static blog, allows us to focus mostly on blog writing, rather than endlessly consuming to build on the blog (many small partners to build a blog, when high spirits, set up after the completion of melancholy, and then there would be no the air leaving a blog site out there).

Static blog selection, Song Ge is currently the main contact with two options:

1. Combined Jekyll built on GitHub blog, Jekyll is a simple static site blog forms of production machines. It has a template directory that contains the document original text format, and our Liquid renderer converted into a static website a complete publishable by a converter (such as Markdown), you can publish on any of your favorite server. Jekyll can also run on GitHub Page, that is, you can use the service to build your GitHub project page, blog or website, and is completely free.
2. After a good local rendering HTML, uploaded to the server, the representative works is hexo.

Simply put, the first way that we write after the local markdown, direct upload to the server, the server will automatically rendered into HTML, and then presented to the user, the second option is after we write markdown locally, the markdown locally rendered into HTML, then the rendered HTML uploaded to the server. (Markdown small partners should understand it, I do not do too much introduced)

Song Ge these two programs are useful, you see http://www.javaboy.org, I use hexo + icarus achieve. We see http://springboot.javaboy.org, http://spring.javaboy.org, http://springmvc.javaboy.org, http://mybatis.javaboy.org, http://maven.javaboy.organd so on, then I use to do Jekyll Both options have their advantages and disadvantages, the Song Ge back again and everybody detail.

Today we chat and major http://www.javaboy.orgbuilding sites, that is, I used hexo + icarus to achieve.

All funds of this blog is to put hundreds of dollars to buy a domain name, and then gone to spend money. Sites hosted on GitHub, GitHub comment system is also used to do, if you can accept the default domain name provided by GitHub, and even then you do not have to buy a domain name, then we take a look at how to achieve this thing.

If you played the Song Ge micro personnel (https://github.com/lenve/vhr) or V Tribe (https://github.com/lenve/VBlog), then for hexo can be very easy to get started, because the inside also used nodejs, and micro preceding operations personnel have a lot in common.

Build a blog

With Hexo set up, if there is a little bit of experience with the front end Node better, of course, does not matter, because the associated command is not much. Use Hexo installed on your computer in advance Node good and Git, the installation is successful, you can start Hexo installed. Proceed as follows:

1. Installation Hexo

npm install -g hexo-cli

1. Create a blog in the local directory

hexo init blog

After the implementation of the above command will create a directory on the local blog, here it is an independent blog edge necessary files, and then enter into this directory, execute the npm installcommand to install the related dependencies.

After installation, the directory is generated as follows:

.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

Here several files / folders, let's focus on two of _config.yml and themes directory, _config.yml file, we can do some basic configuration of the site, the site such as title, description, keywords, icons, etc. these configurations are intended mostly see the name to know. as follows:

After configuration, navigate to the blog directory, the implementation hexo scan be started after a local project, and the successful launch, the browser enter http://localhost:4000you can see the site.

Speaking of hexo scommand, here are a few commonly used commands required to introduce under, namely:

command	Logogram	Chinese meaning
hexo server	hexo s	Local Launch
hexo generate	hexo g	Generate static files
hexo deploy	hexo d	Deployment site
hexo clean		Clear cache and has generated static file

The four regarded Song Ge these days most used commands, other commands, and everyone can refer https://hexo.io/zh-cn/docs/commands .

Modify Subject

In general, a theme will configure their own personal sense of ecological Hexo is quite rich, there are many optional theme, Hexo default theme using the landscape, Song Ge earliest use of hexo-theme-next topic. After the local blog up and running, the next step is to modify the theme, the first step is to modify the theme before the election they think a nice theme, selected after, the first cloned into ./themesthe directory, this directory file originally had a landscape folder, placed inside of the default style, of course, developers can directly theme file download a good copy came in, but I still recommend the use of clone, using the clone, if one day this theme updated, just pull it you can get the latest a style.

To hexo-theme-next topic, for example, clone command is as follows:

cd your-hexo-site
git clone https://github.com/iissnan/hexo-theme-next themes/next

After the successful cloning, modification hexo of _config.yml file, modify the theme for the next, as follows:

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: next

After the theme is created, the next step is to configure the theme, this is relatively easy, direct reference to the official documentation can be. After the configuration, run the following command to see the new theme effects:

hexo clean
hexo g
hexo s

Command Meaning can refer to the table above, will not repeat them here.

The next topic I probably spent two or three months, now replaced by icarus, everyone in the theme configuration, as long as a configuration will be, certainly there will be no more other problems.

Bound to GitHub

You may have to wait to blog uploaded to GitHub, and is bound to Github step is very simple, first of all with 自己的GitHub ID.github.iothe name of creating a public warehouse, for example, my ID is lenve, create a repository as follows:

After successfully created, modified hexo of _config.ymlfiles, configuration GitHub address, as follows:

deploy:
  type: git
  repo: [email protected]:lenve/lenve.github.io.git
  branch: master

Here you can configure according to their own addresses after the configuration, run the following command:

hexo g
hexo d

After the execution is complete, you can upload the data to the GitHub (of course, here you need to configure in advance about GitHub's public key, specific reference Git associated with the remote repository ).

After a successful upload, access https://lenve.github.iocan see their personal site, which is GitHub default domain name to us.

If the domain name you are not satisfied with the offer on GitHub, you can also apply for their own domain name, every minute you configured.

Domain name applications

Domain name applications recommended the use of foreign domain provider, not the record (a word, fast! Do not wait), Song Ge use godaddy, mainly because of the support PayPal payment service providers, domain name applications is relatively easy, needless to say, but in fact, many similar domain name provider, you may not use this, you can look at yourself.

Binding domain and GitHub

After the domain name application is successful, the next configuration is also divided into two parts.

GitHub configuration

First in the source directory blog directory where the ( be careful not to misplace a ), to create a CNAME file, as is your domain name, as follows:

Then execute the hexo dcommand to upload the file to GitHub it.

In line to see someone directly on GitHub this configuration, as shown below:

This approach is also possible, in this way will automatically generate a CNAME file into the current repository, but Song Ge here do not recommend you use this method, because if you perform locally hexo clean, and then go to upload, you will lose out CNAME file, then you have to be reconfigured. The key is when you execute hexo cleanlater, you might not find CNAME files have been lost.

DNS Configuration

域名解析这块，当时遇到了一些问题，后来松哥使用了国内的 DNSPod 去做域名解析了，没有使用 godaddy 提供的域名解析。使用 DNSPod 首先要做的，就是修改 godaddy 提供的域名解析服务，登录自己的 godaddy 账号，找到域名管理，修改域名解析服务为 DNSPod ，如下：

然后登录到 DNSPod（没有账号注册一个），然后添加自己的域名解析，如下图：

添加两条 A 记录，指向 GitHub 的 IP 地址，再添加一条 CNAME ，指向你的 GitHub 域名就可以了。

如此之后，大功告成！

总结

好了，不知道小伙伴们有没有 GET 到呢？这个不用花很多钱，就是一个域名的费用而已（如果你不想用 GitHub 提供的域名的话），也不需要额外买服务器，hexo 的使用也很简单，有兴趣小伙伴赶快实践下吧！