soybeanjs/soybean-admin
Soybean Admin
Soybean Admin is a type-safe frontend management boilerplate and dashboard template built with Vue 3, Vite, and TypeScript. It provides a pre-configured foundation for creating enterprise administrative interfaces, utilizing the NaiveUI component framework and UnoCSS for utility-first styling.
The project distinguishes itself through automated workflow tools, including file-system-based route generation and a command-line interface for automating git commits and project deployments. It implements a comprehensive security model featuring both static and dynamic role-based access control to restrict page navigation and menu visibility.
The platform covers a broad range of administrative capabilities, including internationalization for multilingual support, responsive layout design for mobile optimization, and data visualization via integrated charts and complex data tables. It also includes system utilities for user session management, encrypted local storage, and a multi-tab interface for application navigation.
Features
- Administrative Interfaces - Provides a comprehensive set of pre-built layout components and themed templates for composing backend management screens.
- Admin Dashboard Boilerplates - Provides a comprehensive pre-configured boilerplate for building enterprise-grade backend administrative interfaces.
- Management Tables - Implements complex data tables with fixed columns, pagination, and expandable rows for enterprise data management.
- Data Visualization Dashboards - Combines interactive data tables and complex charts into analytical dashboards for rendering backend metrics.
- Tabular Data Frameworks - Provides a framework for managing and displaying heterogeneous tabular data with pagination and count indicators.
- Environment Variable Management - Loads and accesses environment variables from files to define service URLs for different modes.
- Backend Endpoint Definitions - Specifies base URLs for production and development environments to connect the interface with backend services.
- Environment Variable Configurations - Uses environment variables to switch between development and production service endpoints.
- Navigation Access Controls - Enforces navigation restrictions using a combination of static frontend definitions and dynamic backend routing.
- Role-Based Access Control - Implements role-based access control to restrict page navigation and menu visibility based on user permissions.
- User Identity Management - Manages user login, registration, and session persistence using encrypted local storage.
- Centralized State Stores - Centralizes application state and user sessions using a reactive store for consistent data access.
- Component Frameworks - Utilizes the NaiveUI component framework to provide a consistent architectural pattern for UI composition.
- Dashboard Layout Components - Assembles administrative dashboards using a library of pre-built layout components and templates.
- Navigation Configurations - Provides configurations for defining complex global navigation menus, sidebars, and menu hierarchies.
- Responsive Design - Ensures administrative dashboards automatically adjust their layout and navigation for consistent use on mobile devices.
- Frontend Admin Boilerplates - Provides a feature-rich foundation including role-based access control and automated route generation for admin dashboards.
- Network Request Adapters - Implements a network request adapter for data transformation and support for promise and hook patterns.
- Route Manifest Generators - Automatically scans the file system to generate route imports and TypeScript type declarations at build time.
- Type-Safe UI Frameworks - Implements a type-safe dashboard architecture using TypeScript to ensure consistency in complex data management.
- Utility-First CSS Frameworks - Uses a utility-first CSS engine to apply design tokens via atomic classes.
- Data Visualization Charts - Integrates libraries for rendering graphical data representations and complex charts within the dashboard.
- Internationalization Support - Implements internationalization support to adapt the user interface and content for a global user base.
- Project Workflow Automation - Includes CLI tools to automate repetitive development tasks such as route generation and git commits.
- Task Automation Tools - Provides a command-line interface to automate repetitive workflows such as project deployments.
- Browser Local Storage Management - Manages application state and user data persistence using browser local storage with collision-avoiding prefixes.
- File-Based Routing Systems - Automatically generates route imports and TypeScript declarations by scanning the file system directory structure.
- Icon Systems - Implements a unified system for loading and rendering SVG icons dynamically to reduce bundle size.
- Icons - Implements a unified system for the dynamic loading and rendering of SVG icons.
- Responsive Layouts - Implements fluid and adaptive page structures including hybrid vertical headers and dedicated mobile views.
- Dashboard Responsive Optimization - Dynamically adjusts the user interface to ensure the administrative dashboard remains usable and consistent on mobile devices.
- Atomic CSS Generators - Defines utility classes and design tokens using an atomic CSS generation system.
- Tab Management Systems - Ships a multi-tab interface featuring pinning, cache cleaning, and mouse-driven switching for application navigation.
- Theme Customization - Provides interfaces for modifying the global visual style and layout of the administrative interface.
- Visual Themes - Customizes the interface appearance using built-in theme presets and styling options.
- Content Translation - Provides mechanisms for swapping user-facing text and labels into multiple languages based on locale.
- Admin Templates - Elegant admin template using Vite, Pinia, and Naive UI.
