Enterprise Workspace is a production-ready Angular application that combines authentication, analytics, project portfolio views, and Kanban task execution in one enterprise UI.
Teams often split dashboards, delivery tracking, and operational task flow across multiple tools. This project demonstrates how to unify those workflows into a single frontend platform with modern UX, accessibility, and deployment readiness.
- Standalone Angular architecture with feature-based routing.
- Auth flow with guards, interceptors, JWT session handling, and graceful mock fallback.
- Dashboard experience with KPI cards, Chart.js visualizations, and motion-driven feedback.
- Projects workspace with list filtering, details view, modal form creation, and settings updates.
- Tasks Kanban board with drag-and-drop and contextual side drawer details.
- Global systems for loading state, toast notifications, SEO metadata, theming, and localization.
- Multi-language support (
en,fr,es,de,ar,it) with RTL handling.
- Angular 18 (standalone APIs)
- TypeScript (strict mode)
- Angular Material + CDK DragDrop
- Chart.js
- GSAP
- ngx-translate
- SCSS design tokens and module-level styling
- Node.js
>= 20.11.1 - npm
>= 10
npm ci
npm startOpen http://localhost:4200.
| Script | Description |
|---|---|
npm start |
Start local dev server |
npm run start:host |
Start dev server on 0.0.0.0:4200 |
npm run build |
Create a default build |
npm run build:prod |
Create an optimized production build |
npm run build:stats |
Production build with stats output |
npm run serve:dist |
Serve built artifacts locally |
npm run test |
Run unit tests in watch mode |
npm run test:ci |
Run unit tests once (headless) |
npm run verify |
Run production build verification |
src/app/
|-- core/ # app-wide services, guards, interceptors, config, models
|-- features/ # domain modules: auth, dashboard, projects, tasks, analytics, public, system
|-- layout/ # shell, sidebar, navbar
|-- shared/ # reusable UI components and animations
|-- app.config.ts # providers, router, interceptors, app initializers
`-- app.routes.ts # route composition and lazy feature boundaries
Detailed docs:
docs/ARCHITECTURE.mddocs/DEVELOPMENT.mddocs/DEPLOYMENT.mddocs/API_CONTRACTS.mddocs/LINKEDIN_KIT.md
The UI targets REST endpoints under /api/*. If endpoints are unavailable, the app transparently falls back to local mocked responses in service layers so the full product flow remains demoable.
This repository includes deployment-ready configuration for:
- Docker + Nginx (
Dockerfile,nginx.conf) - Vercel (
vercel.json) - Netlify (
netlify.toml,public/_redirects)
See docs/DEPLOYMENT.md for full instructions.
This repo includes baseline professional project files:
LICENSECODE_OF_CONDUCT.mdCONTRIBUTING.mdSECURITY.mdCHANGELOG.md.github/workflows/ci.yml.github/ISSUE_TEMPLATE/*.github/PULL_REQUEST_TEMPLATE.md
Add product screenshots to docs/screenshots/ and update references in docs/SCREENSHOTS.md.
Released under the MIT License. See LICENSE.
