DEV Community

Cover image for Hosting Your Resume Website on GitHub: A Step-by-Step Guide
Oladosu Ibrahim
Oladosu Ibrahim

Posted on

Hosting Your Resume Website on GitHub: A Step-by-Step Guide

#git #github #linux #cloudcomputing

Introduction

Version control isn’t just for professional developers, it’s a powerful tool for anyone who wants to showcase their projects online. With Git and GitHub Pages, you can turn a simple HTML file into a live website in minutes.

In this guide, we’ll walk through how to:

  • Configure Git with your username and email.
  • Initialize a Git repository and create your first HTML file.
  • Push your project to GitHub.
  • Host your resume website using GitHub Pages.

By the end, you’ll have your resume running as a personal website, accessible to anyone with the link.

Skilling Objectives

You will learn how to:

  • Set up Git with your global configuration (username and email).
  • Create a new project directory and initialize it with Git.
  • Add and commit files using Git commands.
  • Push your repository to GitHub.
  • Deploy a simple HTML file as a live website using GitHub Pages.

Step 1: Configure Git

Before creating a project, you need to configure Git with your identity. This ensures your commits are properly linked to your account.

git config --global user.name "Sudais@1998"
git config --global user.email "oladosuadeniyi39@gmail.com"
Enter fullscreen mode Exit fullscreen mode

Image1

Step 2: Create a New Project Directory

Create a folder for your resume project, navigate into it, and initialize Git.

mkdir sudaisdirectory
cd sudaisdirectory
git init
Enter fullscreen mode Exit fullscreen mode

Check that Git has been initialized by listing hidden files:

ls -al
Enter fullscreen mode Exit fullscreen mode

Step 3: Add an HTML File

Create your main HTML file:

touch index.html
vi index.html
Enter fullscreen mode Exit fullscreen mode

Image2

Inside vi, press i to enter insert mode and paste your HTML code.
When done, press Esc, then type:

:wq
Enter fullscreen mode Exit fullscreen mode

Image3

This saves and quits the editor.

Step 4: Connect to GitHub

Now, go to your GitHub account and create a new repository (e.g., my-resume). Copy the repository link and connect it to your local project:

git remote add origin https://github.com/Sudais1998/my-resume.git
Enter fullscreen mode Exit fullscreen mode

Image4

Step 5: Commit and Push Your Project

Add your files to Git’s staging area, commit them, and push them to GitHub:

git status
git add .
git status
git commit -m "new commit"
git push origin master
Enter fullscreen mode Exit fullscreen mode

Image5
Image6

Step 6: Deploy with GitHub Pages

  1. On GitHub, go to your repository and select master.
    Image7

  2. Select index.html to view the code
    Image8

  3. Click on the Settings tab.

  4. Scroll to Pages.

  5. Under “Source,” select the master branch and save.
    Image9

  6. Once deployed, GitHub will provide you with a live link.

  7. Select visit site or click on the link
    Image10

Step 7: View Your Resume Website

  • Open the GitHub Pages link.
  • Your index.html file should now be live as a personal resume website. Image11

Conclusion

In this hands-on guide, you’ve learned how to:

  • Configure Git with your identity.
  • Create a project and version-control it locally.
  • Push your repository to GitHub.
  • Deploy a static site with GitHub Pages.

This is a beginner-friendly yet professional way to publish your resume or portfolio. With this foundation, you can expand your project to include more HTML pages, CSS styling, or even JavaScript features, making your personal website stand out.

Top comments (0)