A high-performance, fully responsive Admin Dashboard built with Angular 17 and Tailwind CSS. Designed for managing products, orders, and customers with a seamless UX.
This project demonstrates a real-world Single Page Application (SPA) architecture with interactive CRUD simulations.
- Visual Analytics: Real-time data simulation with charts and stats cards.
- Responsive Layout: Collapsible sidebar for Tablet and Off-canvas menu for Mobile devices.
- Advanced Filtering: Real-time search functionality.
- Pagination: Client-side pagination logic.
- Interactive Modals: "Add New Product" feature with form validation.
- State Management: Delete and Edit actions update the UI instantly.
- Customer Directory: List view with avatars and status indicators (Active/Blocked).
- Order Tracking: Status-based dynamic styling (badges for Shipped, Pending, etc.).
- Actions: Simulation of Export to Excel and Order Creation.
- Dynamic Tabs: Switch between Personal Info, Security, and Notifications without reloading.
- Interactive Forms: Save button with loading state simulation.
The application is optimized for all screen sizes (Desktop, Tablet, Mobile).
| Desktop View | Mobile View |
|---|---|
 |
 |
- Framework: Angular 17 (Standalone Components, Signals, Control Flow)
- Styling: Tailwind CSS
- Icons: Boxicons
- Language: TypeScript
Follow these steps to run the project locally:
git clone [https://github.com/alpereee/fe-intern-case-dashboard.git](https://github.com/alpereee/fe-intern-case-dashboard.git)
cd fe-intern-case-dashboard
Bash
npm install
ng serve