Applyfold: an applicant tracking system for a growing startup

Applyfold: an applicant tracking system for a growing startup

00 Markdown

A careers page with PDF resume uploads, a drag-and-drop pipeline board for each job, and interview scorecards, all live.

Agent specs

Agent
Claude Code, Opus 5.5 Medium
Time
17 min
Cost
$6.75*

Agents work faster and more accurately on Elements.

* Cost at API rates, September 2026.

Run it yourself

Paste this prompt into your AI agent. You get the finished app on your own machine, ready to change however you like.

Agent Chat
Install elements:
curl -fsSL 'https://install.elements.dev?os=darwin' | sh && export PATH=~/elements/bin:$PATH

Create an Elements app from the elementscode/demo-applyfold scaffold:
cd ~/elements/projects
elements create applyfold -scaffold=elementscode/demo-applyfold
cd applyfold

Start the app.

Need an AI agent?

In AI desktop apps, paste into the Code tab, not the general chat.

How it's built

Applyfold needed resume uploads, a pipeline board that updates for everyone watching, emails to applicants, and two kinds of hiring accounts. Each of those is a part of Elements, so the agent spent its 17 minutes on the hiring workflow itself.

What Elements gave the app

  • A live pipeline board. Applications are a LiveTable, one view per job. Dragging a candidate to a new column saves the move, and a database trigger broadcasts every new application and stage change, so each open board updates whether the change came from the careers page, a candidate's page or another board.
  • Resume uploads. The apply form sends the resume as a file field to an @rpc function, which checks that the bytes are a real PDF under 5 MB and stores it. The hiring team previews it on the candidate's page.
  • Server calls as function calls. Scorecards, notes, interviewer assignments and the job editor call server functions straight from the page with @rpc, and validation messages come back to the field they belong to.
  • Email to applicants. Each application sends a confirmation from an email template. Dragging a candidate to rejected offers a polite rejection email, sent from a second template.
  • Sessions and roles. Admins see every job and board. An interviewer sees only the candidates assigned to them, and one guard enforces it on every page and server call.
  • Data from SQL files. Migrations define the schema and seed three accounts, four jobs, 21 candidates and ten scorecards, each candidate with a one-page PDF resume built in SQL. The project server applied each one as soon as it was saved.

What the project server gave the agent

The project server runs alongside the agent and answers as soon as a file is saved: it type-checks the templates, TypeScript and SQL, applies migrations and reruns the tests, so every question came back right away and the agent kept building.

What shipped

The app type-checks with zero errors and all 19 tests pass. Every page works on desktop and phone, and live updates arrive across tabs, such as a new application or a board move appearing on another open board.

The code

Build it from scratch

To watch your agent build this app from an empty project, use the prompt we used instead. It takes longer than starting from the finished app above.

Agent Chat
Install elements:
curl -fsSL 'https://install.elements.dev?os=darwin' | sh && export PATH=~/elements/bin:$PATH

Create an Elements app:
cd ~/elements/projects
elements create applyfold
cd applyfold

Start the app, then build this:

Build an applicant tracking system named applyfold for a growing startup, with a
public careers page.

PUBLIC
- Careers page listing open jobs, each with a description page.
- Apply: name, email, phone, resume upload (PDF), a short answer.
- The applicant gets a confirmation email.

HIRING TEAM (accounts: admin and interviewer)
- Admins create jobs (title, team, location, markdown description, open or
  closed).
- Each job's pipeline board: applied, screen, interview, offer, hired,
  rejected. Drag a candidate to move them.
- Candidate page: resume preview, application answers, notes, and interview
  scorecards (1 to 4 on each of three criteria plus a recommendation).
- Interviewers see only candidates assigned to them and fill in scorecards.
- Moving a candidate to rejected offers to send a polite rejection email.

Seed one admin, two interviewers, three open jobs, and fifteen candidates
across stages with a few scorecards. Show the seeded logins on the sign-in
page.

Board moves and new applications update in real time.

The weekly digest

New lessons, demos and posts from elements.dev, in one email a week.

Comments· 0