ABOUT
The engineer behind the interface.
I specialize in API-driven UI architecture for complex fintech systems — building payment and recipient flows where every field, validation, and layout is driven by backend configuration, not hardcoded frontend logic. That's how the same codebase serves 50+ countries across 4 production releases per year.
I joined Bank of America as a trainee and grew into the sole frontend owner of the team's largest annual release in under three years. I caught a critical cross-currency data integrity gap a full month before testing opened — the kind of thing that saves full-stack rework, not just frontend cleanup.
API-Driven
Zero hardcoded regional logic.
Accessible
ADA / WCAG compliant by default.
i18n-Ready
Spanish + multi-currency out of the box.
EXPERIENCE
Where I've Worked
Bank of America
SENIOR FRONTEND ENGINEER
2022 - Present
- Led frontend for global banking platform serving 50+ countries (200M+ users)
- Reduced page load time by 40% through code splitting and lazy loading
- Designed component library used by 12+ engineering teams (80% adoption)
- Built real-time dashboard with WebSocket API handling 10K+ concurrent users
- Collaborated with design/PM to ship 25+ features on time (100% satisfaction)
HOW I WORK
From requirement to release.
Read the brief twice
Before writing a line of code, I map out the full user journey and flag any ambiguities in the requirements. At BofA, this habit caught 2–3 critical logic gaps before they ever reached QA.
Design in components
I decompose every feature into reusable, independently testable units — the same approach I used to build payment and recipient UIs that work across 50+ countries without hardcoded country logic.
Build API-first
I integrate backend service responses early, building UIs that render dynamically from data — not from assumptions. This keeps the interface flexible as business rules evolve.
Test at the edges
Currency switches, empty states, network failures, ADA compliance — I test the paths users aren't supposed to take. That's where production bugs live.
Ship, then sharpen
Post-launch, I monitor for edge cases and refactor proactively — improving state mapping, conditional rendering, and routing logic without waiting to be asked.
CASE STUDY
Bank of America — FX Currency-Change Flow
THE PROBLEM
In a multi-step international payment flow, switching the destination currency mid-journey was silently wiping all previously entered financial data — account numbers, routing codes, additional fields. Users would reach the final confirmation screen and find an empty form. In a live banking environment, that's a critical data-loss bug.
MY APPROACH
I designed a retain logic layer that intercepted currency change events and selectively preserved field values that remained valid for the new currency configuration — using the backend service response to determine which fields carried over and which needed to reset. The logic had to be stateless at the UI level and driven entirely from API responses.
THE OUTCOME
Zero data-loss incidents post-release. The solution was adopted as the standard pattern for currency-switching flows across the module. It also became the foundation for the dynamic field handling system that now supports varying account, routing, and additional field requirements across all 50+ countries — with no hardcoded logic.
onCurrencyChange(newCurrency) {
const validFields = api.getFieldConfig(newCurrency)
const preserved = {}
for (const [field, value] of currentFormState) {
if (validFields.includes(field) && value !== "") {
preserved[field] = value
}
// else reset silently — API drives it
}
return { ...preserved, currency: newCurrency }
}PROJECTS
What I've built outside work.
Trip-a-Dora
Multi-Service Travel Discovery Platform
Originated the full product concept — a mood-based booking hub for under-explored destinations, connecting travellers to local guides, drivers, and hospitality businesses. Sole frontend owner in a team of 4, shipped in a 2-week sprint.
React.js · JavaScript · CSS3 · PHP · State Management
Enterprise work at Bank of America is covered in the Process section above.
OPINIONATED TOOLKIT
Not what I know. What I trust.
Every tool here has earned its place. These are the ones I reach for by default — not because they\'re popular, but because they\'ve proven themselves in production.
React.js
UI FrameworkMy default for anything component-based. The mental model of unidirectional data flow has shaped how I think about every UI problem — even when I'm writing Vue.
TypeScript
LanguageI was sceptical until I caught my first runtime bug at compile time in a live payment flow. Now I won't start a project without it. The discipline it forces is worth the setup cost.
VS Code
EditorNot because it's the best theoretically — because I've spent 3 years customising it to my exact workflow. The time investment in your editor pays compounding returns.
Claude (AI)
Dev PartnerI use it as an architecture sounding board and a first-pass reviewer. The key is knowing when to trust it and when to push back. It's made me 40% faster without making me 40% lazier.
Figma
DesignI read designs in Figma before I write any JSX. Understanding what the designer actually meant — not just what the spec says — prevents the most expensive kind of rework.
Jira + Confluence
WorkflowMy paper trail. Every decision, every edge case discussion, every stakeholder sign-off lives here. When I say I proactively caught bugs before QA, this is where the evidence is.
Git (feature branch workflow)
Version ControlAtomic commits, meaningful messages, PRs that can actually be reviewed. I treat commit history as documentation — future-me has thanked past-me more than once.
Postman / REST tooling
APII test every endpoint before I build the component that consumes it. Understanding the actual API contract — not the docs — is what prevents 90% of integration surprises.
Currently exploring: Framer Motion advanced gestures · Next.js App Router edge cases · Accessibility audit tooling
THINKING
How I think as a developer.
Debugging Approach
- —Isolate systematically — console.log surgically, not shotgun
- —Reproduce minimally, then binary-search the fix
- —Network tab first — 80% of integration bugs live there
- —Document the why, not just the how
- —Write the bug report before writing the fix — it clarifies the actual problem
Complex UI Logic
- —API-response-driven rendering — UI has no opinion on what fields exist
- —Custom hooks = reusable, testable brainpower
- —Dynamic field config over conditional rendering blocks
- —Error boundaries on every async boundary
- —Loading + error states = feature complete, not optional
API & State Handling
- —TypeScript interfaces mirror the API contract, not assumptions
- —Zod for runtime validation where the schema matters
- —Zustand for UI state — predictable, no boilerplate overhead
- —Optimistic updates + explicit rollback on failure
- —Test every endpoint in Postman before building the component that consumes it
Scalable Code
- —Composition > inheritance — always
- —Utility-first CSS with Tailwind, no custom class sprawl
- —Component boundaries follow data ownership, not visual grouping
- —i18n via JCR from day one — strings never hardcoded
- —Accessibility (ADA / WCAG) built in, not bolted on after
BACKGROUND
Where I come from.
Education
B.Tech, Information Technology
Banasthali Vidyapith, Rajasthan · 2019–2023
NAAC A++ — Government of India AccreditationLanguages
English
Primary working language
Hindi & Bengali
German
Actively learning
CONTACT
Let's work together.
Open to senior frontend roles in fintech, payment infrastructure, or product engineering. Full time — hybrid preferred.