Introduction
Building an admin dashboard from scratch for each project can be time-consuming. To streamline this process, a production-ready starter template was developed using the latest technologies, providing a robust foundation for future projects.
What is HeapAdmin?
HeapAdmin is a comprehensive full-stack admin dashboard template designed to simplify the development process. It features:
- Backend: Developed with Laravel 12, PHP 8.2, and Laravel Sanctum to ensure secure API interaction.
- Frontend: Powered by Vue 3, Vite, CoreUI, and Vue Router for a dynamic user experience.
- Database Options: Compatible with SQLite, MySQL, and PostgreSQL, offering flexibility in data management.
Explore a live demo: HeapAdmin Demo
Choosing Laravel 12
While many templates still rely on older versions of Laravel, Laravel 12 was selected for its enhanced service providers and increased performance. This choice ensures the template remains current and reduces the need for significant upgrades.
Benefits of a Decoupled Architecture
The decision to decouple the frontend and backend results in several advantages:
- Interchangeable Frontend Framework: Allows the frontend to be updated or changed without affecting the backend.
- API Reusability: The same API can be utilized for future mobile applications.
- Independent Deployment: Frontend and backend can be deployed separately, offering more flexibility.
However, this setup requires additional initial configuration, including CORS and token management.
Features of HeapAdmin
HeapAdmin includes several essential features:
- User Management: Complete CRUD functionality with pagination.
- Analytics Dashboard: Provides valuable insights through integrated charts.
- Role-based Authentication: Secured by Laravel Sanctum.
- Responsive Design: Ensures a seamless experience on all devices.
- Professional Documentation: Guides users through the setup and utilization.
The Technical Architecture
The architecture of HeapAdmin is structured as follows:
-
Frontend (Vue 3 + Vite)
- Vue Router
- CoreUI Components
- Axios HTTP Client
- Pinia State Management
-
Backend (Laravel 12)
- RESTful API
- Laravel Sanctum
- Eloquent ORM
- MySQL/PostgreSQL
Accessing the Template
The complete HeapAdmin template is available on Gumroad, featuring comprehensive documentation and six months of updates. For those interested in the code, visit the GitHub repositories:
Feedback on the API structure and Vue component organization is encouraged. How would you enhance this setup?