Academyacademy / vibe-102 / data-shape
Data Shape
What this is
Data shape means the structure of one item in your app.
In Vibe 102, every app is one list of items. Each item is an object.
Why it matters
A website is mostly built around sections.
A mini app is built around data.
If you know the item shape, you know what the app needs to add, show, update, delete, and save.
What to do
For the default Mission Task Tracker, the item can look like this:
Reference
{
id: number,
text: string,
completed: boolean,
createdAt: string
}Other app examples:
| App | Item |
|---|---|
| Habit Tracker | habit name, done status |
| Expense Tracker | title, amount, date |
| Bookmark Manager | project name, link, favorite |
| Lead Tracker | name, contact, status |
Before coding, answer:
Reference
What is one item in my app?
What fields does that item need?
Can the app work with one list of those items?Common mistakes
- Designing the screen before knowing the item.
- Adding too many fields.
- Mixing multiple app ideas into one data shape.
- Adding user accounts because the word "data" sounds like database.
Vibe 102 / Current checkpoint
Data Shape
Ready to stamp - Saved in this browser only.
0 of 11 checkpoints complete
0 of 11 checkpoints complete.