3d121c2e0843b854a95536986d08b50c5bf914cc
Use visualViewport API to dynamically resize the app container when the virtual keyboard opens, ensuring the input bar stays visible above the keyboard instead of being hidden behind it. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Spiceflow
A mobile-friendly web app for controlling AI coding assistants (Claude Code, OpenCode) remotely.
Your Phone/Browser <-> Spiceflow Server <-> Claude Code CLI (on your computer)
Quick Start
./script/dev # Start everything
# Backend: http://localhost:3000
# Frontend: http://localhost:5173
Architecture
┌─────────────────┐ HTTP/WS ┌──────────────────┐ stdin/stdout ┌─────────────────┐
│ Your Browser │ <──────────────> │ Spiceflow │ <─────────────────> │ Claude Code │
│ (SvelteKit) │ │ Server (Clojure)│ │ CLI │
└─────────────────┘ └────────┬─────────┘ └─────────────────┘
│
v
┌─────────────────┐
│ SQLite DB │
└─────────────────┘
Project Structure
spiceflow/
├── server/ # Clojure backend (API, database, CLI integration)
├── client/ # SvelteKit frontend (PWA, UI components)
└── e2e/ # Playwright tests
Key Concepts
| Concept | Description |
|---|---|
| Session | A conversation with Claude Code. Has messages, settings, and working directory. |
| Adapter | Code that talks to a CLI (Claude, OpenCode, tmux). |
| Permission | When Claude wants to edit files or run commands, you must approve. |
How a Message Flows
- Browser sends POST to
/api/sessions/:id/send - Server saves user message, starts CLI with
--resume - Server sends message to CLI stdin
- CLI outputs JSONL (one JSON per line)
- Server parses JSONL, broadcasts via WebSocket
- Browser shows streaming response
- Server saves assistant message when done
Features
Permission Handling
When Claude wants to edit files or run commands:
- Accept: Allow the action
- Deny: Block it
- Steer: Say "No, but do this instead..."
Auto-Accept Edits
Enable in session settings to auto-approve Write and Edit tools only. Does not auto-approve Bash, WebFetch, etc.
Tech Stack
| Layer | Technology |
|---|---|
| Backend | Clojure 1.11, Ring/Jetty, Reitit, SQLite |
| Frontend | SvelteKit 2.5, Svelte 4, TypeScript, Tailwind |
| Testing | Playwright, Kaocha |
Development
# Backend
cd server && clj -M:dev # REPL: (go), (reset), (stop)
clj -M:test # Unit tests
# Frontend
cd client && npm run dev # Dev server
npm run check # TypeScript
# E2E
cd e2e && npm test # Run tests
npm run test:ui # Interactive
Configuration
Environment variables or server/resources/config.edn:
| Variable | Default | Description |
|---|---|---|
SPICEFLOW_PORT |
3000 | Server port |
SPICEFLOW_HOST |
0.0.0.0 | Server host |
SPICEFLOW_DB |
spiceflow.db | SQLite path |
CLAUDE_SESSIONS_DIR |
~/.claude/projects | Claude sessions |
Description
Languages
Clojure
36.7%
TypeScript
31.4%
Svelte
28.5%
Shell
2.3%
CSS
0.6%
Other
0.5%