DEV Community

Naveen Yalla
Naveen Yalla

Posted on

Setup a personal website/blog with Github pages

Nowadays website for personal and portfolio became quite common. Its became a digital identity in the digital world. So getting up a personal website its a not big deal when we have numerous ready-made templates available over the internet with free of cost.

In this article, we are using Github pages to build a static website. Github pages provide us free hosting and no need to pay anything. And it is a free code repository for private and public repositories.

All you need to do is get the website template based on the available free themes and host them on Github.

For this article, I am using this template which is free. You can select any kind of template from the site.

Download template to your local system. This contains all the HTML code necessary for a website. This all code is static which means there is no server-side code like PHP etc.

Now open an account in Github if not there earlier.

Then create a public repository with name as githubusername.github.io

Now extract the ZIP file from the downloaded theme.

Upload all the code in that ZIP file folder to the created public repository. (Drag all the content of all the files into the Github repository ).

Now go to the repository and check index file is available.

Now click on Settings tab of the repository.

Scroll down to the GitHub pages section and selects master from the dropdown Source .
After you selected master from the dropdown you will find the link above , which is the link for your website.
Its something like https://github_username.github.io/. For instance ., if my username is nyalla then my website will be https://nyalla.github.io

If you click on that link you can navigate to the website which you created just now with Github pages and free themes.

To customize it further you can edit the HTML files and keep your names and further modifications.

We can also directly generate the websites based on the Jekyll themes from the GitHub pages section.

Top comments (0)