majiayu000 Quest Keeper Frontend Development
Location
C:\Users\mnehm\Desktop\Quest Keeper AI attempt 2
Tech Stack
- Framework: Tauri 2.x (Rust shell + WebView)
- UI: React 19 + TypeScript + Vite
- State: Zustand stores
- 3D: Three.js via @react-three/fiber
- Styling: TailwindCSS (terminal/CRT aesthetic)
Directory Structure
src/
├── components/
│ ├── viewport/ # BattlemapCanvas, CharacterSheet, WorldMap
│ ├── adventure/ # Main layout (AdventureView.tsx)
│ ├── terminal/ # Chat interface
│ └── sidebar/ # Navigation
├── stores/ # Zustand state management
├── services/ # MCP client, LLM providers
├── hooks/ # Custom React hooks
└── utils/ # Helpers
Key Commands
npm run tauri dev # Development with hot reload
npm run build # Production build
MCP Response Parsing
import { parseMcpResponse } from '@/utils/mcpUtils';
const result = await mcpClient.callTool('get_character', { id });
const character = parseMcpResponse<Character>(result, null);
Terminal/CRT Aesthetic
Key classes: terminal-green, terminal-dim, terminal-dark, crt-glow, font-mono