+ SAAS · AI RESUME · CMS

How Swift Resume takes users from blank page to a finished resume in 5 minutes

Built a Next.js resume platform with AI-assisted generation, live preview, ATS-friendly templates, PDF export, and a Payload CMS marketing site.

FRONTEND

Next.js 16

CMS

Payload 3.84

LOCALES

9 configured

PAGE ENGINE

6,963 lines

Ruta SavaniSr. Fullstack Engineer, Flex SolutionsPublished 3 May 2026 · Updated 8 September 202611 min read
The Swift Resume editor: a structured form on the left and the live A4 document preview on the right
Above — the structured editor beside the live A4 preview. Fields on the left drive the document on the right, and the same markup renders both the preview and the PDF export.

+ WHAT WE BUILT, IN NUMBERS

6,963
Lines · pagination engine
26
Editor blocks on pages
14
Payload collections
9
Locales · 1 content model

+ BRIEF

Swift Resume needed a builder where users control every detail of the design — font, colour, spacing, section order, paper size — and still get a PDF that matches what they approved on screen, exactly. Around it sat a marketing site the content team had to run themselves, across nine markets, without a release for every copy change.

+ OUTCOMES

  • Built a custom pagination engine that flows resume content onto A4 and Letter pages.

  • Shipped an export pipeline that renders from the same markup as the on-screen preview.

  • Integrated an AI layer framed as enhancement — the user keeps the final document.

  • Delivered a Payload CMS marketing layer the content team composes and previews itself.

  • Wired locale-aware routing, content and currency from a single content model.

+ WHAT WE SHIPPED

Six product surfaces, one Next.js codebase.

The builder, the account system and the marketing site all run from one Next.js application and one Payload instance — so a signed-in user and an anonymous visitor share the same components, styles and content model.

  • 01 — THE BUILDER

    Editor and live A4 preview

    A structured editor beside a document that repaginates as you type. Templates, palettes, fonts, spacing, section order and paper size all redraw the page live.

  • 02 — AI ASSISTANCE

    AI assistance in four places

    Guided build-with-AI onboarding, inline rewriting in every field, plus standalone summary and cover-letter generators that double as free entry points.

  • 03 — ONBOARDING

    Start before you sign up

    Upload an existing CV or import a LinkedIn profile, and the content lands in the editor already structured. The account is created afterwards, and the work carries across.

  • 04 — ACCOUNTS

    Three ways in, one identity

    Email and password, a one-time code, or LinkedIn — all resolving to the same account, with a dashboard for saved resumes and downloads.

  • 05 — BILLING

    Subscriptions in local currency

    Stripe checkout, trials, plan changes and invoices — priced per market from Stripe's own currency options rather than a price table someone has to maintain.

  • 06 — MARKETING SITE

    A page builder, not a template

    Landing pages, pricing, resume examples, template galleries and free tools — all assembled in Payload from 26 blocks, with no release required.

Why a resume builder is harder than it looks.

A resume is one of the few documents people still print. It has to fit a page — a real page, with real margins — and the user has to trust that what they approved is what an employer opens.

The difficulty is that almost nothing about the page is fixed. Users change the template, the palette, the typeface, the type scale, the spacing, the order of sections and the paper size itself — and every one of those choices moves where the text breaks. The document has to hold all of it.

PAPER

A4 and US Letter, at true print dimensions

LAYOUTS

Four, including left and right sidebar variants

TYPE

Three families across three scales, with ten palettes

SECTIONS

Reorderable, hideable, and assignable to the sidebar

OUTPUT

PDF, Word and plain text — each has to match the preview

One document model, two surfaces.

Every edit updates a single document model first. The editor and the preview both read from it, and every style is written inline rather than through a stylesheet.

Export then serialises the preview’s own markup — so the PDF is not a second rendering of the resume. It is the same one. That single decision is what removes the whole class of bugs where a document looks right on screen and wrong on paper.

A single resume render sitting under a chrome bar labelled on screen on one half and on paper on the other
Above — not two renderings compared. The export serialises the preview's own markup, so the screen and the PDF are the same artifact.

AI that shapes, rather than replaces.

The product’s own line is “AI-enhanced, not AI-written”, and that is an engineering constraint as much as a positioning one. Assistance is spread across four places in the journey rather than concentrated in one generate button.

Every generated fragment has to re-enter the document model cleanly and re-paginate without disturbing the pages above it — which is why the AI writes text, and the application decides how that text becomes a document.

