How I Published my Portfolio website on GitHub
Suliman Munawar Khan
Posted on July 15, 2020
Hello folks
Note: This is my first post on Dev.to so please avoid my mistakes.. š
Today I am going to share how I host and published my portfolio website on GitHub without spending a penny.
Before starting let me give a small introduction to what is GitHub?
To understand GitHub, you want to first have an understanding of Git. Git is an open-source version system that was started by Linus Torvaldsāthe same one that created Linux. Git is similar to other version control systemsāSubversion, CVS, and Mercurial to call a couple of.
So, Git is a version system, but what does that mean? When developers create something (an app or a website, for example), they make constant changes to the code, releasing new versions up to and after the primary official (non-beta) release.
All this talk about how GitHub is ideal for programmers may have you believing that they are the only ones who will find it useful. Although itās a lot less common, you can actually use GitHub for any types of files. If you have a team that is constantly making changes to a word document, for example, you could use GitHub as your version control system. This practice isnāt common, since there are better alternatives in most cases, but itās something to keep in mind.
Now that you know what GitHub is all about, so we are ready to start
Step 1: To host a website on GitHub you first need to have you portfolio website or any other website ready
Step 2: If you are good to go with step 1 then you must have a verified GitHub account I am sure every developer must have a GitHub account. If for some reason you donāt have one you have sign up for free here at github.com
Step 3: after creating your GitHub account login to your account and head over to your GitHub dashboard
Step 4: The Dashboard will look like this. Click on āNewā Button.
Step 5: after clicking on āNewā Button, you will see a page like below where you have to create a new repository. Give your repository valid (meaning full) name. make sure you have selected the Public option checked, and hit the create button at the bottom of the page.
Step 6: After creating repository you will see the next page like below. On this page you have to upload you website content. You can upload the website content by using three method but here I will be using the .git software to which helps you to upload your content to GitHub from your local machine using command line
If you donāt have .git you can download it from here: .git
Step 7: open the folder where you have saved your website right in that directory and click on āOpen Bash Hereā. after that you will see the following on your screen
Step 8: So we are about to finish here write the following command
- git init
- git add .
- git commit -m "first commit"
- git remote add origin https://github.com/SulimanFURC/YourName-Portfolio.git
- git push -u origin master
congratulation you have succussfuly uploaded you website to the GitHub repository
now the is the step to make your website online
Step 9: click on settings and scroll down to GitHub Pages. Below is the option selector click on it and change it to master branch from āNoneā wait for a sec and the page will refresh by itself and after that you will see the link to your website like this https://sulimanfurc.github.io/MyPortfolio/
Hurrah!! You have successfully hosted your website on GitHub now clicking on the link will take you to your website and of course it is up and live runningā¦
You can share this link on any social media to let the people know about your portfolio website or any other website.
So we have come to the end of this post. I hope you have learned something from it.
Please let me know in the comment section about your experience related to web development and GitHub. I will be sharing more related stuff in future
Thank you! š
Posted on July 15, 2020
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.