DEV Community

loading...

Building perfect portfolio

brainbuzzer profile image Aditya Giri ・4 min read

Building a developer portfolio is one of the most daunting tasks. Where do you start? What do you need in your portfolio?

A portfolio just like one for designers is a website that showcases all the work you have done.

Why do you need a portfolio?

Well, you already have a resume, and a LinkedIn profile, isn't that enough? While both of them are important, a portfolio has much more to it.

If your projects are a monument, A resume and a LinkedIn profile are like the broachers you get at the gates of the monument when you visit them, a bunch of screenshots, external links, and that's it. A portfolio, on the other hand, is more like a guided tour of your projects. Where you show (rather than just state) your skills. A portfolio lets you highlight the most impressive and important parts of your projects, stuff that isn't visible at the first glance, or things that you are really proud of.

So how do you build a decent portfolio?


Curating the projects.

Go deep not wide.

A portfolio is meant to be a showcase, a showcase of your best work and not an exhaustive list of all your work. Nobody will spend time looking at more than 3-4 projects. If you make it an exhaustive list, chances are a potential employer would end up looking at one of the least impressive ones.

Pick 4 projects that best represent your skills, and if you really want to include more than that consider putting up an archive link to all the other projects.


Make it Personal

The portfolio should reflect your personality. Avoid generic terms and language, you are making your personal portfolio, not a template for mass use. So make sure it reflects you!

Tell your story, include information that shows the human whose work they are looking at.

Be a tour guide

When it comes to the project description pages, guide the reader through the most important aspects of your projects, show them the challenges you went through, how the project came into being, highlight the sections that you are really proud of. Tell the story of your journey while working on the projects, the difficulties, the way you resolved them, what new things you came across, everything. Your project description pages should convey to employers that you're competent and enthusiastic.

Good UX/UI

Obviously, every website needs a decent UX/UI. Even if you are not a designer, it still matters that your portfolio site has a good design and aesthetic.

Domain and Hosting.

A portfolio site should probably be a static site and if possible prefer buying a domain for your portfolio site, eg yourname.com.

Make sure your portfolio follows accessibility standards.

General Layout

Obviously, the layout of your portfolio depends on your own designs and templates that you use, but let's talk basics, what are the most basic elements that every portfolio has.

  • An About me section
    • A small about me section that highlights your personality and your background.
  • A list of projects
    • a curated list of the projects you have worked on, with each project having a link to a project page that talks more about the project.
  • Contact Information.

About the Project description pages, while it is a tricky and time-consuming thing to build decent project description pages. Nevertheless, these pages are important.

Here's a template drawn by Josh Comeau in his book "Building an effective dev portfolio" for the project description pages to give you a better idea.

Introduction

  • High-level summary of what the project is
  • List of core functionalities / interesting features
  • Your role in the project.
  • Technologies used
  • Links to live demo + source code (if applicable)

Purpose and Goal

  • Why did you build this project? Why is it important to you?
  • What was the expected outcome of the project?
  • What were the initial designs?
  • Any other preliminary planning that you did which helps build a narrative

Spotlight

  • What is the “killer feature” of your project?
  • What were the technical hurdles that got in your way? Any major problems you hit during development?
  • How did you solve those problems? What was the solution? Go deep here, and write with a developer in mind.

Current status

  • This section is optional. If the project is actively being used by real people, talk a little bit about the current status, who uses it, why they use it, what they say to you about it, stuff like that.
  • If the project was contrived specifically for the portfolio, omit this section.

Lessons Learned

  • What did you learn doing this project? Feel free to list multiple things. Also, feel free to cover non-technical lessons. It’s great to talk about how you learned to use an advanced feature of a framework or library, but it’s just as valuable to talk about the project-management experience or things you learned about shipping projects.
  • If you used a framework or other libraries/tools, was it a good choice? How did it help? In which ways was it insufficient?
  • Is your project accessible? What did you learn about accessibility, while building this project? Describing how you tested your project using keyboard navigation or a screen reader can make for a really compelling story!
  • How has this affected the work you’ve done since then? Real examples of how this project built your knowledge for future projects are fantastic.

In summary,

  • Your Portfolio site should have a decent enough UI/UX
  • Make sure it reflects your personality and the content isn't generic.
  • It should have a minimum general layout with an About me section and a Project details list.
  • Make sure your portfolio follows accessibility standards.
  • Use a domain custom domain.
  • Connect your social media profiles and blogs.

Are you looking to create a portfolio but don't know where to start? Hyperlog was made with just that use-case in mind. It allows you to build a portfolio according to your style while giving you the ability to add cool pluggable and themes to your project. Connect your repositories and get your code analyzed. The best part, you can get your portfolio on the WWW in under 5 minutes. Get custom domains, website analytics, and much more.

You focus on the code, we do the rest.

Discussion (9)

pic
Editor guide
Collapse
jonrandy profile image
Jon Randy • Edited

You don't need a portfolio site. I've been a professional developer for 25 years. Never had one, never needed one, and a portfolio site from a potential hire has never once influenced my decision (in a positive way) to hire them.

Collapse
crfries profile image
crfries • Edited

I disagree. You have 25 years in the game. No… YOU don’t need one. As a self taught junior developer I do need one. Without one potential employers won’t even look at me. I’ve had employers tell me that. It’s not the same as it was when you started.

Collapse
jonrandy profile image
Jon Randy • Edited

I'm 100% self-taught too - from the age of 7. I'm coming at this from both sides - as an employer, and as a developer. The developers I have interviewed who have had a portfolio (a minority) have fared no better than the ones without, and in some cases it has actually counted against them (demonstrating use of inappropriate technologies for a project, and poor code).

I've never once required for a portfolio from a candidate, or worked for/seen a company that does.

Thread Thread
digdug profile image
Dig-Dug

U started at 7...self taught. Interesting. I was watching cartoons and playing. Are your parents doctors or tech-related? Just curious.

Thread Thread
jonrandy profile image
Jon Randy

This was back in 1983. My dad (he's had various tech-related jobs, eventually moving in a more logistics direction... but he was never a full-on programmer to my knowledge) bought us a ZX Spectrum 48K home computer. When we first got it, it didn't come with much software (very few games) and I couldn't afford to buy games. It did however, come with an in-built programming language (BASIC) - you were essentially inside a REPL interface as soon as you switched the thing on (after setting it up and plugging it into the TV). It also had a printed manual for the language with lots of well written examples for beginners. My dad encouraged me to give it a go and I got hooked... just changing little bits of the sample programs at first to see what happened - then eventually writing my own stuff. Computer magazines at the time contained printed listings to type in and try - which also was a great boost for ideas and learning

Thread Thread
digdug profile image
Dig-Dug

Nice. I started with "logo" and something called MS-DOS (can't remember a thing) cheers

Collapse
brainbuzzer profile image
Aditya Giri Author

Yes, agreed. The portfolio shouldn't be a barrier for any developer. That's why we are building Hyperlog.

Collapse
jonrandy profile image
Jon Randy • Edited

You say you agree, and then tell me you're building a site where you can build a portfolio - which you just agreed is a non-necessity. OK 🤔

Thread Thread
brainbuzzer profile image
Aditya Giri Author

My communication may have been received wrongly. I agree that you don't need a portfolio site to get hired. And a developer should not be focused on building one. We remove that friction completely.