ONBOARDING

A guided build-with-AI flow that drafts a first resume from answers

IN THE EDITOR

Rewrite or extend any field in place, keeping the user's own wording

ANALYSIS

Reviews a finished resume and suggests tweaks against the target role

FREE TOOLS

Standalone summary and cover-letter generators, usable before signup

Why the marketing site is a separate concern.

Landing pages, template galleries, resume examples and free tools change weekly. The builder does not. Coupling them would mean a release for every headline.

So the marketing surface lives in Payload, in the same application and the same design system as the product — with drafts, autosave, scheduled publishing and live preview, in nine locales.

LANDING PAGES

Composed block by block, with drafts and scheduled publishing

RESUME EXAMPLES

Ten industry categories, each a browsable landing surface

TEMPLATES

Seven categories — one-column, two-column, corporate, modern, picture, simple, ATS

FREE TOOLS

Six, mixing AI generators with salary and hours calculators

PRICING

A block that reads plans and local currency live from Stripe

+ THE PAGINATION ENGINE

We stopped predicting where text would wrap, and asked the browser instead.

Where a paragraph breaks depends on the font file, its hinting, subpixel metrics and the container width to two decimal places. There is no formula for it. So the engine renders each block into a hidden slot locked to the exact width of its real column, measures what actually happened, and paginates from that.

  • MEASURE

    Width-locked slots

    Each hidden measurement slot matches the real usable width of its lane, so a measured paragraph wraps identically to the rendered one.

  • SEARCH

    Beam search, not first-fit

    Greedy packing strands headings at page bottoms. The engine evaluates several break plans ahead and keeps the best-scoring ones.

  • SCORE

    Typography as arithmetic

    An orphaned heading, a wasted half page and a paragraph split from its bullets each carry a different, explicit penalty.

  • SPLIT

    Unicode-legal breaks

    When a paragraph must split mid-sentence, the cut lands on a break point the Unicode line-breaking algorithm allows — and bold or italic runs survive it.

AND

It has to hold for every design the user can reach — 22 independent axes of layout, palette, type, spacing and paper size, in any combination. Not for a happy path.

This is the kind of work we do as SaaS product engineering

+ IMPORT & ONBOARDING

AI where the input is messy. Plain parsing where it isn’t.

Four ways in: describe the role, import a LinkedIn profile, upload an existing CV, or start from an empty form. Three of them skip the blank page, and only two need a model.

Four onboarding routes — LinkedIn, uploaded CV, a described role and an empty form — each tagged model or no model, converging on one editable resume
Above — all four routes land in the same editable resume. Only two of them need a model to get there.
+ PREVIEW IMAGE PIPELINE

Roughly 2,300 preview images — generated only when someone actually looks.

Every template can be previewed in ten palettes across nine locales. Pre-building that grid means thousands of images to render, store and keep in sync — and most would never be seen.

A grid of twelve real resume template previews rendered across palettes and locales
Above — real template previews from the live product. Each palette and locale variant is a separate image, rendered on first view rather than pre-built. LIVE PRODUCT · SWIFTRESUME.COM
THE URL IS THE API

A preview is requested by asking for it. The address carries the collection, locale, document and palette — so an ordinary image tag is the only integration the front end needs.

FRESH BY COMPARISON

There is no expiry time and no purge call. Publishing writes the document's timestamp to a manifest; the stored image carries its own. Equal means serve, different means regenerate.

RENDER ONCE

A miss renders the page headlessly, stores the result, and returns it in the same request. Every later visitor is served the stored copy until the document genuinely changes.

NEVER A BROKEN IMAGE

Generation is capped at ten seconds. Past that the previous image is served rather than a spinner, and a background job retries. If nothing exists yet a placeholder returns, marked not to be cached, so a transient failure never sticks.

+ RUNNING THE SITE

A Payload CMS layer the content team runs without a developer.

Most of the value in a headless CMS is not the content model — it is whether a marketer will actually use it on a Friday afternoon without asking an engineer for help.

26

Blocks to build a page

100ms

Autosave interval

10

Versions kept per page

0

Deploys to publish
DRAFT SAFELY

Work is autosaved as a draft and never touches the live site until it is published. Ten versions are kept per page, so reverting a bad edit is a click rather than a support ticket.

SEE IT FIRST

Live preview renders the real page beside the editor as fields change — the same components the public site uses, not an approximation of them.

SCHEDULE IT

A campaign page can be set to publish at a date and time, so a launch does not depend on someone being awake in the right timezone.

