Ticket System

API & Angular

Name: Abdelrahman Mohamed

Linked In : linkedin.com/in/abdelrahman-mohamed14

+02 01080353779
Clean Tickets API — Full Documentation
📄 Overview

Clean Tickets API is a professional-grade ticketing system backend built entirely from
scratch, starting from an empty solution.

Even though it is a small project, it follows enterprise-level standards and architecture,

showing high attention to scalability, modularity, and clean coding practices.

The solution demonstrates how to professionally set up a real-world application, using:

• Clean Architecture
• CQRS Pattern
• MediatR
• Entity Framework Core (EF Core)
• FluentValidation
• JWT Authentication with Refresh Tokens
• Result Pattern (Ardalis.Result)
• Role-Based Access Control (RBAC)
• Global Exception Handling
• Full API Design and Documentation
• Git and GitHub for version control
🚀 Highlights

Built Entirely from Scratch

No templates or scaffolding tools were used.

In real-world projects, ready-made company templates (preconfigured for architecture,
logging, auth, etc.) would usually be used.
Here, everything was set up manually to show complete mastery of professional
backend setup.

Modern Best Practices

Despite the small scale, modern standards like CQRS, Result Pattern, and proper layer
separation are respected.

Authentication and Authorization

Full implementation of:

• JWT Authentication
• Refresh Token for session extension
• Role-Based Access Control (RBAC)

Environment Awareness

CORS is open for development only (not for production).

Sensitive configurations like JWT secrets must be stored in Secret Managers in
production.

Media Management

Image uploads are temporarily saved in wwwroot, but in real-world deployments, a

Cloud Storage Service (Azure Blob Storage, AWS S3, Cloudinary) must be used.
🏗️ Architecture Overview

The project follows a strict Clean Architecture structure:

src/

├── API --> Controllers, Dependency Injection setup

├── Application --> CQRS Handlers, DTOs, Validation Rules

├── Domain --> Entities, Enums, Core Business Models

├── Infrastructure --> Implementations for Repositories, JWT Auth, etc.

├── Persistence --> EF Core Context, Migrations, Repositories

🛠️ Core Technologies Used

• ASP.NET Core 8
• Entity Framework Core (EF Core)
• MediatR
• FluentValidation
• JWT Authentication
• Refresh Tokens
• Ardalis.Result
• Git & GitHub
• Global Exception Handling

🔐 Security and Authentication

• JWT Tokens are used for access authentication.

• Refresh Tokens are implemented to allow users to renew their session without
re-login.
• RBAC (Role-Based Access Control) is implemented to allow fine-grained
permissions based on user roles (e.g., Admin, User, ERP).
• Global Exception Handling middleware is used to catch and return structured
error responses across the entire application.
⚙️ Important Configuration Notes

• CORS is currently configured to allow all origins, methods, and headers for
testing purposes.
• Sensitive tokens must be stored in Azure Key Vault or other secret managers in
production.
• Token lifetimes (Access & Refresh) should be configurable based on app needs.
• Images should be uploaded to cloud storage in production, not wwwroot.

🛡️ Endpoints Documentation

🧑 Authentication and Users (/api/auth)

• POST /api/auth/register: Register a new user

• POST /api/auth/login: Login with credentials, receive tokens
• GET /api/auth/get-current-user: Get current user info
• GET /api/auth/users: List all users (admin access)
• GET /api/auth/users/{id}: Get user by ID

🎟️ Tickets (/api/incidents)

• POST /api/incidents: Create a new incident

• GET /api/incidents/{id}: Get incident by ID
• GET /api/incidents/list: List all incidents
• GET /api/incidents/paged: Get paged incidents
• PUT /api/incidents/{id}: Update an incident
• POST /api/incidents/{id}/attachments: Add attachments
• PUT /api/incidents/{id}/attachments: Update attachments
• PUT /api/incidents/{id}/comments: Add/update comments
• GET /api/incidents/{id}/comments: List comments for incident
🧑‍💻 Pre-seeded Users for Testing

