uzdb/doc/README.md

uzdb Project Documentation

📚 Documentation Index

This directory contains all design and specification documents for the uzdb project.

Core Documents

Document	Description	Status
Features	Complete feature specification with priorities	✅ Complete
Design System	Visual design language, colors, typography, components	✅ Complete
Wireframes	UI mockups and layout specifications	✅ Complete
User Flows	User interaction flows and edge cases	✅ Complete

---

🎯 Project Overview

uzdb is a lightweight database management tool inspired by DBeaver and Navicat, built with Wails (Go + React).

Key Characteristics

• Lightweight: Fast startup, minimal resource usage
• Simple: Focus on essential features done well
• Modern: Clean UI following current design trends
• Cross-platform: Windows, macOS, Linux support via Wails

Tech Stack

• Frontend: React + TypeScript + Vite
• Backend: Go 1.23+
• Desktop Framework: Wails v2
• Styling: CSS Variables + modern CSS

---

🏗️ Architecture

┌─────────────────────────────────────────┐
│           Frontend (React)              │
│  ┌──────────┬──────────┬──────────────┐ │
│  │ Sidebar  │  Editor  │   Data Grid  │ │
│  │          │          │              │ │
│  └──────────┴──────────┴──────────────┘ │
│            Wails Runtime                │
├─────────────────────────────────────────┤
│            Backend (Go)                 │
│  ┌──────────┬──────────┬──────────────┐ │
│  │  MySQL   │PostgreSQL│    SQLite    │ │
│  │  Driver  │  Driver  │    Driver    │ │
│  └──────────┴──────────┴──────────────┘ │
└─────────────────────────────────────────┘

---

📁 File Structure

uzdb/
├── frontend/           # React application
│   ├── src/
│   │   ├── components/ # UI components
│   │   ├── App.tsx     # Main app component
│   │   └── main.tsx    # Entry point
│   └── package.json
├── doc/               # This directory - design docs
│   ├── features.md
│   ├── design-system.md
│   ├── wireframes.md
│   ├── user-flows.md
│   └── README.md      # This file
├── internal/          # Go backend code
├── main.go            # Go entry point
└── wails.json         # Wails configuration

---

🎨 Quick Reference

Color Palette

• Primary: #3b82f6 (Blue)
• Success: #10b981 (Green)
• Warning: #f59e0b (Amber)
• Error: #ef4444 (Red)

Keyboard Shortcuts

Action	Shortcut
Run query	Ctrl/Cmd + Enter
New connection	Ctrl/Cmd + N
Save	Ctrl/Cmd + S
Find	Ctrl/Cmd + F
Close tab	Ctrl/Cmd + W

Supported Databases

• ✅ MySQL 5.7+
• ✅ PostgreSQL 12+
• ✅ SQLite 3.x

---

👥 Team Roles

UI/UX Designer

• Responsible for visual design and user experience
• Maintains design system consistency
• Creates wireframes and prototypes

See: .qoder/agents/uiux-designer.md

Frontend Developer

• Implements React components
• Integrates with Wails runtime
• Ensures responsive design

Backend Developer

• Implements database drivers
• Handles Go business logic
• Manages connections and queries

---

📋 Development Workflow

1. Design Phase

1. Review feature requirements
2. Create/update wireframes
3. Define component specs
4. Get team approval

2. Implementation Phase

1. Create React components
2. Implement Go handlers
3. Write tests
4. Integration testing

3. Review Phase

1. Design review against specs
2. Code review
3. QA testing
4. Bug fixes

---

🔗 Related Resources

Design Tools

• Figma - UI design and prototyping
• Lucide Icons - Icon library
• Inter Font - Primary typeface

Development

• Wails Documentation
• React Docs
• TypeScript Handbook

Inspiration

• DBeaver - Feature reference
• Navicat - UX reference
• TablePlus - Modern design reference

---

📝 Contributing

When adding new features:

1. Update documentation in this directory
2. Follow design system for consistency
3. Consider accessibility requirements
4. Test with real data before merging

---

📞 Contact

For questions about design or features:

• Open an issue on GitHub
• Tag @uiux-designer for design questions
• Tag @maintainer for feature discussions

---

Last updated: 2026-03-29