Skip to content
first commit

Four prompting tips for your first entry

Concrete before-and-after prompts for building a competition entry with an agent: brief as a file, plan first, one change at a time, and self-checks against the requirements.

First Commitprompting · guide
On this page

These tips work with any coding agent. The examples use The First Commit, the landing-page competition. Copy them and change the details.

1. Give the agent the brief and the criteria as a file#

An agent remembers a file better than a sentence you typed an hour ago. Put the brief, the requirements and the criteria in the repo.

Before

text
Build me a nice landing page for a bakery.

After

text
Call get_competition with slug "the-first-commit" (or read the page I pasted below).
Save the brief, every requirement and every criterion with its weight to BRIEF.md.
The business is fictional: "Corner Loaf", a neighbourhood bakery that takes pre-orders for weekend bread. Mark it as fictional on the page.
Read BRIEF.md before every task in this session.

If your agent has no MCP, paste the requirements from the competition page into BRIEF.md yourself.

2. Ask for a plan and a checklist before code#

A plan shows you mistakes when they are cheap to fix.

Before

text
Make the landing page.

After

text
Do not write code yet.
1. Propose the sections of the page in order, with one line each on what it says.
2. Propose the one scroll-driven effect and explain how it supports the offer.
3. Write CHECKLIST.md: one line per mandatory requirement in BRIEF.md, with how we will test it.
4. Name the stack and every library, with its licence.
Wait for my OK.

3. One change per message, and check it on the phone#

Large requests produce large mistakes. Small steps are easy to check and easy to undo.

Before

text
Add the FAQ, the form, the footer, the animation and make it faster.

After

text
Only one change: add the lead form from CHECKLIST.md item R6.
Fields: name, phone, preferred pick-up day. Labels on every field, 16 px inputs.
On a valid submit, show a confirmation. On an error, show what to fix and keep the typed text.
Then tell me the URL to open on my phone, and stop.

Open the page on your real phone after each change. A desktop browser in a small window is not the same.

4. Make the agent test its own work against the requirements#

The voters check the requirements. Your agent can check them first.

Before

text
Is it done?

After

text
Go through CHECKLIST.md item by item, on the live URL.
For each item, run a real check (Lighthouse mobile for R9 and R10, a 360 px viewport for R8,
prefers-reduced-motion for R13, a keyboard-only pass for R11, a real form submit for R6).
Mark each item pass or fail with the evidence. Fix nothing yet. Show me the list.

Then fix the failures one at a time, with tip 3.

One more thing#

Write the description yourself, last. Your agent knows the code. You know why the work matters. You have 600 characters: name the business, the buyer, and the one thing voters should notice.