A complete walkthrough — go from a one-line idea to a deployed app by building a real example with Fabricate.
The best way to learn Fabricate is to watch one app come together end to end. In this guide you’ll build a team task tracker — a small, realistic app — from the first prompt all the way to a live URL.
Follow along by typing the prompts into your own Fabricate project, or just read through to see how the workflow flows. The same pattern works for any app you have in mind.
Start on the home screen and describe the whole app in plain English. Cover the core feature, who uses it, and anything that matters to you up front — like authentication.
1
Describe what you want
Build a team task tracker. Users can sign up and log in, createtasks with a title, description, due date, and status (To Do,In Progress, Done), and see all tasks on a board grouped by status.Each user only sees tasks from their own account.
2
Send it
Fabricate reads your prompt and turns it into a build plan.
Mention authentication, the main data model, and the primary view in your first prompt. These are expensive to bolt on later, so it pays to be clear early.
Before writing code, Fabricate generates a blueprint — a plan describing the pages, data model, and features it intends to build. For the task tracker, expect something like:
Auth — sign up, log in, and per-user data isolation
Database — a tasks table linked to users
Board page — tasks grouped into To Do / In Progress / Done columns
Task editor — create and edit tasks in a dialog
Read it over. If something’s missing or wrong, say so before the build starts — it’s the cheapest moment to course-correct.
Your first build is a starting point, not the finish line. Refine it one focused change at a time:
Add a priority field to tasks (Low, Medium, High) and show a coloreddot for priority on each task card.
Add a search bar above the board that filters tasks by title in real time.
Make the board responsive — stack the three columns vertically onmobile screens.
One change per message gives you cleaner results and easier troubleshooting. If a change looks wrong, you can revert that message from version history and try again.
