Projects

Product UI, internal tooling, production systems, and engineering milestones—from live-iframe review apps to DevOps infrastructure and embedded systems.

Jotform · Internal prototype

Review Element Selector

Visual review & durable UI pinning over live iframes

At Jotform I built an internal review app that loads live product surfaces (forms, tables, boards, sign, workflows, and more) in an iframe so reviewers can select elements, draw regions, and leave notes. Selections are stored as fingerprints, not CSS paths, so they survive reloads, virtualization, and duplicate DOM ids. Product-specific adapters plug into a generic scorer. Reviews can be captured as annotated PNGs and kept locally. This is an internal lab / review prototype, not a public product.

Tech Stack

React 18TypeScriptMagnetRspackIndexedDB

Highlights

  • Visual annotation over live product iframes: click-select, area tools, notes, colors, undo/redo
  • Fingerprint-based element identity with a semantic score gate; positional CSS is never enough
  • Entity adapters for virtualized grids and kanban (stable ids vs visual indexes that change on sort)
  • Nested same-origin iframe selection and PNG capture of the live viewport with painted highlights
  • Session persistence in IndexedDB and annotation history / navigator across pages

Production Backend Template

Secure, production-ready Node.js API foundation

A robust backend template focusing on absolute security, strict token management, and session auditing—designed as a reusable foundation for commercial web applications.

Tech Stack

Node.jsExpressTypeScriptMongoDBMongoose

Highlights

  • Double-submit cookie CSRF protection and httpOnly JWT token rotation
  • Up to 5 concurrent devices per user with device fingerprinting
  • Winston structured logging, request ID tracing, email verification

CMS Starter Template

Production-ready CMS frontend integrated with the backend framework

A Content Management System frontend seamlessly integrated with the production backend template, with same-origin proxying and multi-layer admin authorization.

Tech Stack

Next.jsTypeScript

Highlights

  • Same-origin proxying via Next.js rewrites for cookie security
  • Middleware-based route protection with SessionContext CSRF tracking
  • Hierarchical multi-layer Admin role verification

Imagero

Image upload and on-the-fly manipulation API

A specialized microservice serving as an independent image hosting and on-the-fly manipulation engine with filesystem caching for repeat requests.

Tech Stack

Node.jsExpressUUIDFile System Caching

Highlights

  • Deterministic unique asset IDs via UUIDs
  • Dynamic resize/crop via URL parameters
  • Automatic filesystem caching to skip processing overhead

Data Collection & Ingestion Infrastructure

Python automation and structured data pipelines

A Python-based automation and data collection pipeline focused on structured data ingestion, robust backend API design, and automation-friendly workflows.

Tech Stack

PythonFastAPI

Highlights

  • Structured data ingestion architecture
  • Robust backend API design
  • Automation-friendly workflow design

TEKNOFEST 2022 — Electric Vehicle Efficiency Challenge

Embedded software & electronics for AAATLAS Team

Designed and programmed the vehicle control unit (VCU) and Battery Management System (BMS) using Arduino-based microcontrollers. Handled schematic reviews and double-layered PCB layouts in KiCad, with aggressive field testing to balance efficiency against safety and reliability.

Tech Stack

ArduinoKiCadEmbedded CBMS/VCU

Highlights

  • 5th Place Nationwide (Efficiency Category)
  • Jury Special Award
  • Promotion & Dissemination Award