Kimix Web Frontend (src/app/)

SkillCommunication

Guide for the Kimix web frontend (src/app/) — vanilla TypeScript + Vite, SSE-based chat UI mirroring sse_cli.py. Use when modifying the frontend, adding new UI features, changing the API client, or understanding the message rendering pipeline.

Available today. Use it from your connected AI after setup.

Connect ahel once, and every AI you use reads what you have installed.

Then ask your AI: use the Kimix Web Frontend (src/app/) skill

What this skill tells your AI

The instructions your AI receives, as published by sikao-engine/kimix in .agents/skills/app/SKILL.md and read by ahel’s review.

Vanilla TypeScript + Vite chat UI mirroring sse_cli.py. Zero runtime deps; connects to the backend on port 4096 with poll-based SSE message streaming.

Key files: src/main.ts (glue/DOM/poll loop), src/client.ts (HTTP + SSE), src/types.ts (wire-format parsing), src/renderer.ts (message → HTML), src/styles.css (Catppuccin Mocha).

Commands:

cd src/app
npm run dev        # Vite dev server on port 5173
npm run build      # TypeScript check + production build → dist/
npm run preview    # Preview production build

Monorepo runner: uv run kimix gui (backend + Vite dev), --build, --fe-port 3000, --no-fe (backend only); uv run scripts/run_app.py delegates to kimix gui.

Adding a UI feature: backend endpoint (serve skill) → KimixClient method → index.html elements → wire in main.ts handleCommand() → optional new MessagePartType across types.ts/renderer.ts/styles.css.

Tests: cd src/app && npx tsx src/parse_test.ts (11 parse tests).

Full architecture, data flow, API client table, and styling details: read references/architecture.md.

Signals

GitHub stars
111
Forks
12
Last commit
Sep 2026
Advanced
Catalog kind
skill
Gateway key
app-sikao-engine
Source
github.com/sikao-engine/kimix