Welcome to Admin Dashboard

A powerful and flexible admin dashboard solution for managing your application's backend. Built with modern technologies and best practices, this kit provides a solid foundation for any admin interface.

What's Included

• Analytics Dashboard - Beautiful charts and metrics with real-time data visualization
• Data Tables - Advanced data grids with sorting, filtering, and pagination
• User Management - Complete CRUD interface for managing users and permissions
• Settings Panel - Comprehensive settings management with form validation
• Role-Based Access Control - Built-in RBAC system with DashForm integration
• Responsive Layout - Fully responsive design that works on all devices
• Dark Mode Support - Beautiful dark theme included out of the box
• Export Capabilities - Export data to CSV, Excel, and PDF formats

Tech Stack

• React 18
• TypeScript
• DashForm for complex forms
• Material-UI components
• Recharts for data visualization
• React Router with protected routes
• TanStack Query for data fetching
• Vite for development

Getting Started

1. Download and extract the starter kit
2. Install dependencies: npm install
3. Configure API endpoints in .env
4. Start development server: npm run dev
5. Login with demo credentials ([email protected] / demo123)

Prerequisites

• Node.js 18 or higher
• npm or yarn
• Backend API (mock API included for development)
• Modern web browser

Project Structure

admin-dashboard/
├── src/
│   ├── components/
│   │   ├── Dashboard/
│   │   ├── DataTable/
│   │   ├── Charts/
│   │   └── Layout/
│   ├── pages/
│   │   ├── Dashboard.tsx
│   │   ├── Users.tsx
│   │   ├── Settings.tsx
│   │   └── Analytics.tsx
│   ├── services/
│   ├── hooks/
│   └── main.tsx
├── package.json
└── README.md

Key Features

Analytics Dashboard

View key metrics at a glance with interactive charts. Track user activity, revenue, conversions, and custom metrics.

Advanced Data Tables

Manage large datasets with ease. Features include server-side pagination, multi-column sorting, advanced filtering, and bulk actions.

User Management

Complete user administration with role assignment, permission management, and activity logs.

Settings Management

Organize application settings into logical sections with form validation and real-time updates.

RBAC Integration

Control access to features and data based on user roles and permissions. Fully integrated with DashForm's access control system.

Customization

The dashboard is highly customizable:

• Modify color scheme in src/theme.ts
• Add custom widgets to the dashboard
• Configure menu items in src/config/menu.ts
• Customize data table columns
• Add new pages and routes

API Integration

Connect to your backend API by configuring endpoints in .env:

VITE_API_BASE_URL=https://api.yourapp.com
VITE_API_TIMEOUT=30000

Mock API included for development and testing.

Support

Need help?

• Email: [email protected]
• Documentation: https://dashforge.dev/docs/admin-dashboard
• Community: https://discord.gg/dashforge

License

Commercial license. One license per project. See LICENSE.md for full terms.