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

# Quickstart: Deploy Your AI SaaS App in 15 Minutes

> Step-by-step guide to clone the Starter Kit, connect to Cloud API, and launch your first AI application. Includes authentication, dashboard, and AI generation.

<Check>
  **Goal:** In 15 minutes you'll have a working AI SaaS application connected to the backend with management console and user dashboards.
</Check>

## What You'll Build

By the end of this guide, you'll have:

* ✅ A developer account with Admin Console access
* ✅ A local Starter Kit connected to the Cloud API
* ✅ Working authentication and user dashboard
* ✅ AI generation endpoints ready to use
* ✅ Platform ready for Stripe payment integration

**Time required:** 15 minutes

<Info>
  **Prerequisites:** Node.js 19 or later, a GitHub account, and access to the hosted Cloud Admin at [devkit4ai.com/console](https://devkit4ai.com/console) or [vibecoding.ad/console](https://vibecoding.ad/console).
</Info>

## Launch in Five Steps

<Steps>
  <Step title="Create a developer workspace">
    Visit [devkit4ai.com/register/developer](https://devkit4ai.com/register/developer) (or the [vibecoding.ad](https://vibecoding.ad/register/developer) equivalent) and complete the registration flow. The backend automatically provisions your developer account, default project, and API credentials as soon as the confirmation succeeds.
  </Step>

  <Step title="Collect your credentials">
    After signing in, open the Console dashboard. Copy the generated **developer key**, **project ID**, and **project API key**. These values are stored securely in the backend as hashed secrets and surface once in the UI, so save them to your password manager.
  </Step>

  <Step title="Clone and install the Starter Kit">
    ```bash theme={null}
    git clone https://github.com/VibeCodingStarter/starter-kit.git
    cd starter-kit
    make install   # or npm install
    ```

    The Starter Kit is built with Next.js 15 and requires Node.js 19+ with Turbopack.
  </Step>

  <Step title="Configure environment variables">
    Create `.env.local` (or update the existing example) with the credentials you gathered:

    ```bash theme={null}
    DEVKIT4AI_MODE=project
    NEXT_PUBLIC_API_URL=https://api.vibecoding.ad
    DEVKIT4AI_DEVELOPER_KEY=dk_your_developer_key
    DEVKIT4AI_PROJECT_ID=00000000-0000-0000-0000-000000000000
    DEVKIT4AI_PROJECT_KEY=ak_your_project_key
    ```

    The `NEXT_PUBLIC_API_URL` should match the region of the hosted Cloud API you are targeting.

    <Warning>
      **Common mistakes:**

      * Using quotes around values (remove them)
      * Wrong PROJECT\_ID format (must be a valid UUID)
      * Mixing up developer key and project key
      * Incorrect API URL (check for https\:// and no trailing slash)
    </Warning>
  </Step>

  <Step title="Run the development server">
    ```bash theme={null}
    make dev   # boots npm run dev with Turbopack on port 3004
    ```

    Sign in using the same credentials you created in Cloud Admin. You will land on `/dashboard`, which confirms your app is connected to the hosted Cloud API successfully.
  </Step>
</Steps>

## Verify Your Setup

Use the Cloud API health check to confirm your configuration is correct:

```bash theme={null}
curl https://api.vibecoding.ad/api/v1/health \
  -H "X-User-Role: end_user" \
  -H "X-Developer-Key: dk_your_developer_key" \
  -H "X-Project-ID: 00000000-0000-0000-0000-000000000000" \
  -H "X-API-Key: pk_your_project_key"
```

You should receive a JSON payload indicating the service status. Any authentication errors mean an environment variable is missing or mis-typed.

## Success Checklist

You're ready to customize when:

* [ ] You can sign in at `localhost:3004/login`
* [ ] Dashboard loads without configuration errors
* [ ] Health check curl command returns `{"status": "healthy"}`
* [ ] You see your project in the Cloud Admin console

<Tip>
  **What you learned:** You've successfully set up a developer account, cloned the Starter Kit, connected it to the Cloud API, and verified the integration. You now have a production-ready foundation for building AI features.
</Tip>

## Next Steps

### Recommended Path

<Card title="Build Your First AI Feature" icon="sparkles" href="/tutorials/first-app/customize-ui">
  **Next:** Follow the First App tutorial to add custom UI and implement your first AI generation feature.
</Card>

### Learn More

<CardGroup cols={2}>
  <Card title="Customize the Starter Kit" icon="palette" href="/starter-kit/customization/branding-styling">
    Update branding, colors, and styling to match your product.
  </Card>

  <Card title="Add Subscription Billing" icon="credit-card" href="/getting-started/features/payment-setup">
    Configure Stripe to monetize your AI application.
  </Card>

  <Card title="Explore Cloud Admin" icon="building" href="/cloud-admin/dashboard-overview">
    Learn to manage projects, API keys, and payments.
  </Card>

  <Card title="Deploy to Production" icon="rocket" href="/starter-kit/deployment/production-build">
    Deploy your application to Vercel, Netlify, or your own hosting.
  </Card>
</CardGroup>