/How-to-Create-a-GitHub-Portfolio

How to create a GitHub portfolio to showcase your projects

πŸ“š How to Create a GitHub Portfolio

Hi, I'm Katie! πŸ™‹πŸ»β€β™€οΈ This is a fuss-free guide to create your GitHub portfolio.

It's perfect for

  • Beginners in data science looking to showcase samples of work, or projects.
  • Serves as a digital resume to demonstrate your technical skills.
  • A fun way to track of your projects.

Why I created this repo?

  • I used to find GitHub intimidating. When I first signed up in March 2021, I didn't understand how it worked and ended up leaving it aside.
  • However, since then, I've become quite obsessed with writing in Markdowns πŸ˜† and have learned how to use it. Now, I'm excited to share this knowledge with everyone. πŸ™‚

Table of Contents

Introduction

Let's start by understanding some of the terms you'll come across on GitHub:

πŸ“Œ Repository (or repo for short) means folder. It's similar to creating folders on your computer with each repository representing one folder. You can create multiple repositories for different projects.

πŸ“Œ README.md is a default note or summary that's usually included in each repo. It acts as the "homepage" of your repo where you can introduce the project, provide a summary, or anything else - so feel free to write it.

πŸ“Œ Fork means copy + paste in layman's terms. Let's say you want to make a copy of this guide, have access to it, and edit and play around with the codes. You can do it! Any changes you made in your copy of the file won't be reflected in this guide. I'll show you how to do it below.

You don't need to download the GitHub Desktop to set up your portfolio. Your browser will do the job just fine. πŸ™‚


How to Create Your Profile on GitHub?

Interested in creating a personalized profile that appears on your GitHub homepage, just like mine? Follow these simple steps:

Screenshot 2021-09-28 at 9 26 28 PM

Step 1: Click on + sign and select New Repository at the top right corner of the page.

image

Step 2: Create a new repository with the exact same name as your username.

For instance, my GitHub username is "katiehuangx", so I created a new repository named "katiehuangx". This repository will contain the write-up of your profile.

Screenshot 2021-09-28 at 6 15 33 PM

The file format for the profile is Markdown (.md). By default, the name of the file is README.md, so you can leave it as it is.

Screenshot 2021-09-28 at 6 18 40 PM

Step 3: To edit your Profile or Markdown file, click on the pencil ✏️ icon on your right and select Edit this file.

Screenshot 2021-09-28 at 10 29 37 PM

Now, start writing your profile! πŸ˜„ Once you're done, scroll down and click Commit changes.

πŸ“ What to write in Your Profile?

To create an engaging profile, you can include the following elements:

  • A brief introduction of yourself.
  • Your skills, such as data analysis, SQL, Python, Tableau, web development, etc.
  • Advanced features like visitor counts, clickable icons, etc. (Note: you may need to do some research to learn how to implement these features)
  • Your projects that you're proud of

For further reading, you can check out the following resources:


How to Customize Markdown files?

GitHub's Markdown guides are comprehensive and easily understandable. Here are some resources to help you customize your Markdown files:


🌌 To Add Images

Here's how I add an image to a Markdown file:

  1. Take a screenshot or download the image.

  2. Copy the image file and paste it in the Markdown file. Wait for 3-5 seconds to let the image load.

image

Uploading screenshot...

image

Successfully uploaded screenshot!

image

  1. Use the <kbd> tag to display the image in a framed box.
  2. Click on the Preview button to check the newly uploaded image.

Screenshot 2021-09-29 at 5 58 48 PM


πŸ“š To Add a Table of Contents

To add a table of contents, the following code block can be used:

## Table of Contents
- [How to Create Your Profile?](#how-to-create-your-profile)
- [How to Customize Markdown files?](#how-to-customize-markdown-files)
- [How to Create New Repository?](#how-to-create-new-repository)

Note that the links in the table of contents may not work in Preview. You need to Commit changes to check if the links work.

To get the correct (#xx-xx-xx) for each section:

Click on the chain logo next to the section title, right-click and open in new tab. Screenshot 2021-09-29 at 6 04 22 PM

Then, navigate to the website link, scroll to the end, and copy the highlighted ##xx-xx-xx. Screenshot 2021-09-29 at 6 04 57 PM

Ensure that emojis are not included in the title, as they may cause issues with the links in the table of contents.

Note that the links in the table of contents may not work in Preview. You need to Commit changes to check if the links work.


🧱 Colour Code the Code Blocks

If you've seen my 8 Week SQL Challenge repo, I use colour codes to highlight my SQL syntax. It's a simple technique, but it can make your code look much more professional.

To use color codes in your code blocks, follow these steps:

```sql -- Add 3 backticks followed by sql
SELECT *
FROM student_info
WHERE student_name = 'Katie';
``` -- Add 3 backticks

This is how it will turn out:

SELECT *
FROM student_info
WHERE student_name = 'Katie';

How to Create New Repository?

Creating a new repo is as easy as creating your profile.

Step 1: Click on New Repository at the top right of the page.

image

The image below is the default setting. If you forgot to tick Add a README.md, you can create the file separately in the repo later.

Screenshot 2021-09-28 at 9 55 20 PM

And, it's done. You have created your first repo! 😎


How to Create Subfolders in your Repository?

Step 1: Navigate to the right side of the page. Click Add File and Create New File.

Screenshot 2021-09-28 at 10 41 20 PM

Step 2: Name your file followed by the extension .md, or your desired format.

Screenshot 2021-09-28 at 10 42 05 PM


How to Upload Projects in your Repository?

Step 1: Navigate to the right side of the page. Click Add File and Upload File.

image

Step 2: Choose your file, wait for file to load completely and click Commit changes

Once your file is uploaded completely, it will look like the one in my screenshot below. Bigger file size would take a longer time to load. πŸ™‚

Screenshot 2021-09-29 at 6 19 34 PM

And, that's it! It's as simple as that!


How to Fork a Repository?

Let'say I'm checking out this awesome repo and I'm curious to see how he adds the icons, Twitter button, and all the cool stuffs.

Screenshot 2021-09-30 at 10 50 08 AM

Step 1: Click on the fork🍴 icon at the top right of the page

Screenshot 2021-09-30 at 10 52 45 AM

Step 2: It's done!

GitHub has forked and copied the repo and added it as one of your repo. Now, you can edit the file and learn how to add those fancy, cool stuffs too!

Screenshot 2021-09-30 at 10 50 44 AM

Feel free to fork this guide and see how I've written it too! πŸ˜„πŸ™ŒπŸ»


Now go and have fun creating your Github profile and start adding projects!

If you like this guide, please give this repo a Star 🌟 Happy GitHub-ing! πŸ™†πŸ»β€β™€οΈ