If you are learning to code, or already into it and want your project to be hosted, easily that too for free. The answer is Github Pages. It helps you not only in hosting HTML, CSS and JS files but yeah helps in learning the important and tricky tool i.e Git. In this post I will be helping you as how to publish your project from local repository to github pages.

First of all we need to know about two types of github pages called as

  • Userpages
  • Project pages

userpages come in handy if you want to host your personal website or the index of any project. You may note that there is only one userpage per account. The URL for userpage is http://title.github.io/

Project pages are used when you want to host a project, of which you have many. We can have multiple project pages per Github account. The URL for project pages are http://title.github.io/projectpage/

###Create First Repository### First lets go on this page https://github.com/new after we sign up on github

Create First repo

  1. Enter repo name
  2. Make repo public, you can make it private as well, But that is paid service. Remember keeping repo public isn’t any harm. There people can see your code and can request pulls, But they wont be able to merge only you can.
  3. Check “Initialize this repository with a README” this is optional but it will make next step easier.
  4. Then click create repository.

And you are done with repository creation.

Same goes with project page creation

Now lets create create “Hello World” page and push it to Github, To see how github pages looks like and work

Before you take clone of repository we created, You may need to add .ssh keys and do some installation, If you have already done You can skip and move forward. If not Please follow this link.

###Now lets take clone of repository### On the project repository just copy the ssh URL and paste in terminal in your specified path and hit enter. Clone the repo Clone the repo

Command that you will get from github will be like this

git@github.com:junaidmasoodi/junaidmasoodi.git

Add git clone as prefix to the above to start cloning.

git clone git@github.com:junaidmasoodi/junaidmasoodi.git

and for now our cloned repo will have readme.md only

Note: If you are familiar with git and installed same on your machine, then and only then you will be able to take clone.

Otherwise there are two other options at same place clone in desktop & download as zip you can use these options as well to clone or simply download repository.

In another post I will create one page of say “Thank You” and push to same repo and will also show as to how the custom domain redirect to same page.