Data & Backend

Data Models Overview

Data Models let your app store, retrieve, and manage structured data. Think of them as spreadsheets that live behind your app — each model is a table, each field is a column, and each record is a row. They're powered by MongoDB and work seamlessly with your generated app.

What Are Data Models?

A Data Model is a structured data collection that belongs to your application. If you're building a task manager, you might create a "Tasks" data model with fields like "title," "due date," "status," and "priority." If you're building a recipe app, you might have a "Recipes" model with "name," "ingredients," "instructions," and "rating."

Each Data Model maps to a MongoDB collection behind the scenes. When your app creates, reads, updates, or deletes records, those operations go through Webase's Data API and are stored persistently in the database. Your data survives page refreshes, browser restarts, and device switches.

Data Models vs. localStorage

You might be wondering when to use Data Models versus the browser's built-in localStorage. Here's the simple rule:

  • Data Models — Use for all application data. Tasks, contacts, recipes, orders, blog posts, inventory items — anything that represents the core content of your app. This data is stored on the server and persists reliably.
  • localStorage — Use only for UI preferences like theme selection (light/dark mode), sidebar collapsed state, or last-viewed tab. This data is stored in the user's browser only and may be cleared at any time.

Important: Generated apps are built to follow this rule automatically. When the AI creates your app, it will use Data Models for structured data and localStorage only for visual preferences. If you ask the AI to "save user data," it will use a Data Model, not localStorage.

How Data Models Work

Every Data Model has two key parts:

  • The model itself — This defines the collection. It has a name (like "Contacts") and a slug (like "contacts") that identifies it in the database. The slug is generated automatically from the name.
  • Fields — These define the structure of each record. A "Contacts" model might have fields for "name" (String), "email" (String), "phone" (String), "birthday" (Date), and "is_favorite" (Boolean).

When your app runs, it communicates with the Data API to perform operations on your models. The API handles all the database interactions, so your app code stays simple and focused on the user interface.

Supported Field Types

Webase supports a rich set of field types to handle virtually any kind of data:

  • String — Short text like names, titles, or labels. Best for single-line values.
  • Text — Long-form text like descriptions, notes, or comments. Supports multi-line content.
  • Number — Numeric values like prices, quantities, ratings, or scores.
  • Boolean — True/false values like "is completed," "is active," or "is featured."
  • Date — Calendar dates like due dates, birthdays, or event dates.
  • URL — Web addresses like website links, social media profiles, or resource links.
  • Image — Image files that can be uploaded and displayed in your app.
  • Attachment — General file attachments like PDFs, documents, or spreadsheets.
  • Collaborator — References to users or team members associated with a record.
  • Single Select — A dropdown with predefined options, like "status: To Do / In Progress / Done" or "priority: Low / Medium / High."
  • Link to Object — A reference to a record in another Data Model, creating a relationship between models. For example, linking a "Task" to a "Project."
  • Dynamic — A flexible field that can hold any type of value. Useful when the data structure varies between records.

How Generated Apps Access Data

Your generated app communicates with Webase's Data API to read and write records. The API provides standard operations:

  • List records — Fetch all records from a data model (e.g., show all tasks).
  • Show a record — Fetch a single record by its ID (e.g., view task details).
  • Create a record — Add a new record to a data model (e.g., create a new task).
  • Update a record — Modify an existing record (e.g., mark a task as complete).
  • Delete a record — Remove a record from a data model (e.g., delete a task).

All API calls are authenticated automatically — your app includes the necessary credentials so you don't have to configure anything.

The DataService

Generated apps include a built-in DataService module that wraps the Data API in easy-to-use functions. Instead of writing raw API calls, your app's components use the DataService to fetch, create, update, and delete records with simple function calls.

The DataService handles authentication, error handling, and data formatting behind the scenes. When the AI generates or updates your app, it automatically uses the DataService for all data operations — you don't need to set anything up manually.

Ready to create your first data model? Head over to Creating Data Models & Fields for a step-by-step walkthrough of setting up models and fields in the editor.