Frontend Engineer Portfolio Checklist: What Actually Moves the Needle

Frontend Engineer Portfolio Checklist: What Actually Moves the Needle

Most frontend portfolios are forgettable. Same template, same generic projects, same skill bar charts. None of that helps a hiring manager remember you a week later.

This is the checklist I’d run my own portfolio against, and the things I think are usually wasted effort.

The essentials (you must have these)

• A clear one-line description. Within three seconds of landing, a recruiter should know what you do. “Frontend engineer building React/Next.js products” beats “creative developer & designer”.
• Three to four real projects. Not ten. Three or four with substance beats ten with screenshots.
• A short case study per project. Problem, approach, tradeoffs, outcome. Two or three paragraphs each, no more.
• A way to contact you. Email and LinkedIn, both clickable, both above the fold on mobile.
• A working dark mode if you have a dark mode toggle. If it’s broken, that’s a signal.

The differentiators (these are what get remembered)

• Numbers in your case studies. Bundle reduced from X to Y. LCP from N to M. Setup time cut by some percentage. Numbers anchor memory.
• Tradeoffs you considered and rejected. “We used Tailwind. We chose it over CSS modules because [specific reason].” That’s the senior signal.
• A blog with real posts. Not “coming soon”. Three or four technical posts about something specific you ran into.
• Performance. Your portfolio loads fast. If a frontend portfolio is slow, it disqualifies you for half the room before the human reads anything.
• A “what I’m working on” or “now” page if it’s current. A stale “now” page is worse than no page.

What to leave off

• A “skills” grid with bars. Nobody believes them. They take up space and signal junior.
• Every tutorial you ever finished. A wall of half-projects suggests you can’t ship.
• Carousels, parallax, full-screen scroll-jacking. Optional. Recruiters skim. Don’t make scanning hard.
• A 404 page that’s funnier than your case studies. If your most polished page is the 404, that’s a problem.
• Generic stock illustrations. They suggest you didn’t have anything specific to show.

The structural bits people skip

• Mobile. Most recruiters open links on mobile. If your portfolio is desktop-only, you’ve already lost.
• OpenGraph image. When the link gets shared in a Slack DM, what shows up matters.
• Real metadata. Page titles per route, meta descriptions per page, a working sitemap.
• A CV link, not just a contact form. Recruiters need a PDF. Don’t make them ask.

Conclusion

The portfolio is not a creative project. It’s a sales tool that should answer three questions in under a minute: who are you, what have you shipped, and how do I reach you. Strip everything that doesn’t help with that.

Summary

Essentials: clear description, three to four real projects, short case studies, contact info, working dark mode. Differentiators: numbers, tradeoffs, blog, performance, a current “now” page. Leave off: skill bars, half-projects, scroll-jacking, generic stock art. Don’t skip mobile, OpenGraph, metadata, or a CV link.