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

# Get started

> Prompting is how you guide Rocket.new using natural language. Learn the basics and start building immediately.

export const LlmsDirective = () => <blockquote className="llms-directive">
    For the complete documentation index, see <a href="/llms.txt">llms.txt</a>.
    For a lightweight markdown version of this page, append .md to the URL.
  </blockquote>;

<LlmsDirective />

<Info>
  Prompting is how you tell Rocket what you want, clearly, in plain English. You describe the goal and Rocket turns it into UIs, workflows, and fixes.

  The clearer your prompt, the more precise the output.

  This page covers:

  * What prompting is and how Rocket interprets it
  * Examples of effective prompts
  * Common mistakes to avoid
</Info>

## Why prompting matters

Prompting is the foundation of everything you do in Rocket. With a few words, you can:

* Create an app from scratch
* Edit or expand existing screens
* Automate logic and workflows
* Debug issues and fix behavior
* Move between design and implementation

<Tip>
  The **S.I.M.P.L.E.** checklist from [Core concepts](/learn/guides/core-concepts) helps you write prompts that are specific, focused, and easy to debug.
</Tip>

## What happens when you prompt

Rocket interprets your prompt across three layers:

<CardGroup cols={2}>
  <Card title="Intent" icon="lightbulb" horizontal>
    What are you trying to achieve?
  </Card>

  <Card title="Structure" icon="table-layout" horizontal>
    What UI, data, or logic elements are involved?
  </Card>

  <Card title="Output" icon="code" horizontal>
    What should Rocket generate, and how?
  </Card>
</CardGroup>

### Prompt examples

<CodeGroup>
  ```plaintext Creating UI wrap theme={null}
  Create a welcome screen with a short headline, one sentence of text, and a big button that says "Get started".
  ```

  ```plaintext Adding logic wrap theme={null}
  When someone books a session, save their name and time, show a thank-you message, and send a calendar invite.
  ```

  ```plaintext Debugging wrap theme={null}
  The "Next" button is not working on the sign-up screen. Make sure it is visible, clickable, and linked to the next step.
  ```
</CodeGroup>

<Tip>
  Start with: "What should this app, screen, or feature do?" Then describe it in one clear sentence.
</Tip>

<Tip>
  After creating, use [`/` commands](/build/editor/commands) to make targeted edits. For edits scoped to specific files, use [@ commands](/build/editor/commands).
</Tip>

## Try it now

Copy one of these prompts and paste it into Rocket to see results:

<CodeGroup>
  ```plaintext Landing page wrap theme={null}
  Create a landing page with:
  - Hero section: headline "Welcome to [Your App Name]", subheadline, and primary CTA (Call To Action) button "Get Started"
  - Features section: 3 feature cards in a row with icons, titles, and descriptions
  - Final CTA section before footer
  Use a clean, modern design with plenty of white space.
  ```

  ```plaintext Dashboard wrap theme={null}
  Create a dashboard layout with:
  - Top: header with title and "New" button
  - Middle: three metric cards in a row showing key stats
  - Bottom: a table or list showing recent activity
  Use consistent spacing (16px padding) and a card-based layout.
  ```

  ```plaintext Form wrap theme={null}
  Create a form with:
  - Fields: name (required), email (required), message (optional)
  - All inputs stacked vertically with 16px spacing
  - Submit button below the fields
  - Show inline error messages under invalid fields
  ```
</CodeGroup>

<Tip>
  After creating, use [commands](/build/editor/commands) to change branding or apply your color scheme across all pages.
</Tip>

## Common prompt mistakes

Even if your idea is clear in your head, Rocket only sees what you type. Here are two patterns to avoid:

### Being vague

<Warning>
  **Do not do this:** "Make a screen that shows some user data."
</Warning>

**Instead, be specific:**

```plaintext wrap theme={null}
Create a dashboard that shows name, email, and last login date from the `users` table.
```

### Asking for too much at once

<Warning>
  **Do not do this:** "Create the UI, add logic, fix responsiveness, and make it look good."
</Warning>

**Instead, focus on one task at a time:**

```plaintext wrap theme={null}
Build just the layout for now. I will add logic next.
```

<Tip>
  Three key principles for effective prompting:

  1. **Be specific** - Say exactly what you want, not just how it should "feel"
  2. **Stay focused** - Tackle one idea at a time. Break complex tasks into smaller prompts
  3. **Add context** - Include meaningful details: layout, behavior, data sources, interactions

  For more examples and patterns, see [Core concepts](/learn/guides/core-concepts).

  Need ready-to-use prompts? Browse the [Prompt library](/learn/guides/prompt-library). Running into issues? Check the [Debugging guide](/learn/guides/debugging).
</Tip>