# How to Vibe Code Your Own Aight (and Stop Paying for It)

> The app for your AI agents

- Site: https://aight.cool
- Category: Developer Tools
- Platforms: iOS app, Android app, macOS app
- Verdict: **Solid side project** (68/100 vibecodeable)
- Estimated effort: 3-4 weeks of focused development and debugging

## Verdict

Build a personal subset for iOS and macOS using React Native and Expo, but expect significant debugging friction around secure WebSocket pairing and audio streaming.

Aight is fundamentally a thin, highly polished client control surface for local terminal agents. Vibecoding the React Native front end, chat UI, and dashboard panels with Expo is straightforward. However, establishing reliable, secure local network pairing (mDNS), configuring encrypted relay tunnels for remote access, and stitching together real-time audio pipelines for push-to-talk and local Whisper/ElevenLabs integration will require methodical, frustrating debugging sessions.

### What you can't replicate

- The App Store distribution footprint and brand recognition of Pangea Roads
- Multi-device synchronization infrastructure without paying for or configuring a relay server

## What it does

A secure client-side control surface and mobile application to remotely monitor, supervise, and direct local or self-hosted AI coding agents and gateways.

### Core features

- Multi-session chat management with persistent context and search
- Multi-agent group chats and team templates with @mention routing
- Voice mode with push-to-talk and local/cloud speech-to-text and text-to-speech
- Real-time system health monitoring (CPU, memory, disk, uptime)
- Token usage and API cost breakdown dashboard
- Local network mDNS agent discovery and secure WebSocket/relay communication

## The business

### Pricing

- Free: $0
- Aight Pro: $4.99/mo
Team size: Solo developer.

## The hard parts

- Designing low-latency, secure local network discovery (mDNS) and end-to-end encrypted WebSocket relays without a central cloud bottleneck
- Handling asynchronous audio streams for push-to-talk and continuous conversation loops across local and cloud STT/TTS models
- Parsing and rendering real-time streaming tool-call logs and multi-file diff outputs from distinct CLI agents (Claude Code, Codex)

## How to vibe code Aight

### Prerequisites

- Node.js (free): Required runtime for Expo and React Native tooling.
- Expo (free): Cross-platform mobile framework for building iOS and Android apps in TypeScript.
- GitHub (free): Source control and CI/CD version management.

### Recommended AI tools

- Cursor: AI code editor ideal for rapidly scaffolding React Native UI components, navigation, and state management.
- Claude Code: Terminal-based AI coding agent best-in-class for multi-file architectural refactors and complex debugging loops.

### Stack

- Frontend: React Native with Expo (TypeScript)
- Backend: Node.js + WebSockets running locally on the user's machine/gateway
- Database: AsyncStorage / SQLite for local session and settings persistence
- Auth: None (local pairing key / token exchange)
- Payments: RevenueCat (for optional In-App Purchases)
- Other: Expo AV for voice recording and playback, mDNS discovery modules for local network scanning

### Hosting

- Fly.io (Hosting the optional encrypted WebSocket relay server for remote access outside the local network): $2-5/mo

### Build guide

1. **Project Scaffolding & Design System** — Initialize a new Expo React Native project with TypeScript and file-based routing. Establish the dark-mode aesthetic (Lime theme accents, deep neutral backgrounds, clean typography), and configure standard layout primitives for mobile screens.

```
Create a new Expo React Native app using TypeScript with Expo Router. Structure the directory with app/(tabs) for navigation screens (Chats, Teams, Gateway, Settings). Implement a strict design system supporting a custom dark theme with neon lime accents, high-contrast monospace fonts for code blocks, and touch-optimized components.
```

2. **Local Agent Gateway Protocol & Secure Pairing** — Define the JSON-over-WebSocket protocol contract between the mobile client and the local agent gateway. Build UI flows for manual URL input and QR-code/pairing token verification.

```
Write a TypeScript WebSocket client manager in React Native that handles automatic reconnection, heartbeat pings, and message serialization for agent commands. Implement a connection settings screen allowing users to input a local gateway URL (e.g., ws://192.168.1.50:8080) and authenticate using a shared secret token stored securely in Expo SecureStore.
```

3. **Multi-Session Chat & Streaming Terminal Output** — Implement the chat interface supporting multiple active sessions, unread badges, search filters, and real-time streaming markdown rendering with live tool-call log inspections.

```
Build a high-performance chat interface in React Native using FlashList to render streaming messages from AI coding agents. Support markdown parsing, syntax highlighting for code blocks, expandable accordion cards for tool-call execution logs, and a session management drawer with search filtering and unread count badges.
```

4. **Multi-Agent Group Chats & @Mention Routing** — Build shared group chat workspaces allowing users to @mention specific agent roles (e.g., @dev, @reviewer) and route task delegations across teams.

```
Implement a group chat screen supporting multi-agent threads. Add an autocomplete dropdown triggered by '@' to select pre-built team members or custom agents. Ensure message payloads correctly indicate target agent IDs and render multi-agent conversation turns sequentially in a shared thread view.
```

5. **Voice Mode & Audio Streaming Pipeline** — Integrate Expo AV audio recording for push-to-talk functionality, streaming audio chunks to local Whisper STT or cloud speech endpoints, and handling audio playback for responses.

```
Integrate expo-av to support push-to-talk audio recording. When the user holds the record button, stream audio blobs over the WebSocket connection to the local gateway for transcription. Implement an animated voice orb component that reacts to audio input levels during active conversational loops.
```

6. **Gateway Health & Usage Monitoring Dashboard** — Construct the dashboard view displaying real-time system metrics (CPU, memory, disk usage, uptime) and token usage cost breakdowns received from the agent gateway.

```
Create a system monitoring and token usage dashboard screen. Render real-time gauges and progress bars for target machine CPU, memory, and disk utilization fetched via gateway telemetry events. Include a cost breakdown card displaying aggregate token consumption aggregated by session and model.
```

### Cost vs paying

**Starting costs (one-time):**

- Apple Developer Account (if publishing to device/App Store): $99/yr
- Total: ~$119 one-time

**Ongoing costs (monthly):**

- Fly.io Relay VM (optional for remote access): $3/mo
- Total: ~$3/mo

- Paying for the SaaS instead: $4.99/mo
- Build time: 40-60 hours
- AI tool credits: $20-40 (Cursor/Claude API credits)
- Break-even: Never (built for personal control and learning)

## Sources

- [Aight Official Website](https://aight.cool)
- [Apple App Store - Aight: Manage your AI Agents](https://apps.apple.com/app/aight-manage-your-ai-agents/id6758570441)