DEV Community

Cover image for What If Your GitHub Profile Was a Building in a City of Developers?
Harsh Raj Mishra
Harsh Raj Mishra

Posted on

What If Your GitHub Profile Was a Building in a City of Developers?

I was going through something on the internet a few days ago and I had to stop to think.

Not another AI tool.

It is not a different productivity app.

And yet a curious and unusual thought.

One of them transformed the developers of GitHub into the buildings within a city.

Of course I had to check it out.


The First Thing I Saw

At the moment the page loaded, I was staring at a skyline made of pixel-art.

Buildings everywhere. Some small. Some massive skyscrapers. Some glowing with lights.

Initially it just appeared to be a game setting.

I then came to think of one interesting thing.

A real GitHub developer was used to represent each building.

And it was not just the size of the buildings.

They were formed from real GitHub activity.

This is when the idea came together.


Your Code Becomes Architecture

The initiative is known as Git City.

Rather than presenting your GitHub statistics in the form of charts or graphs, it transforms them into a structure within a virtual city.

What you do on GitHub influences the appearance of your building.

For example:

  • More contributions create taller buildings
  • More repositories make the building wider
  • Popular projects can influence lighting
  • Recent activity can create glowing effects

Developers who contribute a lot may appear as huge skyscrapers in the city.

Developers who contribute less may appear as smaller buildings.

It is a simple concept but surprisingly satisfying to see your coding activity turn into something visual.


Exploring the City

The best part is that you are not just looking at a picture.

You can actually explore the city.

You move around and discover different buildings. Each building represents a developer profile.

When you open one, you can see things like:

  • GitHub stats
  • repositories
  • achievements
  • developer information

Instead of scrolling through profile pages, it feels like you are walking through a city built by developers.

At one point I found myself just flying around looking for the tallest buildings.


A Little Bit of Gamification

Git City also adds some playful features.

Developers can unlock things like:

  • achievements
  • building decorations
  • visual effects

These features do not affect GitHub itself. They simply make the city more fun.

It gives a small sense of progression as your building grows with your GitHub activity.


The City Can Even Show Live Coding Activity

There is also a VS Code extension connected to the project.

When you are coding, your building can appear active inside the city.

Sometimes it glows or shows activity signals.

It does not share your code. It only sends minimal activity signals.

But it makes the city feel like a place where developers are actually working in real time.

Almost like a digital city of programmers.


The Tech Behind It

From a developer perspective, the project is also technically interesting.

The stack includes:

  • Next.js
  • React
  • React Three Fiber with Three.js
  • TypeScript
  • Supabase

Three.js allows the platform to render the city and keep everything interactive.

It is a good example of how modern web technologies can create experiences that feel almost like small games inside the browser.


A Quick Reality Check

GitHub activity does not always equal skill.

Some developers commit frequently. Others contribute less often but build very impactful projects.

So this visualization should be seen as something fun and experimental, not a ranking system.


Try It Yourself

If you want to see how your GitHub profile would appear as a building, you can visit:

👉 https://www.thegitcity.com/?ref=harshify

It only takes a moment to generate your building.

Seeing your coding activity turn into architecture is surprisingly satisfying.


Final Thoughts

GitHub has always been full of numbers. Commits, repositories, contribution graphs.

Git City turns those numbers into something visual.

A skyline built from developer activity.

And when you explore it, you realize something interesting.

Every building in that city represents someone somewhere writing code.

Top comments (0)