Projects/Case Study
Personal Project — Startup Architect
[YSRCP Cadre Management]
System
A production-grade, full-stack cadre registration and identity card management platform built end-to-end as Startup Architect — serving 13+ lakh registered members across 175 Assembly Constituencies in Andhra Pradesh.
Next.js 16
React 19
TypeScript
Supabase
PostgreSQL 15
Tailwind v4
Deno Edge Functions
AI Photo Enhancement
Production · Live
Role: Startup Architect (End-to-End)
Stack: 231 files · 81K+ LoC
0+
Registrations
0
Assembly Constituencies
0
REST API Endpoints
0+
Lines of Code
0
SQL Migrations
0
User Role Types
01
The Challenge
The Problem
1.3M+ cadre members maintained in paper records and scattered spreadsheets — no digital registry
No standardised identity cards with verifiable barcodes or QR codes
12-level administrative hierarchy spanning national → village with three entity types at leaf level
Thousands of poor-quality photos requiring AI enhancement before print-quality ID card production
Multi-role access requirements across 8 distinct role types from state admin to print validator
Real-time analytics for leadership across geographic and demographic dimensions
The Solution
Full-stack Next.js 16 platform with Supabase backend — single codebase, serverless-first architecture
Auto-generated barcodes and QR codes per registration, scannable for real-time card verification
Cascading geography FK design with runtime lookup maps handling all 12 administrative levels
Supabase Edge Function AI batch processor with async webhook callbacks and admin queue UI
Three-layer RBAC: PostgreSQL RLS + API middleware + server-side page guards
15+ Chart.js visualisations with PostgreSQL RPC aggregation and Zustand filter state
02
Architecture Diagrams
How the System is Built
Interactive diagrams for each architectural layer — click a tab to explore.
01
CLIENT LAYER
React 19 UI, data visualisations, state management & animations
Next.js 16 (Pages Router, SSR/SSG)
React 19 + TypeScript 5
Tailwind CSS v4.1
Zustand — 3 global stores
Chart.js + react-chartjs-2 (15+ charts)
Framer Motion page transitions
React Hook Form + Zod validation
ExcelJS · jsPDF · JsBarcode · QRCode
Next.js 16
React 19
TypeScript
Tailwind v4
Zustand
Chart.js
Framer Motion
02
API LAYER
57 serverless REST endpoints with JWT auth, RBAC and rate limiting
57 Next.js API Routes (Serverless Functions)
JWT auth guards on every endpoint
Role-Based Access Control (8 roles)
OTP rate limiting — DB-backed sliding windows
Zod schema validation (client + server)
Streaming ZIP via archiver.pipe(res)
57 REST APIs
JWT Auth
RBAC
Rate Limiting
Zod
Streaming
03
EDGE FUNCTIONS LAYER
11 Supabase Edge Functions (Deno runtime) for AI processing & async ops
11 Edge Functions on Deno Runtime
ai-photo-batch-processor — AI queue worker
photo-ai-callback — webhook handler
user-auth-management & user-management
crud-operations, geographic-data, master-data
Supabase Cron scheduled batch processing
Deno Runtime
11 Edge Fns
AI Processing
Webhooks
Cron Jobs
04
BACKEND / DATABASE LAYER
PostgreSQL 15 with RLS, PostgREST auto-API, GoTrue auth, 50 SQL migrations
Supabase (PostgreSQL 15)
PostgREST — auto-generated REST from schema
GoTrue — Auth service (email/OTP)
Row-Level Security on every table
50 versioned SQL migrations
3 RPC Functions (aggregated dashboard stats)
Composite indexes on filtered query columns
PostgreSQL 15
PostgREST
GoTrue
RLS
50 Migrations
RPC
05
STORAGE LAYER
S3-compatible private photo storage with time-limited signed URLs and CDN
Supabase Storage (S3-compatible)
Private photo bucket — no public access
Time-limited signed URLs for photo delivery
CDN edge distribution
Parallel photo downloads (50 concurrent waves)
S3 Compatible
Private Bucket
Signed URLs
CDN
50× Parallel
External Services
MSG91
OTP delivery via SMS
Resend
Transactional email
AI Photo API
Photo quality enhancement
Architecture Patterns
DAO Pattern
Repository Pattern
Store Pattern (Zustand)
Streaming Response
Event-Driven (Webhooks)
Batch Processing
Soft Delete
03
Challenges & Solutions
Engineering Decisions
01
10K+ Record Exports Without Memory Overflow
02
12-Level Administrative Hierarchy
03
AI Photo Processing at Scale
04
8-Role RBAC Across Three Layers
05
Real-Time Analytics on 1.3M+ Records
06
Bulk Excel Validation with Geography Cross-Checks
07
ID Card Designation Sizing Across 60+ Variants
04
Technology Stack
Full Stack Breakdown
Frontend
Next.js 16
React 19
TypeScript 5
Tailwind CSS v4
Framer Motion
Chart.js
Zustand
Forms & Validation
React Hook Form
Zod
React Easy Crop
XLSX (SheetJS)
Backend
Supabase
PostgreSQL 15
PostgREST
GoTrue
Deno (Edge Fns)
Data Processing
ExcelJS
Archiver
jsPDF
JsBarcode
QRCode
html2canvas
JSZip
Camera & Scanning
@zxing/browser
React Easy Crop
External APIs
MSG91 (OTP/SMS)
Resend (Email)
AI Photo Enhancement API
DevOps & Infra
Supabase Cron
Signed URLs CDN
RLS Policies
50 SQL Migrations
05
Codebase Statistics
Scale of the System
0
TypeScript/TSX Files
0+
Lines of Code
0
REST API Endpoints
0
SQL Migrations
0
Edge Functions (Deno)
0+
Page Routes
0+
UI Components
0+
Utility Modules
06
API Architecture
57 REST Endpoints
/api/admin
13+ endpoints
ai-photo-bulk-submitPOST
ai-photo-listGET
ai-photo-resetPOST
create-userPOST
dashboard-statsPOST
lookup-by-barcodeGET
mark-card-printedPOST
print-rejectPOST
reports/generatePOST
metadata/* (corporations, mandals, wards…)
/api/bulk-upload
11 endpoints
uploadPOST
validatePOST
listGET
get-recordGET
update-recordPUT
confirm-to-masterPOST
delete-selectedPOST
clear-allPOST
fix-row-numbersPOST
templateGET
/api/print-export
8 endpoints
previewPOST
generatePOST (streaming ZIP)
bulk-approvePOST (≤200)
bulk-rejectPOST
approve-allPOST
reset-exportedPOST
rejected-listGET
resubmitPOST
/api (root)
12 endpoints
send-otpPOST
verify-otpPOST
verify-phonePOST
upload-photoPOST
update-correctionPOST
committee-definitionsGET
positionsGET
wingsGET
metadataGET
grid-upload/templateGET
07
Future Roadmap
Real-time WebSocket subscriptions for live dashboard updates
📱Progressive Web App (PWA) for offline field registration
🌐Multi-language support — Telugu, Hindi, English
📲Mobile app (React Native) for field workers
🔗Blockchain-based card verification
🏛Integration with government voter ID databases
📧Automated report scheduling and email delivery
🤖ML-based duplicate detection beyond exact-match
Want to discuss this system?
I designed and built every layer of this platform — from PostgreSQL schema through Edge Functions to the React UI. Happy to walk through any part of it.
Get in Touch →Back to Projects