How To Build A Simple Developer Portfolio To Get Hired

Tyler Maran — Wed, 27 Apr 2022 15:14:45 +0000

Published with more detail / pictures here:
https://blog.rysolv.com/how-to-build-a-simple-developer-portfolio-to-get-hired

How To Build A Simple Developer Portfolio To Get Hired

TLDR:

You have less than 10 seconds to stand out. Make it count.
Keep your projects awesome and your profile simple.
No one is impressed by templates.
Avoid useless UI elements.

There are lots of reasons to build a personal website. It's an opportunity for you to share your interests and creations with the world. And if you want to have a crazy colorful animated profile, then go ahead!

BUT if you are specifically trying to land a job, then you'll want to think of your portfolio as more of a resume than an art project. It should be clean, concise, and parsable in less than 10 seconds.

What should a portfolio include?

1. The best way to contact you

This one is pretty obvious. Include your email somewhere on the page. And don't make me scroll to the bottom to fill out a "Contact Me" form.

2. One interesting sentence about yourself

✔ "I am super passionate about technology, mountain biking, and fermenting food."

❌ "I am a Full Stack Software Engineer experienced in Django, Express.js, CodeIgniter, Go, React.js, Vue.js, jQuery, React Native, MySQL, PostgreSQL etc and developed many projects Custom ERP Solutions, Trabil, Inventory Management System, Accounting Management System, Social Sites, Ecommerce Platforms etc. I'm a problem solver, and I know the full development cycle from development to deployment."

These are both real examples of applicants I've seen. And obviously I reached out to ask about the fermented food.

3. One or two quality work examples

Pick one or two high quality projects you've completed.

Quality > quantity. This is not the place to include the tic-tac-toe game you made in your bootcamp.
Include a link to the live site.
If you include a repository link, make sure it has a README.

✔ Built with Python/Django/React. Worked on a 10 person team.

❌Manage overall functions related to the enhancement of web experience from conception/ideation through specifications, design, and development. Triage and research bug tickets raised by customers, while identifying issues via SQL queries, debugging client/server code, and formulating needed adjustments.

Write a bit about the tools, process, and team. But as with everything else, keep it simple. Check out Quentin Durand https://mcquint.com for an example of simplicity and high quality design.

4. A PDF resume

Can't avoid it. Lots of large companies require a PDF for their Applicant Tracking System.

5. Meta Tags

This one is often forgotten! Chances are your profile will be shared around on Slack, LinkedIn, Discord, etc. All of these services use the <meta> tags to create link previews.

I can't count the number of times I've seen this exact exact preview:

Here is an example of properly formatted meta tags. Just copy paste this into your profile:

<!-- Base meta tags -->
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="MY_TAG_LINE" />
<meta name="language" content="english" />
<meta name="title" content="MY_NAME" />
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, maximum-scale=1.0, user-scalable=2">

<!-- OpenGraph -->
<meta property="og:description" content="MY_TAG_LINE" />
<meta property="og:image" content="SOME_PICTURE" />
<meta property="og:site_name" content="MY_NAME" />
<meta property="og:title" content="MY_NAME" />
<meta property="og:type" content="article" />
<meta property="og:url" content="MY_URL" />

<!-- Twitter -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:description" content="MY_TAG_LINE" />
<meta name="twitter:image" content="SOME_PICTURE" />
<meta name="twitter:title" content="MY_NAME" />

DEV Community: Tyler Maran

How To Build A Simple Developer Portfolio To Get Hired