Kiro AI
Build a Full‑Stack Food Tracker App with Kiro AI
Create a functional food‑tracking web application—including database schema, API routes, and UI—using Kiro AI’s spec mode, steering files, and MCP server integrations, all in under an hour.
The Workflow
10 steps · click a step number to mark it done
Open Kiro AI and have it ready before you start
Open Kiro AI and start a new TanStack Start project named food‑tracker, selecting Tailwind CSS, Biome, and Drizzle as the ORM
Create a README markdown file that outlines the app’s purpose and core features (add, view, edit, delete food items)
Generate steering documents by clicking “Generate steering docs” so Kiro AI can ingest the README and your custom Docker & TanStack best‑practice markdown files
Add the Docker and TanStack best‑practice markdown files to the steering doc using the #[] file picker, then click “Refine” to clean up the context
Prompt Kiro AI: “Add a new Drizzle schema for food items (name, quantity, protein, calories) using the steering docs for guidance”
Approve the generated schema and migration files; then click “Migrate” to apply the schema to the local PostgreSQL container
Ask Kiro AI to create API routes for CRUD operations on food items; review the generated route files and commit them to Git
Instruct Kiro AI to build the front‑end components (form, list, edit modal) using Tailwind and TanStack Router, then run the dev server to test the app
Commit all changes, push to your repo, and optionally deploy the Dockerized app to a cloud provider
Verify the live website at localhost:3000 (or deployed URL) shows the food tracker with full add/edit/delete functionality