Introduction
HaloLight is a multi-framework enterprise-level admin dashboard solution.
What is HaloLight
HaloLight follows the philosophy of "one design specification, multiple framework implementations", providing developers with a unified Admin Dashboard experience. Whether you use React, Vue, Angular, or other modern frameworks, you'll get consistent functionality and design.
Core Features
Draggable Dashboard
Custom Dashboard system based on Grid Layout, supporting:
- Widget drag and drop arrangement
- Responsive layout adaptation
- Layout state persistence
Permission Control
Complete RBAC permission management system:
- Fine-grained permission control (page/button level)
- Wildcard permission matching (
users:*,*) - Dynamic menu rendering
Theme System
Rich visual customization capabilities:
- 11 skin presets
- Light/Dark mode switching
- View Transitions animation effects
Component Library
Based on shadcn/ui design system:
- 30+ beautiful UI components
- Complete form/table solutions
- Highly customizable
Frontend-Backend Any Combination
- 98 Combination Options: 14 frontend frameworks × 7 backend APIs, choose freely based on team tech stack or business scenarios
- BFF/Gateway Decoupling: Optional tRPC, GraphQL Gateway for aggregation, authentication & simplification
- Upgrade Without Lock-in: Replace any frontend or backend while maintaining contract compatibility
- Independent Evolution: Frontend can choose SSR/SSG/SPA, backend can choose monolith/microservices/serverless
Framework Implementations
All framework versions have been implemented and deployed (preview links available in respective repository READMEs). Current reference implementations:
| Framework | Status | Preview | Repository |
|---|---|---|---|
| Next.js 14 | ✅ Deployed | Preview | GitHub |
| React (Vite) | ✅ Deployed | Preview | GitHub |
| Vue 3.5 | ✅ Deployed | Preview | GitHub |
| Angular 21 | ✅ Deployed | Preview | GitHub |
| Nuxt 4 | ✅ Deployed | Preview | GitHub |
| SvelteKit 2 | ✅ Deployed | Preview | GitHub |
| Astro 5 | ✅ Deployed | Preview | GitHub |
| Solid.js | ✅ Deployed | Preview | GitHub |
| Qwik | ✅ Deployed | Preview | GitHub |
| Remix | ✅ Deployed | Preview | GitHub |
| Preact | ✅ Deployed | Preview | GitHub |
| Lit | ✅ Deployed | Preview | GitHub |
| Fresh (Deno) | ✅ Deployed | Preview | GitHub |
| Deno | ✅ Deployed | Preview | GitHub |
💡 Flexible Combinations: Frontend mainline supports 14 frameworks, any frontend can combine with 7 backend APIs, forming 98+ combination options.
Backend API Implementations
| Backend Tech | Status | Preview | Repository |
|---|---|---|---|
| NestJS 11 | ✅ Deployed | API Docs | GitHub |
| Python FastAPI | ✅ Deployed | API Docs | GitHub |
| Java Spring Boot | ✅ Deployed | API Docs | GitHub |
| Go Fiber | ✅ Deployed | API Docs | GitHub |
| Node.js Express | ✅ Deployed | - | GitHub |
| PHP Laravel | ✅ Deployed | - | GitHub |
| Bun + Hono | ✅ Deployed | - | GitHub |
Middleware / Full-Stack
| Project | Status | Description | Repository |
|---|---|---|---|
| tRPC BFF | ✅ Deployed | Type-safe gateway | GitHub |
| Next.js Action | ✅ Deployed | Server Actions full-stack | GitHub |
Tech Stack
All framework versions share the following tech stack:
- TypeScript - Type safety
- Tailwind CSS - Atomic CSS
- shadcn/ui - UI component library
- TanStack Query - Server state management
- ECharts - Chart visualization
- Mock.js - Data simulation
Next Steps
- Quick Start - Choose a framework version to start
- Next.js Version - Learn more about Next.js implementation
- Vue Version - Learn more about Vue implementation
- Development Docs - Learn about shared design specifications