SHIP IN SECONDS

Publishing invalidates only the pages affected by that document. There is no deploy, no build queue, and no full-site regeneration to wait through.

TRANSLATE IT

Locale is a dimension of the content rather than a separate site — including the URL slug, so each market gets addresses in its own language.

We build content platforms like this as a Payload CMS agency

+ AGENT-ASSISTED CONTENT

The editorial brief is a document the client edits, not code we own.

Producing long-form landing pages at volume usually means hiring writers or accepting generic output. The CMS itself is exposed as a tool surface, so an assistant can draft into it under rules the content team sets.

A Payload CMS editorial brief and reference-examples collection feeding a drafted record held at status draft, awaiting approval before it can publish
Above — the brief and reference examples live in the CMS. Drafts are produced against them and held for approval; nothing publishes itself.

Shipping generative features is our AI delivery practice.

+ TECH STACK

The stack, and why each piece is there.

FRAMEWORK
Next.js 16 · React 19

App Router with locale segments. Server components for the marketing surface, client islands for the editor.

CMS
Payload 3.84

One instance serving public content and user-owned records, with per-collection access rules between them.

RENDERING
Custom engine

Measurement, pagination and export. Written in-house because no off-the-shelf library agrees with the browser on where text breaks.

COMMERCE
Stripe

Multi-currency through Stripe's own price options rather than a maintained per-country table.

DELIVERY
Vercel · Cloudflare

Edge-cached pages; images resized and format-negotiated at the CDN.

AI
OpenAI

Structured output for document extraction; plain text for drafting, converted by the app rather than the model.

+ WHAT CHANGED

One artifact, one content model, and a marketing site that ships itself.

Revenue and conversion belong to Swift Resume, so we don’t quote them. Below is what the engineering changed — plus the one satisfaction figure the client publishes itself.

4.4 / 5Average user rating
32,712Reviews behind it

Published by Swift Resume on its own homepage. It is the client's number, not ours — we include it because it is the only user-facing measure of the product we can point at.

THE DOCUMENT

Screen and paper stopped being two renderings that could disagree. There is one artifact, and the user approves it before it downloads.

THE RELEASE CYCLE

Copy, pricing and campaign pages came off the frontend release train. The people who write them are the people who ship them.

THE NEXT MARKET

A tenth market is a configuration change against one content model — not a second site to build, translate and then keep in step.

+ TRADE-OFFS & VERIFICATION

What this approach costs, and how to check the numbers.

Every decision on this build bought something and gave something up. These are the ones a team evaluating the same problem would want to know about.

WHAT IT COST

The layout search runs on every meaningful edit

Beam search is more expensive than a first-fit line breaker. We cap the beam at four candidates and dedupe by layout fingerprint, which keeps it bounded — but it is work a naive renderer would not do.

Resume styles cannot live in a shared stylesheet

Screen and PDF stay identical because the export serialises the preview's own markup, which means every resume style has to be inline. That parity is the whole point, and this is the price of it.

A preview image can be one render behind

The pipeline is built so an image tag never fails — it serves a stale render, then a placeholder, rather than an error. The trade is that a just-changed template can show its previous render until the queue catches up.

WHERE EACH NUMBER COMES FROM

REPOSITORY

Engine size, collection and block counts, configured locales

LIVE SITE

Template and example inventory, free tools, pricing — all countable on swiftresume.com

CLIENT

The 4.4 out of 5 rating and 32,712 review count, as published on Swift Resume's own homepage

SEARCH DATA

Impressions, clicks and query counts from Google Search Console

+ FAQ

Questions we get about this build

These answers are the source for the page’s structured data — the visible text and the schema are the same strings.

+ START A BUILD

Shipping a generative feature without flattening every user into the same output?

That is the kind of problem this build was made of. Tell us where your product is, and we will tell you honestly whether we are the right team for it.

Average reply

4 hours, weekdays

First call

30 min, with a founder

Typical engagement

4–8 weeks

NDA

On request

What the client said

"
Flex Solutions delivered Swift Resume's Next.js builder with real-time A4 preview, AI-assisted flows, and a Payload-powered marketing layer — all wired so product and content could ship without fighting the codebase.
Tristan Drapper

Tristan Drapper

Owner · Swift Resume Ltd.
+ NEXT CASE

How The Recovery Project moved off WordPress onto Astro without losing a URL & SEO

RECOVERY PROJECT · Migration · 2026