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

# Build with Reactor

> The developer platform for real-time world models

<Frame>
  <img src="https://mintcdn.com/reactortechnologiesinc/5kBYC6Bj7pWy1ZwU/images/rea-156.webp?fit=max&auto=format&n=5kBYC6Bj7pWy1ZwU&q=85&s=eb46c040787e97e6071586d3e4a919d7" alt="A lone figure walking down a misty avenue of tall trees" width="1280" height="768" data-path="images/rea-156.webp" />
</Frame>

Reactor makes it easy to build applications with real-time world models. In just a few lines of code, you connect to a model, receive live video, and send commands to steer what it generates while it runs, enabling entirely new types of applications that were not possible before.

<div className="rea-stats">
  <div className="rea-stat">
    <span className="rea-stat-value">\<1s</span>
    <span className="rea-stat-label">Round-trip latency</span>
  </div>

  <div className="rea-stat">
    <span className="rea-stat-value">Zero</span>
    <span className="rea-stat-label">Infrastructure to manage</span>
  </div>

  <div className="rea-stat">
    <span className="rea-stat-value">1,000s</span>
    <span className="rea-stat-label">of GPUs, on demand</span>
  </div>
</div>

Connect to Reactor's SDK and immediately start steering real-time video:

<CodeGroup>
  ```typescript JavaScript theme={"theme":{"light":"github-light","dark":"github-dark-high-contrast"}}
  import { Reactor } from "@reactor-team/js-sdk";

  const video = document.querySelector("video")!;
  const reactor = new Reactor({ modelName: "helios" });

  // Render frames as soon as they arrive.
  reactor.on("trackReceived", (name, track) => {
    if (name !== "main_video") return;
    video.srcObject = new MediaStream([track]);
    void video.play();
  });

  // Once the session is ready, set a prompt and start generating.
  reactor.on("statusChanged", async (status) => {
    if (status !== "ready") return;
    await reactor.sendCommand("set_prompt", { prompt: "A serene mountain landscape at sunrise" });
    await reactor.sendCommand("start", {});
  });

  const jwt = await getToken(); // token minted on your server
  await reactor.connect(jwt);
  ```

  ```tsx React theme={"theme":{"light":"github-light","dark":"github-dark-high-contrast"}}
  import { ReactorProvider, ReactorView, useReactor } from "@reactor-team/js-sdk";
  import { useEffect } from "react";

  function Studio() {
    const { status, sendCommand } = useReactor((s) => ({
      status: s.status,
      sendCommand: s.sendCommand,
    }));

    // Once the session is ready, set a prompt and start generating.
    useEffect(() => {
      if (status !== "ready") return;
      sendCommand("set_prompt", { prompt: "A serene mountain landscape at sunrise" });
      sendCommand("start", {});
    }, [status]);

    return <ReactorView className="w-full aspect-video" />;
  }

  export default function App({ token }: { token: string }) {
    // token is minted on your server
    return (
      <ReactorProvider modelName="helios" jwtToken={token} connectOptions={{ autoConnect: true }}>
        <Studio />
      </ReactorProvider>
    );
  }
  ```

  ```python Python theme={"theme":{"light":"github-light","dark":"github-dark-high-contrast"}}
  import asyncio
  import os
  from reactor_sdk import Reactor

  async def main():
      async with Reactor(model_name="helios", api_key=os.environ["REACTOR_API_KEY"]) as reactor:
          # Receive decoded frames as NumPy arrays.
          @reactor.on_frame
          def on_frame(frame):
              ...

          await reactor.connect()

          # Set a prompt and start generating.
          await reactor.send_command("set_prompt", {"prompt": "A serene mountain landscape at sunrise"})
          await reactor.send_command("start", {})

  asyncio.run(main())
  ```
</CodeGroup>

Or scaffold a complete, runnable app — SDK installed and secure auth already wired up — in one command:

```shell theme={"theme":{"light":"github-light","dark":"github-dark-high-contrast"}}
npx create-reactor-app my-app --model=helios
```

## Start building

<CardGroup cols={3}>
  <Card title="Quickstart" icon="zap" href="/quickstart">
    Stream real-time AI video into your app in a few minutes.
  </Card>

  <Card title="Using the SDK" icon="code" href="/sdk-reference/using-the-sdk">
    Connect and steer models from JavaScript, React, or Python.
  </Card>

  <Card title="Explore the models" icon="wand-sparkles" href="/model-api-reference/overview">
    See what Helios and LingBot generate, and the commands that drive them.
  </Card>
</CardGroup>

<Note>
  **Reactor is in beta.** SDKs, APIs, and models are evolving, and breaking changes can land between releases. Pin your SDK versions, and let us know what you build. Your feedback in [Discord](https://discord.gg/EEYMFbGuDW) shapes what ships next.
</Note>