I build systems
that ship.

Full-stack engineer in regulated finance. I design micro-frontends, agentic AI pipelines, and developer tools — and run them in production.

View live systems ↓Contact
  • 14Y REGULATED FINANCE
  • REACT / TYPESCRIPT
  • MFE ARCHITECTURE
  • LANGGRAPH / AGENTS

ANUP.PATRA

FULL STACK · UI · AI TOOLING

SYS/01 — PRODUCTION SYSTEMS

Built, shipped, and running

Personal systems that are live and verifiable — a multiplayer game in production, a published VS Code extension, and an open-source agentic pipeline.

chor-policeLIVE

Chor Police — multiplayer party game

A desi, Mafia-style social-deduction game built as a PWA — 5–15 players join from their own phones, no install. The server is the single source of truth: it broadcasts the full public state over WebSocket while secret roles are delivered only to their owner, never broadcast. Live in production on Vercel, Render and Neon Postgres.

Play now →User manual
LobbyScratchPolice RevealNightMorningVotingVote RevealTiebreakerGame Over
FIG. 1 — GAME PHASE FLOW (9 PHASES)

Key highlights

  • Role secrecy enforced at the WebSocket boundary — secrets go only to their owner
  • Police protection fully server-enforced: immune at night and in voting, even before public reveal
  • In-memory Map + Neon Postgres hybrid — instant reads with durable reconnect recovery
  • TV dashboard: role-safe spectator board, safe to put on a shared screen
  • Web push for @mentions in remote play — opt-in, works on iOS as a PWA
Chor Police game banner showing the Chor, Police and Villager characters
PRODUCT — CHOR-POLICE-GAME-THREE.VERCEL.APP

stack: react, typescript, vite, node.js, express, websockets (ws), neon postgres, pwa

copilot-guidePUBLISHED

Copilot Guide — VS Code extension

Brings team coding standards, architecture patterns and security rules directly into the editor, and integrates with GitHub Copilot Chat so generation follows the team's rules. Published on the official VS Code Marketplace.

View on Marketplace →

Features

  • Inline coding guidelines and architecture patterns, surfaced where the code is written
  • @guide chat participant — native GitHub Copilot Chat integration
  • Audits code against OWASP Top 10 plus custom security rules
  • On-demand, standards-compliant snippets from a JSON rules library
VS CODE EDITORHover TipsContext Menu (Audit)Activity BarCopilot ChatCopilot LM APIEXTENSION HOST — NODE.JS / TYPESCRIPTextension.tsactivate() · deactivate()PROVIDERSSidebarProviderHoverProvidercommands / runAuditSERVICESGuidelineServiceAuditServiceCopilotServiceCHAT PARTICIPANT@guide handlerintent detectionprompt builderTYPES & UTILStypes/index.tsmessageTypes.tsfileUtils.tspostMessage IPC (validated messages)reads JSONWEBVIEW UI — REACT 18App.tsx — tabs: Guidelines · Secure Coding · AuditGuidePanelGuideCardCategoryListSearchBarSecureCodePanelAuditResultanti-pattern tipsAuditTabaudit resultsfrom runAuditZustand store — guidelines · activeCategory · searchQuery · auditResultsuseGuidelinesuseAudituseVSCodeGUIDELINES LIBRARY — JSONguidelines/index.jsoncoding/react · typescript · architecture · performanceseverity · bad · good · tags · copilotPromptreferencessecure-coding/owasp-top10.jsonglobalStorage/custom-guidelines.jsonprimary flow — Copilot API streaming, host ↔ webviewsecondary — editor events, JSON reads
FIG. 2 — EXTENSION ARCHITECTURE

stack: typescript, vs code api, copilot chat api, react 18 webview, zustand, json rules library

aml-triage-agentOPEN SOURCE

AML Triage Automation Agent

An open-source anti-money-laundering triage system that runs suspicious-activity alerts through a 5-stage agentic pipeline before a human gate. Fully local: LangGraph orchestration, a 1B-parameter LLaMA model and pgvector retrieval — zero cloud API cost, runs on a laptop.

