FeaturesTemplatesShowcaseTownie
AI
BlogDocsPricing
Log inSign up
yisding

yisding

hello-realtime-video

Remix of jubertioai/hello-realtime
Public
Like
2
hello-realtime-video
Home
Code
9
.claude
frontend
1
routes
3
.gitignore
.vtignore
CLAUDE.md
README.md
deno.json
H
main.tsx
Branches
1
Pull requests
Remixes
3
History
Environment variables
1
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in milliseconds.
Sign up now
Code
/
CLAUDE.md
Code
/
CLAUDE.md
Search
8/29/2025
Viewing readonly version of main branch: v35
View latest version
CLAUDE.md

CLAUDE.md

This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.

Project Overview

Hello Realtime is an OpenAI Realtime API demo application supporting WebRTC users. It's built on Val Town's Deno runtime with TypeScript and uses the Hono framework for routing.

Commands

Development

  • Run locally: Deploy to Val Town platform - no local dev server
  • Test deployment: Visit https://hello-realtime.val.run for WebRTC
  • Format Run deno fmt

Architecture

Core Components

  1. Main Entry Point (main.tsx)

    • Hono app with route mounting
    • Routes: /rtc, /sip, /observer
    • Serves frontend from /frontend/index.html
  2. WebRTC Route (routes/rtc.ts)

    • Creates OpenAI Realtime calls via POST to /rtc
    • Handles SDP offer/answer exchange
    • Triggers observer WebSocket connection
  3. Observer Route (routes/observer.ts)

    • Establishes WebSocket connection to OpenAI
    • Monitors call events and transcripts
    • Auto-sends response.create after connection
  4. Utilities (routes/utils.ts)

    • makeHeaders(): Adds OpenAI API authentication
    • makeSession(): Configures Realtime session with model, instructions, and voice settings

Frontend

  • Single-page vanilla JavaScript application (frontend/index.html)
  • WebRTC peer connection management
  • Real-time status indicators and logging
  • No external dependencies or build process

Environment Variables

Required:

  • OPENAI_API_KEY: For all OpenAI API calls

Val Town Specifics

  • Uses Val Town's file reading utilities from https://esm.town/v/std/utils@85-main/index.ts
  • Deno runtime with TypeScript support
  • No local development server - deploy directly to Val Town
  • Import npm packages via npm: prefix (e.g., npm:hono)

Key Implementation Details

  • OpenAI Realtime model: gpt-realtime
  • Voice: marin (configurable in utils.ts)
  • Audio configuration includes noise reduction for near-field devices
  • WebSocket messages are logged except for audio transcript deltas
  • Observer automatically triggers 250ms after connection
FeaturesVersion controlCode intelligenceCLI
Use cases
TeamsAI agentsSlackGTM
ExploreDocsShowcaseTemplatesNewestTrendingAPI examplesNPM packages
PricingNewsletterBlogAboutCareersBrandhi@val.townStatus
X (Twitter)
Discord community
GitHub discussions
YouTube channel
Bluesky
Terms of usePrivacy policyAbuse contact
© 2025 Val Town, Inc.