For easy testing and role-based validation during development, the application seeds
three predefined users:

Username Email Password Role

admin [email protected] Admin123!@ Admin
erpuser [email protected] ERPp123!@ ERP
normaluser [email protected] User123!@ User

If you want to test API endpoints that require a specific role, simply login using
one of the seeded users above based on the required role (e.g., login with
[email protected] to test Admin-only endpoints).

Each role controls different access levels, depending on the authorization

requirements placed in the controllers.

🧩 Features Overview

• Authentication and Session Management (Login, JWT Tokens, Refresh Tokens)

• Role Management (RBAC)
• Ticket Management (CRUD, Attachments, Comments)
• Validation (FluentValidation)
• Unified error handling (Result Pattern + Global Exception Middleware)
• Structured Logging
📚 Best Practices Reflected

• Clean Architecture and Layered Design

• Single Responsibility Principle
• CQRS for separation of concerns
• FluentValidation for input validation
• Secure JWT Authentication with Refresh Tokens
• Proper environment-specific configurations

⏳ Time Constraints Note

Given more time, the project could be improved with:

• Full unit and integration tests

• Advanced error handling middleware
• More detailed role-based access policies

🎯 Conclusion

Built completely from scratch, showing strong backend skills.

Real-world architecture suitable for scaling.
High security and clean code practices.
🧪 SWAGGER Documentation

📂 GitHub Repository
https://github.com/AbdelRahman-Mohamed-11/clean-tickets-api
Clean Tickets Angular — Full Documentation

🧾 Login
🏡 Homepage

🏡 Incident Details Page

〽️ Update Page
Explanation | Tickets Angular Frontend

Overview
Tickets Angular is a Ticket Management System frontend developed using Angular, without
relying on any prebuilt UI libraries like Bootstrap or TailwindCSS. The goal was to
demonstrate frontend architecture and styling skills using pure CSS.

Setup Instructions

• Clone the project to your local machine using Git.

• Install all required packages using npm.
• Update the backend API URL inside the project to point to your actual backend
server.
• Run the Angular development server.
• Open your browser and access the application via the local development URL.

Login Credentials

The backend system seeds three default users. You can use the following credentials to log
in:

• Admin User
o Email: [email protected]
o Password: Admin123!@
• ERP User
o Email: [email protected]
o Password: ERPp123!@
• Normal User
o Email: [email protected]
o Password: User123!@

You can use any of these accounts to log in and test the application features.
Technologies Used

• Angular (Standalone Components)

• TypeScript
• Pure CSS (no Bootstrap, no TailwindCSS)
• RxJS
• Angular Forms

Important Notes

• Backend URL Update:

You must update the backend API URL in the project configuration for the application to
function properly.

• Login Details:

You can log in using any of the predefined seeded users listed above.
Project Limitations (Due to Time Constraints)

• Error Handling:

Proper and comprehensive error handling was not fully implemented due to time
limitations. Ideally, the application should handle errors gracefully and provide user-
friendly messages.

• Styling:

All styling was done manually using pure CSS. Although the current design is functional,
integrating a UI framework like Bootstrap or TailwindCSS could have provided a more
polished and responsive design in less time.

• Unit Testing:

No unit tests or integration tests were implemented. In a production-ready application,

it would be necessary to add comprehensive testing to ensure code quality and
maintainability.

• Architecture:

The entire project was built from scratch without using any templates or generators to
demonstrate full capability in structuring and building Angular applications manually.
GitHub Repository

https://github.com/AbdelRahman-Mohamed-11/tickets-angular

Final Remark

This project demonstrates the ability to build a fully functional Angular application from the
ground up, focusing on clean architecture, manual styling, service separation, and dynamic
data management — all without relying on external UI libraries or scaffolding tools.