Pipeline — 5 stages

  1. 01 — INTAKE

    Normalises the alert and extracts typology keywords

  2. 02 — EVIDENCE RETRIEVAL

    Semantic RAG search across transaction logs, precedent cases and typology guides

  3. 03 — RISK SCORING

    LLM analyses alert plus evidence into structured JSON risk scores

  4. 04 — SAR DRAFTING

    Generates a compliance-ready Suspicious Activity Report narrative

  5. 05 — HUMAN GATE

    Analyst approval checkpoint before anything is filed

Field notes

  • pgvector inside Neon Postgres is production-ready
  • 1B-parameter local models produce reliable structured JSON with proper prompting
  • State schema design between agents is the hardest engineering problem
DEMO — ALERT INTAKE TO SAR DRAFT
NEXT.JS FRONTEND — PORT 3000alert submission form · SAR review UI · SSE progress streamPOST /api/v1/alert · GET /alert/{id}/stream (SSE)FASTAPI BACKEND — PORT 8000async · server-sent events · asyncio.Queue · Neon reads / writesgraph.invoke(AlertState)LANGGRAPH STATEGRAPH PIPELINE01 INTAKEenrich · typology detect02 RETRIEVALRAG · pgvector search03 SCORINGLLM · JSON risk score04 SAR DRAFTcompliance narrative05 REVIEWhuman gate · approveLOW risk — skip SAR draftembed + searchLLM inferenceNEON POSTGRES (PGVECTOR)alerts · sars · documents · langchain_pg_embeddingivfflat index · eu-west-2.aws.neon.techOLLAMA — LOCAL, PORT 11434llama3.2:1b — risk scoring & SAR draftingnomic-embed-text · zero API cost · no GPU required
FIG. 3 — SYSTEM ARCHITECTURE

stack: langgraph, fastapi, pgvector, neon postgres, llama 3.2, next.js, python

SYS/02 — ENTERPRISE TRACK RECORD

14 years in regulated delivery

Banks, national retail and global e-commerce — HSBC, Deutsche Bank, ASDA and Premier Farnell. Shipped platforms with real numbers attached.

  • 2025—NOWHSBCFinancial-crime and compliance platforms — micro-frontend engineering in a regulated banking estate.
  • 2025—2025DEUTSCHE BANKTrade severance system — scalable React frontend with D3 data visualisation for a critical trade workflow.
  • 2021—2024PREMIER FARNELLGlobal e-commerce platform serving 55 countries — 25% conversion uplift; plus the CPC B2C storefront.uk.farnell.com ↗cpc.farnell.com ↗
  • 2018—2021ASDAToYou parcel service site, native apps for handhelds, kiosks and lockers, and AMR robot automation in the national sort centre.toyou.co.uk ↗amr on youtube ↗
  • 2011—2016CONSULTINGEnterprise web delivery for Winc, Pfizer and Johnson & Johnson across retail and healthcare.
Deutsche BankASDAPfizerJohnson & JohnsonWinc

SYS/03 — CAPABILITIES

What I work with

Curated for the work above — not an inventory.

FRONTEND SYSTEMS

React · TypeScript · Micro-Frontends (Module Federation) · Next.js · State architecture · Design systems (Carbon / MUI) · WCAG

AI ENGINEERING

LangGraph · RAG / pgvector · Agent pipelines · VS Code extension APIs · LLM integration · Prompt systems

PLATFORM

Node.js · FastAPI · WebSockets · Postgres (Neon) · GCP · CI/CD (GitLab)

PRACTICE

TDD (Jest / RTL) · Observability (Grafana, Dynatrace, Splunk) · Agile in regulated environments

REF/A — WRITING

Notes from the field

FRONTEND ENGINEERING · 2013 → 2026

From Pixel-Pusher to Experience Architect

Frontend engineers are no longer building standalone interfaces — we are building intelligent agents. Tracing the evolution from React's birth in 2013, through manual state synchronisation and lifecycle complexity, to AI-driven development where the canvas is expanding and we become experience architects.

read on linkedin ↗

Building a local AML triage agent with open-source AI

How domain knowledge plus AI engineering streamlines compliance triage — LangGraph, LLaMA and pgvector, with zero cloud API cost.

linkedin ↗

Copilot Guide — launching a VS Code extension

Shipping team coding standards and security rules into the editor, integrated with GitHub Copilot Chat.

linkedin ↗

REF/B — CREDENTIALS

Verified credentials