Building Apps

Before the full walkthrough: write a short user journey, then build one step at a time with checks.

Finish Keyboard Basics firstNext: full app walkthrough

Apps vs games (same Grok skills)

An app here means a useful product: website, tools, multiplayer services, internal dashboards. You still use folders, AGENTS.md, clear goals, and verification—the content of the goals changes.

Start from a user journey

A user journey is the path a person takes through your product, written as a story:

1. Visit homepage while logged out
2. Sign up with email
3. Create a project
4. Invite a friend
5. Edit a document together

Put this in JOURNEY.md. Build one step at a time until that step works for a human.

  1. Write journey + AGENTS.md (how to run, test, and start the dev server).
  2. Use plan mode for big structure — auth, database tables, API shapes.
  3. Implement one journey step with a verification sentence in every prompt.
  4. Manually click through the happy path yourself.
  5. Then empty states, errors, loading spinners (ask for them explicitly).
/plan
Add email/password signup and login.
Sessions should keep users logged in.
Protect the /app page so logged-out users are redirected.
Verification: I can register, log in, open /app, log out, and get redirected.
Secrets

Never paste production passwords into Grok. Teach variable names in AGENTS.md (DATABASE_URL) and keep real values in private env files that are not committed to Git.

Lab

Pick one journey step only (e.g. “static homepage with a working Sign up button that shows a form”). Finish that before anything else.

Want a full script?

Follow the copy-paste guide: Walkthrough: Your First App (Focus List) — journey file, shell UI, features, localStorage, and exact good vs bad prompts.

What to do next

This lesson is short on purpose. When you finish reading, open Walkthrough: First App and follow every phase in order.