Last time someone commented that technical blog is standard for programmers, but as far as I know most technical students still don’t have their own technical blog. There are a lot of reasons, some are lazy to write, some are afraid of writing bad, still have a lot of always want to hold back a big move, fantasy to perfect and then issued, the result has been stillborn. But in fact, more programmers do not know how to build a blog, in fact, now it is very easy to build a personal technology blog, the simplest way to build is to use GitHub Pages + Jekyll, my blog is using this technology.

GitHub Pages

Github Pages is a public static page hosting service for users, organizations and projects. The site can be hosted on Github for free. You can choose to use the default domain name Github Pages or custom domain name to publish the site. Github Pages supports automatic site generation from Jekyll, as well as pure HTML documents. Hosting your Jekyll site on Github Pages is a good choice.

Github Pages has the following advantages:

  • Completely free, which server, traffic, domain name what all need to manage, completely free to build a technical blog
  • Blogging is all about submitting code to align the writing and programming experience
  • You can bind your own domain name
  • Provides popular theme templates for web pages

There are drawbacks:

  • There is no support for dynamic content, blogs must be static pages, and Jekyll is used to build content.
  • Blogs cannot be indexed by Baidu. Github blocked Baidu because of the conflict between Github and Baidu.
  • The storage space is less than 1 GB
  • The monthly traffic does not exceed 100G
  • Update no more than 10 times per hour

Github Pages uses Jekyll to build content, so what is Jekyll?

Jekyll is introduced

Jekyll is a simple blog-like static site production machine. It has a template directory that contains documents in raw text format, which is converted by a converter (such as Markdown) and our Liquid renderer into a complete, publishable static website that you can publish on any of your favorite servers. Jekyll also runs on GitHub Page, which means you can use GitHub’s services to build your project pages, blogs, or websites, and it’s completely free.

However, if we only use it on GitHub, we don’t need to know Jekyll’s syntax. GitHub will automatically convert Markdown files we write into static pages. To use Jekyll, you need to use Markdown syntax to write your articles, but Markdown syntax is very simple and can be mastered in two or three days as a programmer. You can also refer to this article: Markdown use summary.

Share some Jekyll topics with you. There are many jekyllthemes.org/ topics for you to choose according to your personal interests.

My personal blog

My blog went through three phases. In the first phase, IT was built entirely using GitHub Pages. In the second stage, the blog is hosted by a foreign service provider. The third stage, server migration back to domestic, domain name record. I have written several previous posts on tech blogs, as follows:

  • Tracking the death of blogs for thousands of miles
  • After 25 days, my blog (www.ityouknow.com) is alive again
  • Tech blog stuff

Using Github Pages + Jekyll to build a technical blog is very simple, basically the steps are to find a favorite topic on the Internet, Fork to your own Github, then delete the content of the original blog, upload your own articles can be, take my own blog for example.

I originally used Yumy-Jekyll for my blog, but that theme hasn’t been updated in over two years. Therefore, I made some changes based on this theme in the later period, including the update of dependent components and the revision of individual pages based on personal situation, which became the present look:

The reason for using this theme is that I prefer a clean, atmospheric style, and the blog theme supports code presentation well.

Build a blog quickly

Take my blog as an example to introduce how to build a blog quickly. This was also the first stage of my blog experience.

1, first open the address github.com/ityouknow/i… Click the Fork button to make a copy of the code to your repository.

A minute later, your Github repository discovers an ityouKnow.github. IO project.

Delete the CNAME file

Delete the CNAME file in the project. CNAME is the content used when the domain name is customized. If the customized domain name is not used, there will be conflicts.

3. Set GitHub Pages

Click the Settings button to open the Settings page, scroll down to GitHub Pages Settings, select Master Branch from the check box under Source, and click the Save button next to it to Save the Settings.

Rename the project

Click the Settings button to open the Settings page and rename the project to github_username. Github. IO.

Github_username is your Github login username

5. After the rename, go back to Settings > GitHub Pages again

You’ll find an address like https://github_username.github.io

At this point, when you visit this address, you can see the front page of the blog, but when you click on the post, the link redirects to the wrong address, because a file is missing.

6. Configure _config.yml

Open the _config.yml file in the project directory and modify the following configuration:

repository: github_username/github_username.github.io
github_url: https://github.com/github_username
url: https://github_username.github.io
Copy the code

At this point, visit https://github_username.github.io and you will find that the blog has been built. All that’s left is to go to the _posts directory of the project and delete my posts, and then write my own posts using Jekyll’s syntax.

Github_username is your Github ID.

Custom domain name

While blogs can be accessed via https://github_username.github.io, GitHub Pages is also available for those who want to use their own domain names to access blogs.

First, you need to set up domain name resolution, which points to your github blog address. This section uses the domain name configuration of Wanwang as an example. Select a domain name and click Resolve. Add the following two records on the domain name resolution page

In the empty box, enter your github_username value.

Then open the project Settings > GitHub Pages page, enter the domain name: xxx.com under the input box of Custom Domain, and click Save.

Reconfigure _config.yml

Open the _config.yml file in the project directory and modify the following configuration:

url: http://www.xxx.com
Copy the code

After one minute, visit www.xxx.com.

Custom DIY blog

General students to the above step is also completed, basically meet the needs of 80% of technical students. But there are still some students have higher pursuit, such as using Github Pages although simple and convenient, but can not be searched by Baidu lost a large number of traffic, there is another reason sometimes, the stability of blog network access is not very high.

I had a couple of virtual machines in a foreign country that I used for it and then installed an Nginx as a server for static pages. First OF all, I installed the Jekyll environment on the local machine (Win10), the Github blog code downloaded down, compiled into static Html on the local machine, and then manually uploaded to the service under the Nginx directory; Then point the domain name to the virtual machine.

Win10 install Jekyll environment is a painful experience.

So cumbersome steps it took me a few months later, is really can’t stand, on the one hand, due to a server in a foreign country, sometimes still unstable (perhaps because the server installed agents), on the other hand I need to use some features, use of these functions is the premise of web site need to put on record, tencent cloud doing activities during that period, the blog and moved back from abroad, I’ve re-optimized the process.

This script will automatically pull the latest updated files from Github, and automatically produce static Html files and push them to the Nginx directory. The domain name will point to this server again. You can set up hooks on Github that automatically trigger scripts when submitting code, or trigger scripts periodically to publish articles.

The script content is as follows:

cd /usr/local/ityouknow.github.io
git pull http://github.com/ityouknow/ityouknow.github.io.git
jekyll build --destination=/usr/share/nginx/html
Copy the code

The prerequisite for executing this script is to install the Git \jekyll environment. There are many examples on the web that will not be described here. The Jekyll environment setup and use can be found here: jekyllcn.com/docs/home/

Finally, you can leave your personal blog address in this article, convenient peers watch, exchange, learning.