An Angular-based admin dashboard for managing users through a complete CRUD workflow. The application provides authentication, role-based authorization, form validation, user management, and API integration while following modern Angular architecture.
🔹 Built a standalone Angular application using Angular Routing for smooth SPA navigation without page reloads.
🔹 Implemented full CRUD operations (Create, Read, Update, Delete) for user management with reusable services and centralized API handling.
🔹 Added user registration and login functionality with form validation and authentication flow.
🔹 Implemented both Template-Driven Forms and Reactive Forms with synchronous and asynchronous validation.
🔹 Added real-time email uniqueness validation using Async Validators and HTTP requests.
🔹 Used Angular Signals and Computed Signals for reactive state management and UI updates.
🔹 Implemented user search and filtering functionality with instant updates.
🔹 Added role-based authorization to restrict editing and management actions based on user permissions.
🔹 Created reusable custom Pipes for data transformation and status visualization.
🔹 Built reusable custom Directives to enhance UI behavior and user experience.
🔹 Integrated MockAPI as a cloud-based backend service for data persistence and deployment compatibility.
🔹 Added confirmation dialogs before deleting users to improve usability and prevent accidental actions.
🔹 Utilized Angular built-in Pipes and Directives for efficient template rendering and data formatting.
🔹 Added HTTP Error Handling and Logging Interceptors to centralize request monitoring and error management.
🔹 Implemented a global loading spinner using HTTP Interceptors to provide visual feedback during API requests.
🔹 Optimized application performance using eager loading for authentication pages and lazy loading for feature modules and routes.
🔹 Designed a fully responsive UI using Tailwind CSS for mobile, tablet, and desktop devices.
- Angular 21
- TypeScript
- RxJS
- MockAPI
- Tailwind CSS
- HTML5
- Standalone Components
- Dependency Injection (DI)
- Services
- Routing & Navigation
- Template-Driven and Reactive Forms
- Async and Custom Validators
- Angular Signals
- HttpClient & API Integration
- HTTP Interceptors
- RxJS Observables
- Custom Pipes and Directives
- Built-in Pipes and Directives
- Component Communication
- Conditional Rendering
- Data Binding
- CRUD Operations
- Role-Based Authorization
- Lazy Loading & Eager Loading
- Responsive Design
🔗 GitHub Repo: User Directory Management System
🌐 Live Demo: View on Vercel
Doaa Diaa El Din
🔗 GitHub Profile
