How to Host Your Personal Portfolio Using GitHub Pages

  • Thread starter Thread starter wizziee
  • Start date Start date
W

wizziee

github-pages-examples.pngIn this era of technology, having a professional portfolio is essential for both academic and career advancement. As we move forward with modernization, our digital footprints become more significant every day. While reading this, you’ve probably guessed what I’m about to suggest — exactly, in today’s blog, I will demonstrate how to host a personal portfolio using GitHub Pages as your hosting platform.



Before we dive into the technical steps, let me introduce myself. I am Raiyan Bin Sarwar, a third year CSE undergraduate student at Bangladesh University of Professionals. Currently, I’m also a Microsoft Student Ambassador (Beta).



Now, let’s move forward with the steps to help you create and host your own personal portfolio using GitHub Pages. The method I’ll share here is beginner friendly, so you don’t need any prior coding experience to follow along.



Step by Step Guide to Hosting a Portfolio Using GitHub Pages



Step 1: Create a GitHub Account​


To get started, you’ll need a GitHub account. If you already have one, you can skip this step. If not, follow these instructions:

  • Visit GitHub and sign up using your email address.
  • Complete your profile by following the simple setup instructions provided.

Step 2: Create a New Repository​

  1. Once you’re logged into GitHub, click the "+" button at the top-right corner of your screen, and select "New Repository".
  2. Name your repository as your-username.github.io (replacing your-username with your actual GitHub username). This is important as GitHub recognizes this specific naming format to host your portfolio.
  3. Ensure the repository is set to Public and check the box to "Add a README file".
  4. Finally, click "Create repository" to set it up.

Step 3: Customize Your README (Portfolio Content)​


The README.md file is where you’ll place the content for your portfolio. GitHub Pages uses Markdown language to structure content, so you can format text easily using it.

  1. Navigate to the repository you just created, and click on the README.md file.
  2. Click the pencil icon to edit the file.
  3. Now, you can add your portfolio content. Here's a basic example:

Code: 
# Raiyan Bin Sarwar
Welcome to my personal portfolio! I’m a third-year CSE undergraduate at Bangladesh University of Professionals and a Microsoft Student Ambassador (Beta).

## About Me
I have experience in cloud computing, low-code platforms, and technology communities.

## Skills
- Cloud Computing
- GitHub & Git
- Microsoft Power Platform

## Contact
You can reach me at [LinkedIn](https://www.linkedin.com/username) or [GitHub](https://github.com/username).



Once you’ve written your content, click "Commit changes" to save it.



Step 4: Enable GitHub Pages​


Next, you’ll need to enable GitHub Pages to host your portfolio.

  1. In your repository, click on Settings at the top.
  2. Scroll down to the GitHub Pages section.
  3. Under Source, select main (or master) from the dropdown menu and click Save.
  4. After enabling GitHub Pages, you’ll receive a live URL for your portfolio, which will be in the format [URL]https://your-username.github.io/[/URL].



Step 5: (Optional) Customize Your Portfolio with a Template​


To make your portfolio look more appealing, you can choose a theme from GitHub’s collection:

  1. Visit GitHub Pages Themes and select a theme you like.
  2. Go back to the Settings of your repository and scroll to the GitHub Pages section.
  3. Click on "Choose a theme", pick your desired theme, and apply it by clicking "Select theme".
  4. Once selected, commit the changes to apply the theme to your portfolio.

Sharing some necessary resourced that you may like:

1. Create and host web sites by using GitHub Pages - Training

2. Upload your project by using GitHub best practices - Training



Final Thoughts​


By following these steps, you will have successfully hosted your personal portfolio using GitHub Pages without needing any prior coding experience. As you get more comfortable with GitHub, you can further enhance your portfolio by adding new sections, showcasing your projects, or even diving into custom HTML and CSS for advanced customization.

Building a digital presence is key to standing out in today's competitive environment. A personal portfolio not only highlights your achievements but also serves as an online resume, making it easier for potential employers or collaborators to learn more about you.

Continue reading...
 
Back
Top