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

# Quickstart

> Sign in, create a project, and ship your first OpenSail agent in five minutes

<img src="https://mintcdn.com/tesslate/VT6tbZolrCfpx26M/images/opensail-banner.png?fit=max&auto=format&n=VT6tbZolrCfpx26M&q=85&s=66579c47537b3464fb65b229cc9ab0fd" alt="Tesslate OpenSail" width="4712" height="1612" data-path="images/opensail-banner.png" />

This walkthrough uses the hosted cloud at [tesslate.com](https://tesslate.com). If you want to self-host, jump to the [Docker setup guide](/guides/docker-setup) or the [Desktop install guide](/guides/desktop-install) instead.

## Sign in

<Steps>
  <Step title="Create an account">
    Go to [tesslate.com](https://tesslate.com) and sign up with email or one of the OAuth providers (GitHub, Google).
  </Step>

  <Step title="Verify your email">
    Check your inbox for a verification link. The first account on a fresh self-hosted install is promoted to admin automatically.
  </Step>

  <Step title="Land on your dashboard">
    The dashboard lists every project you own or have been given access to. A new account starts empty.
  </Step>
</Steps>

## Create your first project

<Steps>
  <Step title="Click New project">
    Pick a source:

    <Tabs>
      <Tab title="Template">
        Start from a pre-wired base. Pick from Next.js, Vite+React+FastAPI, Vite+React+Go, Expo, and more.
      </Tab>

      <Tab title="Import">
        Paste a GitHub, GitLab, or Bitbucket URL. OpenSail clones the repo, detects the stack, and generates a `.tesslate/config.json` for the containers.
      </Tab>

      <Tab title="Describe">
        Tell OpenSail what you want in plain English. An agent proposes the stack, writes the scaffolding, and checks in.
      </Tab>
    </Tabs>
  </Step>

  <Step title="Wait for the container">
    Your project provisions a sandboxed container on a shared node. A loading overlay tracks progress; the container is usually ready in 10 to 30 seconds.
  </Step>

  <Step title="Open the builder">
    The workspace layout has four panels: file tree, editor, live preview, and chat. A kanban board, git viewer, and architecture canvas are one click away.
  </Step>
</Steps>

## Build with the agent

<Steps>
  <Step title="Open chat">
    The chat panel is docked at the bottom. Expand it to full height for longer sessions.
  </Step>

  <Step title="Describe the feature">
    Be specific. Good prompts describe the behavior, not the code. For example:

    ```
    Add a /api/contacts endpoint that returns a list of contacts from Postgres,
    ordered by last_interacted_at descending, paginated 20 per page.
    ```
  </Step>

  <Step title="Watch it work">
    The agent streams every step: file reads, edits, shell commands, test runs. You can interrupt, redirect, or roll back at any point.
  </Step>

  <Step title="See changes live">
    Files land on the project volume and the dev server reloads. The preview iframe updates without a refresh.
  </Step>
</Steps>

## Iterate and review

<Steps>
  <Step title="Keep chatting">
    Follow-up prompts build on the same context. The agent remembers decisions, reads files, and reasons about the whole project.
  </Step>

  <Step title="Review diffs">
    Every edit is a reviewable diff. Accept the change, reject it, or edit it yourself in Monaco.
  </Step>

  <Step title="Run and test">
    Use the terminal panel for manual commands. The agent can also run commands itself when given permission.
  </Step>

  <Step title="Commit">
    The git panel shows uncommitted changes. Write a message, commit, and optionally push to your remote.
  </Step>
</Steps>

## Ship it

Three common next steps:

<CardGroup cols={3}>
  <Card title="Deploy" icon="cloud-arrow-up" href="/guides/deployment-targets">
    Connect Vercel, AWS, Cloudflare, Fly, or another provider. Draw an edge from a container to a target.
  </Card>

  <Card title="Schedule" icon="clock" href="/guides/communication-gateways">
    Set the agent to run on cron and deliver reports to Slack or Telegram.
  </Card>

  <Card title="Publish" icon="store" href="/guides/publishing-apps">
    Turn the workspace into a one-click installable app on the marketplace.
  </Card>
</CardGroup>

## Learn more

<CardGroup cols={2}>
  <Card title="Core concepts" icon="compass" href="/guides/projects">
    Projects, workspaces, agents, marketplace, the Architecture Panel.
  </Card>

  <Card title="Using agents" icon="robot" href="/guides/using-agents">
    Conversation patterns, approval modes, skills, and connectors.
  </Card>

  <Card title="Architecture panel" icon="diagram-project" href="/guides/architecture-panel">
    Visual canvas that authors the `.tesslate/config.json` for your project.
  </Card>

  <Card title="Join Discord" icon="discord" href="https://discord.gg/qmrcHGNch7">
    Ask questions, share what you are building.
  </Card>
</CardGroup>

## Tips

<AccordionGroup>
  <Accordion icon="message-dots" title="Be specific in prompts">
    Describe behavior, not syntax. Include:

    * What the feature does
    * Inputs and outputs
    * Edge cases you care about
    * Any constraints (libraries, style, performance)
  </Accordion>

  <Accordion icon="arrows-rotate" title="Iterate in small steps">
    Ship something small that works, then expand. One prompt per feature beats one prompt for the whole app.
  </Accordion>

  <Accordion icon="shield-halved" title="Review before you run">
    OpenSail asks for approval before shell commands, git pushes, or network calls outside the allowlist. Review the diff, not just the chat summary.
  </Accordion>

  <Accordion icon="floppy-disk" title="Commit often">
    OpenSail autosaves, but git is still your history of record. Commit after each feature works.
  </Accordion>
</AccordionGroup>
