Introduction to GitHub Pages (Part 1)

Hosting Websites

Hosting websites with GitHub Pages is totally free!

Storing it in a repository

Hosting multiple websites, all free, don’t have to go throw hosting providers and setting up hosting packages – that’s one of the reasons why some of the popular websites, like Twitter Bootstrap or Foundation, are stored and served from GitHub pages.

Limitations of GitHub Pages

GitHub pages do not work with server-side languages such as PHP, Ruby on Rails or Python. It works only with Static HTML, CSS and JavaScript.

So, if you want to create the next Facebook web app, or have an online store, you will have to choose a different option to store the site. You can use HostGator to store your website or any other hosting provider.

User Pages and Project Pages

There are two types of websites you can store. ‘User Pages’ and ‘Project Pages’. Both types are similar and can host the same kind of websites, but you just create them and store differently on GitHub Pages.

User Pages

User pages are stored in a special repository that is dedicated to your GitHub Pages files. As a free user, you have entitled one free website per account.

The user page is usually used to host a portfolio or an organization website.

The URL for user pages looks like this:

Project Pages

You can host a website on GitHub pages with your own domain. You can host as many projects as you want. If you created a static website with HTML/CSS and JS, and you want to show it off, you can do that as much as you want. However, you will need to create a new repository for a new project – which is pretty obvious.

Foundation and Bootstrap host their website with Project Pages. The URL structure that the project pages use is slightly different from the URL used for the user pages.

Project pages sites are served under a sub-path, that matches a repository name. So if you name your repository in GitHub ‘lovetocode’, that will name you will have to use for project pages. I’ll show you an example:

The username is your GitHub username, followed by GitHub link, and your repo name so that link would look like this:

If it was real. Compared this to User Pages, the URL looks different, as written above.


In the next article, we’ll learn how to create project pages site.

Until the next time, happy coding!

Meet the author

Meet the author

Aurelian Spodarec

Front-end WordPress developer that blogs about web development. I like using the right tools for the job. In my spare time, I enjoy cooking healthy food and then eating it. Delicious!