Host a personal website in 10 simple steps for Free.
As COVID is going nowhere, I have been thinking about how we are moving towards a deeper online inter-connected universe. That made me think even harder on how important it is to have an online presence as a website or portfolio and not just to businesses but also individuals.
Thus, this is a step-by-step guide to demonstrate how you can host your one-pager website using GitHub Pages with a domain name!
[Disclaimer: This needs basic knowledge of Github and HTML to get started]
This has 3 parts to it:
- Github: An online development platform to keep your code for the website and will help host the same on the internet via Pages.
- HTML Template: This is ultimately the code that is rendered on the webpage.
- Freenon: It is a domain registry service that will let you register a domain name for free (based on availability).
Step 1: Create your account on https://github.com/ and be sure to set the <username> as your name as it essentially becomes the URL for the website.
Step 2: Create a new repository with name <username>.github.io
For ex: vaibhavmagon.github.io (here my username and repo name both are vaibhavmagon)
Step 3: Enable Github Pages in the repository to host the website from Settings. If all’s well you’d see settings like this:
Step 4: Once the repository is created successfully, clone it to your machine as we move towards Part 2.
Explore the basics of Github in 20 minutes:
Step 5: Choose a template from ample of free HTML templates available on the internet. A few can be found here.
50+ Free Personal Website Templates 2020 - Colorlib
No matter what your profession or talent is, we have an assortment of free personal website templates available to…
Step 6: Download your selected website template, edit the files accordingly, and copy it to the cloned repository linked to GitHub. (Basics of HTML & CSS are needed to edit the files)
Step 7: Once changes have been made, push the code to the git repository. Voila, the website is ready and is hosted at <username>.github.io!
Step 8: Now that website is hosted, in Part 3 let’s get a custom domain name shall we? Go to https://www.freenom.com/ and sign up!
Step 9: Go to the domain and register a free domain name. Most of the .ml & .ga are available for free (or a paid one of your choice). While purchasing set the URL forwarding to your hosted GitHub link <username>.github.io.
Step 10: Boom! Your custom domain is up that opens your website. 🚀
Ex, it’s live at: http://vaibhavm.ml/
(The website is redirected to your Github repo via custom URL. The https & SSL can also be achieved easily but has been left to keep it simple.)