Day 14 of 21
Week 2 build day - add a contact section with no backend email sending
Goal: Today you use the full safe Codex workflow to add one real feature: a simple contact section. No email sending. No backend. Just a visible contact section with your details or a basic form that does not submit anywhere yet.
What to do
Ask Codex to plan the contact section — no coding yet
Start Codex in your project folder. Give it the task as a planning request only — do not approve any edits yet. The goal of this step is a clear written plan that names every file Codex will create or change. Paste the prompt below and fill in your decision from the beforeYouStart.
I want to add a simple contact section to my project.
Scope: static only. No email sending, no backend, no form submission.
Location: [NEW PAGE AT /contact / SECTION AT BOTTOM OF HOMEPAGE / BOTH]
Before you touch any file:
1. List every file you will create or change
2. Describe what you will do to each one
3. Confirm you will NOT add any email-sending logic, backend routes, or database connections
4. Estimate how many files total will change
Wait for my approval before starting.Approve Phase 1 only — the new file or section
Read the approved plan and approve only the first phase: creating the new contact page or adding the contact section. Do not approve any navigation changes, link additions, or metadata updates in the same step. One thing at a time. Type your approval exactly as shown below.
Approved: go ahead with Phase 1 only.
Phase 1 is: [DESCRIBE THE FIRST STEP FROM THE PLAN — e.g. "create the contact page file"].
Stop after Phase 1 is complete. Wait for my review before continuing to Phase 2.Preview the contact section in your browser
Before adding any navigation links or committing anything, preview what Codex built. If your project is plain HTML, open the HTML file by double-clicking it in File Explorer or Finder. If your project is Next.js or React, open a second terminal in your project folder, run: npm run dev, then go to http://localhost:3000 in your browser. Leave that terminal open while you browse. Navigate to the contact page or scroll to the contact section. Check: is the content there, Is the layout reasonable on desktop?
Add the navigation link or internal link — Phase 2
Now that the contact section exists and looks reasonable in the browser, approve Phase 2: adding a link from somewhere users can find it. This is usually a link in the main navigation or a "Contact" link in the footer. Give Codex the specific location — do not let it decide where to put the link.
Phase 1 complete and reviewed. Proceed to Phase 2 only.
Phase 2: add a link to the contact [page / section] from [DESCRIBE THE LOCATION — e.g. the main navigation menu / the footer].
Name the link: "Contact"
Do not change any other part of the navigation or footer.
Do not touch any other file.
Wait for my approval of the diff before continuing.Check the diff, preview again, and commit
Before committing, do a final check: open GitHub Desktop and review all changed files from today. Check that no file was changed that was not in the approved plan. Then preview the site in your browser again: navigate to the contact section using the new link. If the link works and the section looks right, commit all changes with a clear message.
Expected result
A static contact section or contact page exists in your project, is reachable via a navigation link, was previewed in a browser, and has been committed to your working branch. No email sending, no backend, no form submission was added.
Key takeaway
- A build day is just Day 3 and Day 5 running back-to-back on a real task. Plan first. Approve phase by phase. Preview before linking. Review the diff before committing. The process is the same every time — the task just changes.