Selected Work

A bespoke workforce management platform designed to automate payroll and tracking for a distributed team of developers and creatives.

The Challenge

As my independent practice grew, managing international developers, QA engineers, and designers via Google Sheets became a significant bottleneck. Fragmented work histories and manual hour tracking led to administrative bloat and potential for human error in financial distributions.

The Solution

I engineered a centralized “Source of Truth” to handle the full lifecycle of team management. By building a custom suite, I moved beyond simple tracking into automated financial logic.

Technical Implementation

• Role-Based Access Control (RBAC): Implemented a secure permission layer to ensure sensitive financial data and admin routes are only accessible to authorized users.
• Automated Payroll Engine: Developed logic to calculate monthly and custom-range payslips, accounting for fixed rates, hourly bonuses, and deductions.
• Real-time Infrastructure: Leveraged Firebase for instant data synchronization across the team dashboard and secure user authentication.
• Fluid UI/UX: Used TailwindCSS to build a responsive, dashboard-first interface that simplifies complex data entry for team members.

Impact

The transition from manual sheets to this automated suite resulted in a 90% reduction in administrative time, allowing me to focus more on high-level architecture and less on manual data entry.

A specialized tracking platform developed for a community society to digitize street-level fund collections and manage operational expenses.

The Challenge

A local welfare society relied on manual tracking for fund collections across various streets and houses. This made it difficult to identify which houses were pending payments for the month or to get an accurate overview of the society’s current financial standing.

The Solution

I developed a centralized management tool that provides a real-time birds-eye view of all community operations. The focus was on transforming raw data into actionable insights for the management committee.

Technical Implementation

• Relational Data Mapping: Architected a Firebase structure to link Streets to Houses, allowing for complex queries such as “Houses pending payment” for the current billing cycle.
• Aggregated Dashboard: Engineered a dynamic overview panel that calculates critical KPIs: Total Funds, Collection Progress by Street, and Remaining Balances.
• Operational Tracking: Built custom CRUD modules for managing Street lists, Worker details, and monthly Salary disbursements.
• Payment Monitoring: Implemented logic to track pending payments to workers, ensuring administrative tasks are handled before they become bottlenecks.

Impact

The system replaced paper-based tracking with a one-click dashboard, providing immediate visibility into collection gaps and operational costs, which significantly improved the society’s monthly planning.

An AI-driven e-commerce personalization engine that tracks real-time shopper behavior to adaptively display personalized content and product suggestions.

The Technical Challenge

The core of Product Genius AI is a sophisticated “Observer” widget. As a Senior Frontend Engineer, my mission was to maintain and upgrade the Merchant Dashboard, which serves as the brain for store owners to manage subscriptions, content integrations, and widget customization.

Key Contributions

1. Extending Shopify Polaris

To maintain a “Pixel-Perfect” standard without duplicating code, I architected a custom component library on top of Shopify Polaris. By using TypeScript generics and CSS variables, I created reusable wrappers (like the PGButton) that allowed us to customize the design system efficiently while staying within the Polaris ecosystem.

2. The Design Tab Evolution

I led the overhaul of the Design Tab, a complex in-app editor. I transformed it into a fully responsive interface, ensuring merchants could manage their AI widget layouts and product cards seamlessly from any device, including mobile.

3. Performance-First Public Site

I developed the new version of the public-facing marketing site using Next.js (SSG) and TailwindCSS. By leveraging Static Site Generation, I ensured the site achieved top-tier Core Web Vitals and SEO performance.

4. Codebase Refactoring

I took ownership of a codebase that had passed through multiple hands. I implemented a clean folder structure and modular architecture, which significantly reduced file clutter and increased the team’s development velocity.

A desktop automation tool built to optimize e-commerce logistics by restructuring high-volume shipping labels for cost-effective printing.

The Challenge

The Daraz seller platform generates shipping labels in a format that allocates one label per page, leading to significant paper waste and increased printing overhead for high-volume stores. Manually rearranging these labels was a time-consuming chore that stalled the fulfillment process.

