DEV Community

Cover image for GitHub Profile Glow-Up: From Basic to Portfolio in 6 Steps
Mubashir Mohamed
Mubashir Mohamed

Posted on Originally published at Medium

GitHub Profile Glow-Up: From Basic to Portfolio in 6 Steps

#github #career #beginners #webdev

Recruiters and clients open your GitHub before they reply, so make it read like a portfolio, not a code dump. These 6 steps take one weekend.

Before vs after

The code stays the same. What changes is that a visitor can see who you are, what you’ve built and how to reach you in under 10 seconds. The example below uses a made-up developer, Sam Rivera (sam-builds).

Before: Default avatar, no bio, no README, forked tutorials pinned and an almost empty contribution graph.

After: Photo, headline bio, complete sidebar, profile README, six real projects pinned and steady activity.

Basic profile → portfolio profile

  • Avatar: default identicon → a clear, friendly photo
  • Header: username only, no bio → name + one-line headline: role, stack, focus
  • README: none → 3-line intro, grouped stack, project table, contact
  • Pinned repos: forks, tutorials, test-repo, Untitled-1 → 4–6 shipped projects with descriptions
  • Sidebar: empty → company, location, website, LinkedIn, email
  • Takeaway: “Hard to tell what they do” → “Full-stack dev who ships SaaS tools, open to work”

The 6 steps

1. Create a repo named exactly your username

Go to github.com/new and name the repository the same as your username (for example sam-builds/sam-builds). Make it public and tick Add a README file. GitHub shows this README at the top of your profile page, so it becomes your landing page.

2. Open with a 3-line intro

Say who you are, what you do, and what you’re open to. Keep it to three lines so it fits above the fold.

README.md

# Hi, I'm Sam
**Full-Stack Developer** · Remote
Open to: freelance + full-time roles
Enter fullscreen mode Exit fullscreen mode

3. Group your stack, skip the badge wall

Four short lines grouped by area are easier to scan than 40 logo badges. List only what you’d be happy to be hired for.

README.md

## What I work with
**Frontend** · React, Next.js, TypeScript, Tailwind
**Backend** · Node.js, Express, PostgreSQL
**Mobile** · React Native (Expo)
**Delivery** · GitHub Actions, Vercel, Docker
Enter fullscreen mode Exit fullscreen mode

4. Show what you’ve built

Add a table with one row per project: name, what it does in plain words, the stack, and links. A live demo link gets clicked far more often than a code link, so add one wherever you can.

README.md

## Things I've built
| Project | What it is | Stack |
| --- | --- | --- |
| **Shiftly** · [live](https://example.com) · [code](https://github.com/sam-builds/shiftly) | Shift scheduling for small cafes and clinics | Next.js, Postgres |
| **Invoicely** · [live](https://example.com) · [code](https://github.com/sam-builds/invoicely) | Quotes to invoices for freelancers | React, Node, Stripe |
Enter fullscreen mode Exit fullscreen mode

5. Fill the sidebar

Open Settings → Public profile and fill in every field:

  • Photo: a clear headshot, not the default identicon
  • Name and bio: a one-line headline, such as Full-Stack Developer · React, Node, Postgres · Building SaaS tools
  • Company, location, website: add “Open to remote” next to your location if it applies
  • Social accounts: LinkedIn at minimum
  • Public email: so people can contact you without searching

6. Pin your best, archive the rest

Pin 4–6 repos you’d show in an interview, each with a one-line description. Archive old tutorials and test repos from each repo’s Settings → Archive this repository. Archived repos stay public and read-only, so nothing is lost, but they stop competing with your best work.

README template

Paste this into your username/username README and replace the sample details with your own.

README.md — full template

# Hi, I'm Sam

**Full-Stack Developer** · Lisbon · Open to remote

I build web and mobile products for startups and small teams.

**Open to:** freelance projects and full-time roles.

## What I work with

**Frontend** · React, Next.js, TypeScript, Tailwind
**Backend** · Node.js, Express, PostgreSQL
**Mobile** · React Native (Expo)
**Delivery** · GitHub Actions, Vercel, Docker

## Things I've built

| Project | What it is | Stack |
| --- | --- | --- |
| **Shiftly** · [live](#) · [code](#) | Shift scheduling for small cafes and clinics | Next.js, Postgres |
| **Invoicely** · [live](#) · [code](#) | Quotes to invoices for freelancers | React, Node, Stripe |
| **PantryPal** · [code](#) | Tracks groceries and expiry dates | Expo, Supabase |

## Work with me

Freelance MVPs, dashboards and React Native apps.
Email: hello@samrivera.dev · [LinkedIn](#) · [Website](#)
Enter fullscreen mode Exit fullscreen mode

Checklist

  • Repo named exactly after your username, with a README
  • 3-line intro: who, what, open to
  • Stack grouped into 3–5 lines
  • Project table with live and code links
  • Photo, headline bio, location, website, LinkedIn, email
  • 4–6 best repos pinned, each with a description
  • Old tutorials and test repos archived

Originally published on Medium in CodeToDeploy.

Top comments (0)