A production-style proof-of-concept Claim Management application with enterprise-grade architecture.
- Frontend: Angular 16 with standalone components, Angular Material UI
- Backend: NestJS with TypeScript, REST API, in-memory storage
- Authentication: JWT-based with mock credentials
- Node.js 18+
- npm or yarn
- Angular CLI 16
cd backend
npm install
npm run start:dev- Backend runs on http://localhost:3000
- Swagger documentation available at http://localhost:3000/api
cd frontend
npm install
ng serve- Frontend runs on http://localhost:4200
- Username:
admin - Password:
password
POST /auth/login- Login with credentials
GET /claims- Get all claimsPOST /claims- Create new claimGET /claims/:id- Get claim by IDPUT /claims/:id/status- Update claim status
GET /dashboard/metrics- Get dashboard KPIs
claim-management/
├── backend/ # NestJS Backend
│ ├── src/
│ │ ├── auth/ # Authentication module
│ │ │ ├── auth.controller.ts
│ │ │ ├── auth.service.ts
│ │ │ ├── jwt.strategy.ts
│ │ │ └── dto/
│ │ ├── claims/ # Claims management
│ │ │ ├── claims.controller.ts
│ │ │ ├── claims.service.ts
│ │ │ └── dto/
│ │ ├── dashboard/ # Dashboard metrics
│ │ │ ├── dashboard.controller.ts
│ │ │ ├── dashboard.service.ts
│ │ │ └── dto/
│ │ ├── app.module.ts
│ │ └── main.ts
│ ├── package.json
│ └── tsconfig.json
├── frontend/ # Angular 16 Frontend
│ ├── src/
│ │ ├── app/
│ │ │ ├── core/ # Core services, guards, interceptors
│ │ │ │ ├── auth/
│ │ │ │ ├── guards/
│ │ │ │ └── interceptors/
│ │ │ ├── features/ # Feature modules
│ │ │ │ ├── login/
│ │ │ │ ├── dashboard/
│ │ │ │ └── claims/
│ │ │ └── shared/ # Shared components and services
│ │ │ ├── models/
│ │ │ └── services/
│ │ ├── environments/
│ │ └── styles.scss
│ ├── angular.json
│ ├── package.json
│ └── tsconfig.json
└── README.md
- ✅ JWT Authentication with route guards and HTTP interceptors
- ✅ Enterprise-themed Angular Material UI with blue/gray palette
- ✅ Responsive Dashboard with KPI cards and interactive charts
- ✅ Multi-step Claim Creation with form validation and review
- ✅ Claims Management with list view, filtering, and detail pages
- ✅ Status Tracking with visual timeline and progress indicators
- ✅ Professional UI/UX with loading states and error handling
- ✅ RESTful API with NestJS framework
- ✅ JWT Authentication with Passport strategy
- ✅ In-memory Data Storage with seeded sample data
- ✅ Swagger/OpenAPI Documentation with interactive API explorer
- ✅ CORS Configuration for frontend integration
- ✅ DTO Validation with class-validator
- ✅ Clean Architecture with controller/service/DTO pattern
- Login page with form validation
- JWT token storage in localStorage
- HTTP interceptor for automatic token attachment
- Route guards for protected pages
- Logout functionality
- Total Claims KPI card
- Pending Claims counter
- Approved Claims metrics
- Rejected Claims tracking
- Interactive Doughnut Chart showing claims by status
- Financial Summary with total and average amounts
- Claims List with sortable Material table
- Create Claim with 3-step wizard:
- Claim details entry
- Review and confirmation
- Final submission
- Claim Detail View with status timeline
- Status Tracking with visual progress indicators
- Standalone Components (no NgModules)
- Reactive Forms with validation
- RxJS for state management
- Angular Material for UI components
- SCSS for styling with enterprise theme
- Chart.js integration for data visualization
- Modular Structure with feature-based modules
- Dependency Injection with NestJS
- Guard-based Authentication with JWT strategy
- DTO Pattern for request/response validation
- Service Layer for business logic
- Controller Layer for HTTP handling
The backend includes pre-seeded sample claims with different statuses:
- Health insurance claim (Approved)
- Auto insurance claim (Pending)
- Home insurance claim (Under Review)
- Life insurance claim (Rejected)
- Backend API URL configurable in
frontend/src/environments/environment.ts - JWT secret configurable in backend (change for production)
- CORS settings configured for local development
- Replace in-memory storage with database (PostgreSQL, MongoDB)
- Implement proper user management and roles
- Add file upload for claim documents
- Implement email notifications
- Add audit logging
- Configure proper JWT secrets and expiration
- Set up proper error handling and monitoring
- Clone the repository
- Install backend dependencies:
cd backend && npm install - Start backend server:
npm run start:dev - Install frontend dependencies:
cd frontend && npm install - Start frontend application:
ng serve - Open browser to
http://localhost:4200 - Login with username:
admin, password:password - Explore the dashboard, create claims, and view details
- Login with provided credentials
- View Dashboard to see KPI metrics and charts
- Navigate to Claims to see existing claims
- Create New Claim using the multi-step wizard
- View Claim Details to see status timeline
- Explore API using Swagger documentation at
/api
This application demonstrates enterprise-grade development practices with clean architecture, proper separation of concerns, and production-ready code structure.