The Solution

I engineered a cross-platform desktop application using Electron.js that automates the “nesting” of shipping labels. The tool intercepts standard Daraz PDF exports and intelligently realigns them into a print-optimized layout.

Technical Implementation

• PDF-to-Image Pipeline: Developed a processing engine to convert static PDF pages into transparent image layers for dynamic manipulation.
• Smart Layout Engine: Built an algorithm to calculate and re-align 2–3 labels per A4 sheet, maximizing space utilization without compromising barcode scan-ability.
• Desktop Integration: Leveraged Electron’s file system access to allow users to handle bulk files locally, ensuring privacy and speed.
• UX Flow: Streamlined the workflow into a three-step process: Upload, Auto-Adjust, and Download.

Impact

The tool effectively cut printing costs by up to 60% and reduced the time spent on print preparation from several minutes to a few seconds. It turned a manual logistics bottleneck into a two-click automated task.

A high-scale enterprise real estate ERP featuring dual-app architecture for property owners and tenants, managing complex leasing, accounting, and maintenance workflows.

The Technical Challenge

PPM is a massive ERP-level system comparable to industry leaders like AppFolio. The challenge was to manage deep, interconnected workflows; including leasing, accounting, inventory, and maintenance across two distinct applications (Admin/Owner and Tenant) while maintaining strict Role-Based Access Control (RBAC).

Key Contributions

1. Lead Frontend Architecture

I architected 90% of the frontend from scratch, establishing the foundational folder structure and state management strategy using Redux Toolkit. I served as the Lead Engineer, supervising junior developers and ensuring code quality through rigorous PR reviews and cross-functional coordination with Backend and DevOps teams.

2. Custom Component Systems

On the public-facing platform, I moved away from heavy third-party libraries to optimize performance. I engineered a library of lightweight, reusable components (such as custom Accordions and Modals) using TailwindCSS, ensuring we only shipped the exact code required for the UI, significantly reducing bundle size.

3. Enterprise-Grade State & Logic

I implemented complex business logic for modules like Purchase Orders, Fixed Assets, and Rental Applications. By utilizing Axios interceptors and modular Redux slices, I ensured that data flow remained predictable and secure across the multi-tenant environment.

4. Performance & Scalability

Focused on Code Splitting and Lazy Loading to ensure the enterprise engine remained performant even as the feature set grew. I translated intricate Figma designs (including: complex hover animations) into a responsive, accessible system that handles high-density data without sacrificing user experience.

A premium, single-product e-commerce platform for high-end Pilates equipment, featuring a dynamic content system and seamless checkout.

The Technical Challenge

Frame Fitness is a luxury brand selling a high-end Pilates Reformer. The digital requirement was a high-conversion platform that felt as premium as the hardware itself. My challenge was to build a rock-solid frontend architecture that could handle secure payments and dynamic content while maintaining 100% brand integrity.

Key Contributions

1. High-Fidelity UI Development

Working directly from complex Figma specifications, I translated the luxury aesthetic into a pixel-perfect, responsive interface. This was a “Frontend-Only” ownership role where I ensured every transition, layout, and typography choice reflected the premium nature of the brand.

2. Hybrid Data Architecture (GraphQL & REST)

To power the dynamic blog system, I implemented GraphQL to fetch data directly from Shopify, while utilizing RESTful APIs for core product data. This hybrid approach allowed us to keep the frontend lightweight while leveraging the best features of different backend services.

3. Secure Payment Integration

I was responsible for integrating Stripe into the custom checkout flow. This required a deep understanding of asynchronous state management to ensure a seamless and secure transaction experience for high-ticket customers.

4. Cross-Functional Collaboration

I managed the entire frontend lifecycle, collaborating closely with a Django backend engineer. Together, we established the contract between the UI and the API, ensuring a smooth handoff and robust data validation across the platform.