FNJ

~/portfolio-builder/backend-developers

A backend portfolio for work that doesn't screenshot well

APIs, queues and databases don't make pretty thumbnails, which is why backend developers end up with empty portfolios. FNJ's AI builder designs a portfolio around what reviewers actually want to see from backend engineers: the system, the constraints, the trade-offs and the numbers you can share, with architecture diagrams you upload as images and links to the code.

  • Next.js project
  • Static HTML
  • Push to GitHub
  • No FNJ runtime
Sample site with fictional names, made to show the kind of site the builder designs. Yours is designed from your description and the reference you choose.

The same sample at phone width. The builder designs every page at desktop, tablet and phone widths.

The sample, section by section

What a backend developer website needs

The sections the builder can design for you, and the job each one does. The starter prompt asks for these; add or drop any of them in your own words.

  1. 01

    Intro

    What kind of systems you build and at what scale.

  2. 02

    Systems

    Projects written as short design docs.

  3. 03

    Open source

    Repos and contributions with links.

  4. 04

    Writing

    Posts on incidents, migrations and performance.

  5. 05

    Experience

    Teams, services and on-call history.

  6. 06

    Contact

    Email, GitHub and LinkedIn.

Made for backend developers, not for everyone

Starter prompt

A prompt written for backend developers

It opens in the builder ready to edit. Replace the words in brackets with your own details, change anything else you like, then add a reference.

Reference to add

An engineer's blog or personal site with the readable, document-like feel you want.

The builder takes a reference's look (layout, type, palette, spacing), never its words or images.

Build a backend developer portfolio for [your name], a backend engineer working on [distributed systems / APIs / data pipelines] with [your stack]. Open with a plain-spoken introduction. Add a 'Systems' section with three projects, each with a page written like a short design doc (context, constraints, architecture diagram, trade-offs, results), an open source section with repo links, a writing section with links to my posts, an experience section and a contact section. Minimal and highly readable: a serif for body text, monospace for labels and code, muted colours and wide margins.

How it works

  1. 01

    Describe your backend developer site

    Open the builder with the starter prompt, fill in your details and add a screenshot or link of a site you'd like yours to look like. A reference is required: it's what makes the design yours rather than a template.

  2. 02

    Watch it design every page

    The builder plans the pages, palette and type, then builds each page section by section on a canvas at desktop, tablet and phone widths while you watch.

  3. 03

    Refine it, then take the code

    Ask for changes in plain words or edit by hand, upload your own screenshots, then download a Next.js project or static HTML, or push it to your GitHub, and host it where you like.

What it costs: From $25/month, or $29 once for 50 credits that never expire. No FNJ hosting fee: you host the exported site. See plans

Backend developers: questions

How do I show backend work on a portfolio?
Write each project as a short design doc: context, constraints, architecture, trade-offs and what happened. Ask the builder for that structure and fill it with your own words and diagrams.
Can I add architecture diagrams?
Yes, as images you upload (exported from your diagram tool). The builder gives them wide layouts with captions.
Can I write long technical posts?
You can add article pages within your plan's page limit. The builder isn't a blogging engine; for frequent posts, add one to the exported Next.js project or link to where you already publish.
Can I show code?
As monospace text in a styled block, without syntax highlighting. Link to the repo for anything long.

Related portfolio builders

Make your invisible work visible

The builder opens with your backend developer prompt filled in. You edit it, add a reference, and watch the first version take shape.