> ## Documentation Index
> Fetch the complete documentation index at: https://docs.vybe.build/llms.txt
> Use this file to discover all available pages before exploring further.

# Creating an App

> Three ways to start building — from scratch, from a recipe, or from a template

Every Vybe app is a full-stack Next.js 15 application with its own database, live preview, and deployment pipeline. You can create one in under a minute.

***

## Three ways to create an app

<CardGroup cols={3}>
  <Card title="From scratch" icon="plus">
    Start with a blank canvas and describe what you want the AI to build.
  </Card>

  <Card title="From a recipe" icon="book-open">
    Pick a pre-configured starter with guided setup steps and built-in integrations.
  </Card>

  <Card title="From a template" icon="copy">
    Clone a full app blueprint created by another user or your team.
  </Card>
</CardGroup>

***

## Creating an app from scratch

This is the most common path. You describe what you need, and the AI builds it.

<Steps>
  <Step title="Click New App">
    From your workspace, click the **New App** button. Enter a name for your app.
  </Step>

  <Step title="Describe what you want">
    In the chat panel, write a prompt describing the app you want to build. Be specific about the data sources, features, and layout your team needs.

    > Build a customer support dashboard that shows open tickets from our database, lets agents update ticket status, and displays resolution time metrics in a chart.
  </Step>

  <Step title="Watch the AI build">
    The AI scaffolds your entire application — creating pages, components, database tables, and API routes. You can watch the progress in real-time through the live preview.
  </Step>
</Steps>

<Tip>
  The more specific your initial prompt, the better the result. Include details about data sources, user workflows, and the layout you want. You can always iterate after the first build.
</Tip>

***

## Creating an app from a recipe

Recipes are pre-configured app starters designed for common use cases. They come with specific integrations and guided setup steps.

<Steps>
  <Step title="Open the New App dialog">
    Click **New App** and browse the recipe gallery. Recipes are organized by category and filterable by integration type.
  </Step>

  <Step title="Pick a recipe">
    Select a recipe that matches your use case — for example, "Jira Dashboard", "Stripe Chargeback Tracker", or "Salesforce Pipeline View". Each recipe shows which integrations it uses.
  </Step>

  <Step title="Follow the guided steps">
    After creating the app, a sidebar appears with the recipe's setup steps. These steps walk you through connecting the required integrations, configuring data sources, and customizing the app for your needs.
  </Step>

  <Step title="Mark steps as complete">
    As you work through each step, mark it as complete to track your progress.
  </Step>
</Steps>

Learn more about recipes in the [Recipes](/building-apps/recipes) guide.

***

## Creating an app from a template

Templates are full app blueprints published by other users. They give you a working app to customize.

<Steps>
  <Step title="Browse templates">
    Click **New App** and switch to the templates view. Browse available templates created by your team or the community.
  </Step>

  <Step title="Select a template">
    Each template shows its name, description, and author. Click on a template to preview what it includes.
  </Step>

  <Step title="Create your copy">
    When you create an app from a template, you get a full, independent copy. Any changes you make do not affect the original template.
  </Step>
</Steps>

Learn more about templates in the [Templates](/building-apps/templates) guide.

***

## Naming your app

When you create an app, you give it a name. Vybe generates a URL-friendly slug from that name automatically.

* App names should be descriptive and concise (e.g., "Chargeback Tracker", "Sales Pipeline")
* The slug is used in your app's deployed URL: `appslug-orgslug.vybe.build`
* You can rename your app later from app settings, but the slug remains fixed after creation

<Warning>
  The app slug cannot be changed after creation. Choose a name you are comfortable keeping as the permanent URL identifier.
</Warning>

***

## What happens when you create an app

When you click create, Vybe handles the full setup automatically:

1. **Sandbox environment** — A sandboxed development environment spins up for your app
2. **Project scaffolding** — The AI generates a standard Next.js 15 project with pre-installed libraries (Shadcn UI, Tailwind CSS, Recharts, and more)
3. **Database provisioning** — Your app gets its own PostgreSQL database, ready for the AI to create tables and run queries
4. **Dev server start** — The Next.js development server starts automatically, and the live preview becomes available
5. **Git repository** — A Git repository is initialized to track every change the AI makes

The entire process takes a few seconds. Once complete, you are in the editor with a live preview and an active chat session ready for your first prompt.

***

## App settings

After creating your app, you can configure additional settings from the sidebar:

| Setting                 | Description                                               |
| ----------------------- | --------------------------------------------------------- |
| **Custom instructions** | Persistent context the AI reads before every interaction  |
| **Integrations**        | Connect services and databases your app needs             |
| **Access level**        | Control who in your organization can view or edit the app |
| **Workflows**           | Enable background jobs and scheduled tasks                |

***

## What's next

* Learn how to interact with the AI to build your app: [The AI Chat](/building-apps/ai-chat)
* Explore the editor interface: [The Editor](/getting-started/interface)
* Understand the live development environment: [Preview & Sandbox](/building-apps/preview-and-sandbox)
