Zhen Zhang's Blog

Static Website build and DNS Record Configuration

It is very interesting to build and maintain a personal website. In this blog, I will explain the procedures to build a beautiful blog website using the following tools: domain, Github and hexo.

Domain Configuration

At first, we need to buy a domain. My domain is zhangzhen.me, purchased at NameCheap, since I am a university student now, and NameCheap provide a free trial for university students to use .me domain for one year. I recommened purchasing at GoDaddy, NameSilo and NameChaap. Of course other domain saler are applicable, and you can buy your favourite at any domain provider if it is not registered yet.

At our domain console, we can modify the configurations as we want. I will explain the following DNS records configuration, which we will use frequently afterwards.

For simplicity, I will discuss them using the model of NameCheap. It is certain that different domain provider will have different interfaces for us to make configurations, but they can work well in the same way.

NameCheap

I will make the categories based on the record type.

  1. A Record (A Address): It is a record pointing your domain to a particular ip address. For example, if you make an a record, which points your domain example.domain to 8.8.8.8, then when you open example.domain, you are indeed visiting 8.8.8.8.

    Sometimes you need to make it empty, so you can just type “@” in the host name field, or just leaving blank.

    If you points multiple domains to the same ip address, for instance, pointing both a.example.domain and b.example.domain 8.8.8.8, then you can visit 8.8.8.8 in both ways.

    If you points one domain to multiple addresses, then will get multiple results based on your configuration when you make the inquiry. Sometimes the first one, and sometimes the other. Most of time many applications will only use the first record, so you can use this method to balance your website load.

    You can inquiry the A record using this command:

    1
    nslookup -q=a example.domain
  2. CNAME record, stands for Canonical Name record. It is used to specify the domain name as an alias of another domain name. All information are defined by the canonical one.

    It is mostly used when you provide multiple domain services from a single ip address. For example, if I make records of:

    hostname IP Address/URL record type
    a1 a.example.domain CNAME
    a2 a.example.domain CNAME
    a3 a.example.domain CNAME
    a 8.8.8.8 A

    Then when I am visiting a1(a2 or a3).example.domain, I am actually visiting a.example.domain. But When I change the A record for a.example.domain, all of a1(a2 or a3).example.domain will change accordingly.

    You can make inquiry of the cname address using this command:

    1
    nslookup -q=cname example.domain
  3. TXT record is usually used to provide some information for a particular use. For example, you make the txt record of:

    hostname IP Address/URL record type
    @ hello world txt

    Then when you run the following command:

    1
    nslookup -q=txt example.domain

    Then you will see the outcome of “hello world” in the terminal.

    There are some instances that you will need to modify you txt record: For example, you want to use Google Apps to host your domain emails, or you are making a server modifying your DKIM configurations.

  4. MX record is used to specify a mail server’s responsibility for accepting email messages on behalf of a recipient’s domain. When you specify multiple mail servers, the mail server will use the servers based on the mx pref value. The less one will be used compared to the larger ones.

    It should be specified that the larger mx pref value mail server is just store your mail temporarily, and when the less one is available, it will send the email to the less one.

  5. NS record. It is made to specify which DNS will be used to lookup a particular domain. It can be seen using this command:

    1
    nslookup -q=ns example.domain
  6. TTL, stands for Time to live, is a mechanism that limits the lifespan or lifetime of data in a computer or network. When it expires, the DNS will lookup the domain again. The time length is usually 1800 seconds or 3600 seconds.

    For example, when you visit the domain example.domain, the DNS server will lookup which ip address we should visit. The the server will store this value for 1800 seconds if our TTL value is 1800. Then within this time period, we will visit it faster, since we do not need to look up it again. But after 1800 seconds, the DNS server will look up it again.

  7. AAAA, is a record pointing to the ipv6 address.

Website Build

There are many ways to build a website. Since this website is hosted by Github and powered by hexo, Then I will discuss them here.

Github Hosting

Although not intended to host websites, Github has been one of the most popular host for static sites in the world now. It is intended to provide support for software, so it poses some limitations.

First, if you name your repository arbitrarily, then it will become a Project Page. If you name your repository as “githubUserName.github.io” or “githubUserName.github.com”, it will be served as a User/Orgnaization Page. It is obvious that you can have multiple Project Pages, but you can have only one User/Orgnaization Page.

So when you create an index.html file in your repository, you can see it in the website. The difference is, in your Project Page, you need to put it in the gh-pages branch, and visit it in the link of githubUserName.github.io/repositoryName. In your User/Orgnaization Page, you need to put it in the master branch, and visit it in githubUserName.github.io.

Now you can create a file named “CNAME” in the root of your repository. It should be specified as the domain pointing to, as we talked in the previous part.

Another limitation is, you can only specify domain in your Project Page, and User/Orgnaization Page can specify both domain and subdomain. Since each user can only have one User/Orgnaization Page, then you can only have one page pointing to your subdomain, and multiple Pages pointing to multiple domains.

Hexo vs Jekyll

Now there are many tools to generate static websites. One is hexo, the tool used in this blog, and another is jekyll. I have used both of them, and now I turn to jekyll. The reason is I think hexo can generate static website locally, and jekyll needs github to generate website remotely. So when you have more and more blogs, the advantage of hexo will emerge.

Hexo is a fast, simple & powerful blog framework powered by Node.js. You can have more information from its website.

I have looked for many themes, and finally I found this theme: Next. It is designed by a github user named iissnan, and you can find the detailed information from this theme’s github repository and this tutorial.