Getting Started

This is the common setup for every TelemetryOS application. Install the Developer App, create a project, and confirm the preview works. At the end, pick the workflow that suits how you work: write the code yourself, or direct an AI agent to write it for you.

Prerequisites

• A macOS, Windows, or Linux computer
• A TelemetryOS Studio account
• The TelemetryOS Developer App (installed in the next step)
• Either a code editor (VS Code, Cursor, Zed, WebStorm, etc.) for Manual Development, or an AI coding agent (Claude Code, Codex) for AI Agent Development — or both, if you plan to combine them

The Developer App bundles a managed Node.js runtime, so a separate Node.js installation is not required.

Install the Developer App

In TelemetryOS Studio, open the Applications page and click Get Developer App. Download the installer for your operating system and run it. Launch the Developer App when installation completes — you'll land on the Welcome screen.

For the full tour of the app's canvas controls, shortcuts, and tools, see Developer App.

Create Your First Project

From the Welcome screen, click New Project. In the dialog:

• Project Name — lowercase letters, numbers, and hyphens (e.g. my-weather-app). The Developer App auto-converts input to kebab-case.
• Template — pick one:
  • Render + Settings — display view + configuration sidebar. Covers most applications.
  • Render + Settings + Web — adds a browser-accessible web mount point for staff dashboards or public interfaces.
• Description — a short description, shown in Studio.

Click Create. The Developer App scaffolds the project, installs dependencies, initializes a Git repository, and opens it in a project window. The dev server starts automatically and your app appears on the simulated device canvas.

For project layout details — templates, generated files, telemetry.config.json, workers, containers — see Project Structure.

Confirm the Preview Works

The project window has three main areas: the canvas (center) showing your render mount point at a selectable aspect ratio, the settings sidebar (right) showing your settings view, and a bottom toolbar for cycling aspect ratios and backgrounds.

A few shortcuts to get oriented:

Full canvas reference: Developer App.

Pick Your Workflow

Every new project is pre-configured for both workflows. The scaffolded files include:

• A standard React + TypeScript + Vite setup for hand-editing.
• .mcp.json, .claude/settings.local.json, and CLAUDE.md for AI agent integration.

Keep or ignore the agent files based on how you plan to work. Nothing breaks in the manual path if you leave them; they only activate when an agent connects.

Combining both works too — describe the shape with an agent, then hand-tune details in your editor. The track pages cover each flow in depth; pick the one you'll start with.

After You've Built Something

Every application eventually deploys the same way: push to GitHub and connect the repo in Studio, or upload an Archive .tar.gz. See Deploying when you're ready.

Reference