DEV Community

Cover image for I build a Github Dark Theme inspired Portfolio
Unnati Bamania
Unnati Bamania

Posted on

I build a Github Dark Theme inspired Portfolio

I always wanted to build a unique portfolio for myself and was inspired by a lot of portfolios. Right since my first year of engineering I've build more than 6 portfolios but nothing was ever eye catchy and satisfying. Finally I came across some unique and eye catchy portfolios. I stumbled upon the idea of building one by using the Github Dark Theme.

One of them is Nitin's VS Code theme

The tech stack that I've used is:

  • NextJS
  • Tailwind CSS

Tools used:

  • Notion
    I've integrated Notion for storing the data of the contact form.
    If you want to integrate Notion to your contact forms please do refer to this article
    Integrate Notion in your contact form

  • react-github-calendar
    You can show your github heat map using the above library.

Github Dark Theme Portfolio

If you want to visit the live website you can visit to the following link:

https://unnatibamania.me

The source code for this project is as follows:

unnati2000/portfolio

Cover Page

Repositories

Projects

I would love to listen from you

If you have any suggestions or critics please do share your thoughts. I would love to make improvisations in this project. If you feel there was a need to add some more features please do share your thoughts in the comment section below.

Top comments (24)

Collapse
 
imsorx profile image
Sourabh Patel

Great Idea, but if I'm making a inspired portfolio I wouldn't have cloned whole design rather had taken bits and combine them with my sauce.

Btw I have taken GitHub usage to next level, on my portfolio sorx.space
I have been using content straight from my repos eliminating CMS 😁

Collapse
 
manojsai1 profile image
manojsai1 • Edited

Hey can you
share the source code pls ?

Collapse
 
imsorx profile image
Sourabh Patel

It's on my GitHub repositories under name sorx.space

Collapse
 
commentme profile image
Unnati Bamania

That is cool. Combination of several features can also take your project to next level. Your portfolio is awesome and unique.

Collapse
 
ful1e5 profile image
Kaiz Khatri

Cute 😍. Here is mine.

github

Collapse
 
commentme profile image
Unnati Bamania

Whoa! This is amazing! You added a lot of features. Cool.

Collapse
 
siddharthshyniben profile image
Siddharth

It looks awesome!

Does this use the GitHub API/GitHub Actions to load data? If not, you should set it up, otherwise you'll have to update the site on every change.

Collapse
 
commentme profile image
Unnati Bamania

Hey, Thanks a lot.
Yeah it uses Github API to load the data. Manual setup is a lot of pain. You can also checkout the github repository for reference.

Collapse
 
vishnusathasivam profile image
VISHNUSATHASIVAM

Good idea!

Collapse
 
commentme profile image
Unnati Bamania

Thanks

Collapse
 
krishnavasudev profile image
Debraj Bhal

Great one! But it's breaking a little in my phone though.

Collapse
 
commentme profile image
Unnati Bamania

Hey thanks! I tried to make it responsive. Actually the styling of links is little complex so maybe due to that reason it might be breaking on your phone.

Collapse
 
msc24x profile image
Maninderpal Singh

Cool! For some time I thought it was the real github account. Going to give it your own touch?

Collapse
 
commentme profile image
Unnati Bamania

As of now I don't have plans to give my own touch. But in future I'm plannig to make some changes. If you wish to make some, clone the repository and feel free to give your own touch!

Collapse
 
dkhd profile image
Diky Hadna 💡

Nicely done!

We took a different path since I myself love simple design. Check mine at hadna.space

Collapse
 
commentme profile image
Unnati Bamania

Hey Diky, thank you very much!

Your portfolio seems pretty impressive. Simple and elegant design.

Collapse
 
rhythm28 profile image
Rhythm Bhatia

Very creative

Collapse
 
commentme profile image
Unnati Bamania

Thank you very much! I really wanted to build something like this.

Collapse
 
bmassioui profile image
Bouchaib MASSIOUI

Hi, can you share the code source ?

Collapse
 
commentme profile image
Unnati Bamania

Hi, its available on github.com/unnati2000/portfolio

Collapse
 
poboisvert profile image
poboisvert

Here is mine (if it inspires some) github.com/poboisvert/PortfolioReact

Collapse
 
commentme profile image
Unnati Bamania

Cool!