Embeddable widget for HDFC website that lets customers estimate monthly mortgage repayments based on loan amount, interest rate, and tenure.
TypeScript
Go
SQL
REST APIs
Authentication
.NET
Published 11 Oct 2026
Description
HDFC needs a self-contained mortgage pre-qualification calculator that can be embedded on the public website and inside the mobile banking app. Customers enter property value, down payment, interest rate, and loan term to see estimated monthly instalments, total interest payable, and a simple affordability indicator.
The calculator must use HDFC's current lending rates (configurable via admin settings JSON) and follow Maldives Rufiyaa formatting conventions. Results should update in real time as inputs change, with clear disclaimers that figures are estimates only.
Requirements
- Responsive layout: works on mobile (320px+) and desktop
- Real-time calculation as user types (debounced 200ms)
- Configurable interest rate tiers (admin-editable JSON config)
- MVR currency formatting with thousand separators
- Affordability band: green/amber/red based on debt-to-income ratio input
- Accessible: WCAG 2.1 AA, keyboard navigable, screen reader labels
- Disclaimer text block (editable via config)
- No external API calls — all client-side computation
- Bundle size under 50KB gzipped
Technical specifications
- React 19 component with TypeScript
- Props interface for rate config, disclaimer text, and theme tokens
- Standard amortization formula: M = P[r(1+r)^n]/[(1+r)^n-1]
- CSS custom properties for HDFC brand colours (#003366 primary, #fa998e accent)
- Export as ES module + UMD bundle for embedding
- Unit tests for calculation edge cases (zero down payment, max tenure)
- Storybook stories for all input states
Deliverables
- Source code repository with README and integration guide
- npm package or dist/ folder with ES + UMD builds
- Storybook deployment or static export
- Unit test suite with >90% coverage on calculation logic
- Integration documentation with embed code snippets
- 2 weeks post-delivery bug-fix support