DEV Community

loading...

Create your developer landing page with GitHub Pages πŸŽ‰

flexdinesh profile image Dinesh Pandiyan ・2 min read

Developer Landing Page with GitHub Pages

All of us devs, at one point or other, would have wanted to have a personal website of our own, either to showcase our online presence or just 'coz it's fun. So here, I present you a ready-made Developer Landing Page

Usually creating a personal website would involve buying/registering a domain name, finding a free/paid hosting service, developing your site and uploading it to the hosting provider.

But with GitHub Pages, publishing your site is as easy as drinking a coffee.

  • You need a GitHub account (you obviously have one already)
  • Create a new repo with the name {username}.github.io
  • Clone the repo and create an index.html file
  • Add some content and git push

Voila! Your site should be live at https://{username}.github.io in seconds.

Developer Landing Page

I wanted a Dev Landing Page to showcase everything I do online. And I wanted it to be minimal and right to the point rather than beautiful and hefty. So I sat down one night and created this Dev Landing Page.

Few of my friends liked it and I created the same in a few different themes for them.
And I think for most of the devs out there would like to have something similar. So if you're not looking for something fancy and like this minimal Dev Landing Page, feel free to fork/clone and customize it to your dev taste.

You can pick from one of these 9 material themes or change the colors it to suit your taste 'coz it's just too easy.

9 Material Themes

Here's my Dev Landing Page - Dinesh, shining bright in my favourite yellow! πŸŽ‰

You are amazing! Have a great day! ✨

Discussion (25)

pic
Editor guide
Collapse
jess profile image
Jess Lee (she/her)

I'll just not-so-subtly leave this here: dev.to/p/badges
πŸ˜ƒ

Collapse
flexdinesh profile image
Dinesh Pandiyan Author • Edited

If you check my site, you'll find the badge in there already :D

I'm gonna add this to the boilerplate tomorrow!

Although I'd suggest to build a scalable, colorable version of the badge. 'Coz, I colored the badge by getting its svg code and adding it to the page.

Collapse
jess profile image
Jess Lee (she/her)

Ah, awesome!!

Collapse
tomscholz profile image
Tom • Edited

You should check out gitshowcase.com . it's free and they provide support for custom domains

Collapse
baaaarch profile image
BVΠ―CH

Nice! Here's mine bvrch.github.io/

Collapse
guergana profile image
Collapse
flexdinesh profile image
Dinesh Pandiyan Author

I see you've added your own flavor to the theme. Looks splendid ( :

Collapse
rogergcc profile image
Roger

Hi friends this is mine rogergcc.github.io/

And Nice. keep it up

Collapse
dance2die profile image
Sung M. Kim

I clicked on the background and boom πŸ’£, the theme changes :)

Collapse
devdess profile image
Sylvain Dessureault • Edited

Hi! I'm joining the ranks: devdess.github.io
Thank you Dinesh!

Collapse
flexdinesh profile image
Dinesh Pandiyan Author

Looks fantastic. Congrats on building your first portfolio. Many more to come.

Collapse
devdess profile image
Collapse
algadug profile image
AL-GaDuG

Thanks...I did mine danieltareke.github.io/ based on your steps.

Collapse
flexdinesh profile image
Dinesh Pandiyan Author

Looks great Daniel!

You could also remove the unused brand icons (freecodecamp, medium, behance and codepen) and make your page even more precise.

Collapse
tiagat profile image
Collapse
jsalvador profile image
Juanjo Salvador

Hello Dinesh! Great job!

Collapse
rahulbaisla profile image
rahulbaisla

This is amazing Dinesh !!!!

I will make my dev landing page soon. You are awesome :)

Collapse
juanitourquiza profile image
Collapse
flexdinesh profile image
Dinesh Pandiyan Author

Looks fantastic πŸŽ‰

Collapse
jtpatil profile image
Collapse
adityaekbote profile image
Aditya Ekbote

So cool!!!

Collapse
pas4gok profile image
indcit

This is nice stuff !!

Collapse
nitendragautam profile image
Nitendra Gautam

I tried this on my page nitendragautam.com

Collapse
nguyenquangtin profile image
Collapse
nguyenquangtin profile image