- I. Configure Netlify
- II. Configure Namecheap
Think of it as starting a business. Buying a domain is like registering a company name. The Github repository is your goods and inventory. Web hosting is opening the storefront to the public to present all your products.
So you would need:
- A custom domain. I’m using a Namecheap domain as an example. It typically costs around $10~$20 and I wrote an article about buying a domain.
- A Github repository that has website source files. I wrote about my experience of creating a static website via Jekyll before and it can direct you to the right resources.
- An account in Netlify, the web hosting server
Let’s get the expectation right.
- Namecheap is the domain registrar and has nothing to do with the content itself
- The GitHub repo of the website will be linked to Netlify
- The website will be built on Netlify and refreshed whenever you updated the git repository;
- The final goal is to link between your domain and your Netlify site
This step is relatively easy. Click “New Site from Git” button on the homepage and follow the screen guide. After it’s completed, you will get a URL of your Netlify site in a format as
To add a custom domain on Netlify, go to the site’s
Settings › Domain Management section and enter your domain name.
Custom domains, go to DNS panel ›
Add a new record
name-of-your-site.netlify.app (your netlify site address)
After creating the records, it should look like below. Keep this page open as we will need those values under
Name servers later.
If You Would Like to Know Why…
Good to Know: Types of Domains
“Domain” is a general term for website address. There are different types:
Apex domain: also called root domain. It refers to the core part of a domain, such as
google.com. Note that the
www part does not count.
Subdomain: branch of the root domain. For example,
maps.google.com. Note that
www.google.com is also considered as a subdomain.
Netlify subdomain: it’s a Netlify term for the site address assigned to the user, the format is
Go to Namecheap
homepage › Manage › Domain, the default value for
Nameservers should be
Namecheap BasicDNS, change it to
Custom DNS, and add nameservers provided by Netlify. In this case, there’re four values.
Done. Be patient because it may take some time for DNS settings to propagate. After that, your personal website would be accessed by custom domain.