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

# Quickstart

> Get started with a fully working App in 5 minutes thanks to our starter template.

The easiest way to bootstrap a project is using our [🧠 Skill](/devtools/skills). To get a running codebase right away, you can use our starter template — it comes pre-configured with an MCP server, a basic UI view, and a full dev server with a local emulator and HMR.

<Tip>
  **New to ChatGPT or MCP Apps**? Read [Fundamentals](/fundamentals) first to understand the concepts.
</Tip>

<Tip>
  **Don't know if you should start with a ChatGPT or MCP App?** It doesn't matter! With Skybridge, you build your App once, and it runs seamlessly with both runtimes.
</Tip>

## Scaffold your project

Set up your app with a single command:

<CodeGroup>
  ```bash npm theme={null}
  npm create skybridge@latest my-app
  ```

  ```bash pnpm theme={null}
  pnpm create skybridge my-app
  ```

  ```bash yarn theme={null}
  yarn create skybridge my-app
  ```

  ```bash bun theme={null}
  bun create skybridge my-app
  ```

  ```bash deno theme={null}
  deno init --npm skybridge my-app
  ```
</CodeGroup>

<Info>
  **Prerequisites**

  Make sure you have:

  * **Node.js 24+**
  * Basic knowledge of **React** and **TypeScript**
  * Familiarity with **Zod** for schema validation (we'll use it for type-safe tool definitions)
</Info>

<Warning>
  **View Naming Convention**

  The view file name must match `view.component` in `registerTool`. See [registerTool](/api-reference/register-tool).
</Warning>

## Start the development server

Run the development server from the root directory:

<CodeGroup>
  ```bash npm theme={null}
  npm run dev
  ```

  ```bash pnpm theme={null}
  pnpm dev
  ```

  ```bash yarn theme={null}
  yarn dev
  ```

  ```bash bun theme={null}
  bun dev
  ```

  ```bash deno theme={null}
  deno task dev
  ```
</CodeGroup>

This runs the `skybridge` command, which starts a development server with the following features:

### What it does

The `skybridge` command:

* **Starts an Express server** on port 3000 that packages:
  * An MCP endpoint on `/mcp` - the App Backend
  * A React application on Vite HMR dev server - the App Frontend
* **Watches for file changes** using nodemon, automatically restarting the server when you modify server-side code

### Development workflow

When you run `skybridge`:

1. The server starts and displays the welcome screen in your terminal
2. You can access **DevTools** at `http://localhost:3000/` to test your app locally
3. The **MCP server** is available at `http://localhost:3000/mcp`
4. **File watching** is enabled - changes to server code will automatically restart the server
5. **Hot Module Reload (HMR)** is active for Views components - changes appear instantly in the host without reconnecting

### Exposing a public URL

When you need to connect a remote client like ChatGPT or Claude, pass the `--tunnel` flag:

<CodeGroup>
  ```bash npm theme={null}
  npm run dev -- --tunnel
  ```

  ```bash pnpm theme={null}
  pnpm dev --tunnel
  ```

  ```bash yarn theme={null}
  yarn dev --tunnel
  ```

  ```bash bun theme={null}
  bun dev --tunnel
  ```

  ```bash deno theme={null}
  deno task dev --tunnel
  ```
</CodeGroup>

Skybridge downloads and runs [Alpic tunnel](https://docs.alpic.ai/cli/tunnel) automatically, then prints a public `/mcp` URL and an LLM Playground `/try` URL. Add `--verbose` to stream tunnel logs.

## Next steps

<Card title="Test Your App" icon="flask-vial" href="/quickstart/test-your-app">
  Learn how to test your app locally, in ChatGPT and compatible MCP Clients.
</Card>