An open API service indexing awesome lists of open source software.

https://github.com/bilalsubhani/haiderdesk


https://github.com/bilalsubhani/haiderdesk

angular ngx-charts ngx-toastr typescript

Last synced: about 1 month ago
JSON representation

Awesome Lists containing this project

README

          

# Haider's Desk

Haider's Desk is an online shop built with **Angular** where users can purchase brand logos and request custom designs. It features a secure **admin dashboard** with authentication guards, real-time notifications via **Toastr**, and interactive **data visualization** using ngx-charts. The **NestJS backend** handles email functionality through **Nodemailer** and serves logo data efficiently.

## 🚀 Features

### 🛍️ User Features

- Browse and purchase brand logos
- Request custom logo designs
- Receive notifications via **Toastr**
- Secure transactions with JWT authentication

### 🔑 Admin Panel Features

- **Product Management:** Add, delete, and manage listed logos
- **Order Management:** View orders, update statuses, and delete orders
- **User Management:** Add/remove other admins
- **Email Configuration:** Manage connected emails for notifications
- **Data Insights:** Visualizations and statistics using **ngx-charts**

### 📊 Dashboard Data Visualization

- **Pie Chart:** Displays the status distribution of orders (e.g., Pending, Completed)
- **Bar Graph:** Visualizes the payment methods selected by customers
- **Key Metrics:**
- Total visits to the main page
- Count of admins, products, orders, and connected emails

## 🛠️ Technologies Used

| **Technology** | **Usage** |
| ---------------- | ------------------------------------- |
| Angular | Frontend framework |
| ngx-charts | Data visualization (Pie & Bar Charts) |
| NestJS | Backend API |
| JWT, Auth Guards | Authentication & Authorization |
| Toastr | Notifications |
| Nodemailer | Email service |

## 🏗️ Installation Guide

### 1️⃣ Clone the Repository

```sh
git clone https://github.com/BilalSubhani/haiderDesk.git
cd haiderDesk
```

### 2️⃣ Install Dependencies

#### Frontend

```sh
cd frontend
npm install
```

### 4️⃣ Run the Application

#### Start Frontend Server

```sh
ng serve
```

## 🤝 Contributing

Contributions are welcome! Feel free to open issues or submit pull requests to improve the project.

## 📩 Contact

For inquiries, reach out at [bilalsubhanii@outlook.com](mailto:bilalsubhanii@outlook.com).