How to create a simple portfolio with GitHub pages

carolmusyoka

Carol Musyoka

Posted on November 27, 2019

How to create a simple portfolio with GitHub pages

One of the ways of scaling up as a developer is building a portfolio. Basically, a portfolio is a way of showcasing work samples and skills stated in your resume.

One of the ways of creating a simple portfolio is using GitHub pages. This is a site hosting service that takes HTML, CSS and JavaScript files directly from a repo on GitHub. The good thing about GitHub pages is the fact that it is free as it supports custom domains, with deploys straight from Git.

Getting Started

Lets do this 💪🏻

Login to your GitHub account

Creating a project site.


With project sites, you get to use templates downloaded online or pick a theme from the settings on the repository.

Go to repository Settings and scroll down to the “GitHub Pages” section. Select “master branch” under the “Source”.

Add a theme to the portfolio to changeits look and feel

Choose the theme you want and then , Select Theme

You may be asked to edit your site`s README.md file
Your chosen theme will automatically apply to files in your repo.

Steps to create personal or organization site

You can work with the repo already created or create a new one.

Clone the repository.

create a folder where you want to store the project on your desktop and clone the new repository

~ $ git clone https://github.com/carolmusyoka18/carolmusyoka18.github.io

add index.html file

You can now create an index.html file in the project folder


~ $ cd carolmusyoka18.github.io
~ $ echo "Hello World" > index.html

Push the Repo

Add commit and push all your changes

`~ $ git add --all

~ $ git commit -m "Initial commit"

~ $ git push -u origin master
`

And you are good to go 😎🎉🎉

Check out your website https://username.github.io.

If you are deploying Github pages for the first time, you might need to wait for a while before you see the actual site. If you need to make any change to your portfolio, you can make them locally and push the changes as shown above. It is not advisable to make changes directly on the portfolio.

You can edit files directly on GitHub in any of your repositories using the file editor, which uses CodeMirror. You can check out this short tutorial to get it right

The secret is trying and practicing. With time you will, get pretty good at creating portfolios. Share your thoughts or ideas down below.

💖 💪 🙅 🚩
carolmusyoka
Carol Musyoka

Posted on November 27, 2019

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

Github and Git Workflow
github Github and Git Workflow

October 13, 2024

A Beginner’s Guide to GitHub
github A Beginner’s Guide to GitHub

October 19, 2024

Complete Git Cheat sheet
webdev Complete Git Cheat sheet

September 25, 2024

Forks in GitHub
git Forks in GitHub

September 19, 2024