stave-code

Stave Code provides a full-featured live-coding environment tailored for creative coding in music and visuals. It integrates tightly with Strudel, Sonic Pi, p5.js, and Hydra, offering a VS Code-like interface including tabs, split panes, command palette, and zen mode — all without iframe boundaries. Inline visualizers render directly between code lines via .viz("name") syntax, enabling real-time feedback synchronized with patterns. The editor supports syntax highlighting, autocomplete, global search, and customizable keyboard shortcuts. Audio features include direct integration with @strudel/core and @strudel/webaudio, active-note highlighting, per-track analyzers, and runtime error display within the editor. Visualizers can be named, reused, and hot-reloaded; built-ins include spectrum, oscilloscope, pianoroll, and more. Projects are stored locally using Yjs + y-indexeddb, supporting folders, version history, and ZIP import/export. Export options include fast-rendered WAV files and multi-stem exports. The core editor is available as a React component library for embedding into other apps. Built with React 19, Next.js 16 (Turbopack), TypeScript, and Monaco Editor, it runs locally or hosted at stave.live. Prerequisites: Node 18+, pnpm 9+.