Skip to content
05 / Projects

Things I've Built

Each project here is a system I designed, built, and deployed end-to-end. These aren't tutorial clones — they solve real operational problems for real clients or academic challenges.

  1. Cipta Craft · Lead Developer · 2024

    Production

    Comprehensive gym management ecosystem integrating memberships, payments, QR-based access control, and trainer booking into a unified web + mobile platform. Consolidated multiple operational systems, reducing administrative overhead by 50%.

    Payment Integration

    Revenue Monster · Razorpay

    Real-time Chat

    Trainer ↔ Member messaging

    QR Access Control

    Keycard-free gym entry

    Row-Level Security

    Supabase RLS enforcement

    The Problem

    The client operated a gym chain relying on spreadsheets, physical logbooks, and manual payment receipts. New member onboarding took 15–20 minutes per person, access control was handled by staff manually checking IDs, and trainers had no dedicated channel to communicate with members.

    The Solution

    Architected a multi-tenant platform across web (Next.js 15) and mobile (React Native / Expo) backed by a single Supabase + PostgreSQL database with row-level security. Integrated Revenue Monster and Razorpay for payment processing, a QR-code generation system for keycard-free gym entry, and a real-time chat layer for trainer–member messaging.

    50%Reduction in admin overhead
    < 3 minNew member onboarding time
    0 staffRequired at entry gate
    • Next.js 15
    • React Native (Expo)
    • Supabase
    • PostgreSQL
    • Cloudflare R2
    • Razorpay
    • TypeScript
    • Docker
  2. Cipta Craft · Full-Stack Dev · 2024

    Anjung Meriah CMS

    Technical Case Study
    Production

    Full-stack corporate platform with a public-facing marketing website and a secure internal CMS. Designed for zero developer intervention in daily operations — all content managed through the admin panel.

    Public Site + CMS

    Decoupled architecture

    JWT Auth

    Rate-limited admin panel

    Full CRUD

    Projects, media, promotions

    ISR

    Next.js incremental static regen

    The Problem

    A property development firm needed their website rebuilt, but had no technical team to manage content updates. Every text change required contacting the original developer and waiting days for deployment.

    The Solution

    Built a decoupled architecture: a statically generated Next.js public site (ISR for near-instant rebuilds) and a private admin CMS protected by JWT auth with rate limiting. All models are database-driven and fully CRUD-capable from the dashboard.

    100%Content managed by non-devs
    ISRPage rebuilds in < 1s
    Append-only audit trail
    • Next.js
    • TypeScript
    • PostgreSQL
    • JWT
    • shadcn/ui
    • Docker
    • Nginx
  3. Final Year Project · ML Developer · 2024

    Academic

    AI-powered papaya crop diagnostic tool using a two-stage ML pipeline: EfficientNetB0 for disease image classification, followed by a Hugging Face LLM generating human-readable treatment recommendations.

    EfficientNetB0

    Custom-trained disease classifier

    Hugging Face LLM

    Treatment text generation

    FastAPI Backend

    REST API inference layer

    Containerised

    Docker + CI/CD pipeline

    The Problem

    Malaysian smallholder papaya farmers lack affordable, real-time access to crop disease diagnostics. Agronomist consultations are expensive and slow — by the time a diagnosis is made, crop damage has spread significantly.

    The Solution

    Trained a custom EfficientNetB0 model on a curated papaya disease dataset for multi-class image classification. A second stage pipes the classification result into a Hugging Face LLM that generates plain-language treatment recommendations in Bahasa Malaysia and English.

    92%Disease classification accuracy
    2-stageVision + language pipeline
    < 3sEnd-to-end inference time
    • Python
    • FastAPI
    • TensorFlow
    • EfficientNetB0
    • Hugging Face
    • Docker
    • React Native
  4. Academic Project · Full-Stack Dev · 2023

    TVPSS Management Information System

    Technical Case Study
    Academic

    Centralised system for managing school TV station operations across Johor. Role-based access for administrators, teachers, and student crews, covering scheduling, equipment inventory, and automated student onboarding workflows.

    Role-based Access

    3-tier hierarchy

    Hibernate ORM

    MySQL schema + audit log

    REST APIs

    Scheduling + inventory endpoints

    Layered Architecture

    Controller / Service / Repo

    The Problem

    The Johor state education department managed dozens of school TV stations (TVPSS) through a fragmented system of emails, Excel sheets, and phone calls. Equipment tracking was unreliable, and student crew management had no audit trail.

    The Solution

    Designed a layered Java Spring Boot application with Hibernate ORM and a MySQL database. Three distinct role hierarchies (state admin, school admin, teacher/crew) each see tailored dashboards. RESTful API endpoints support scheduling, inventory CRUD, and a bulk-onboarding CSV import for student crews.

    35%Reporting efficiency improvement
    3-tierRole-based access control
    0 emailsFor standard crew onboarding
    • Java
    • Spring Boot
    • Hibernate
    • MySQL
    • REST APIs
    • Thymeleaf
  5. Personal Project · Full-Stack + AI · 2025

    Job Application AI Tool

    Technical Case Study
    Open Source

    AI-powered suite that generates tailored job application emails and optimizes resumes using Google Gemini 2.5 Flash. Evolved from a single-purpose generator into a full Career Operating System with a Kanban pipeline, bulk JSON ingestion, and PostgreSQL-backed persistence.

    Gemini Vision OCR

    No Tesseract — pure API OCR

    Kanban Pipeline

    Applied → Offer tracking board

    ATS Resume Tuner

    Keyword alignment + match score

    Bulk JSON Import

    Multi-application ingestion

    The Problem

    Job seekers waste hours manually tailoring emails and resumes for each application, with no systematic way to track which roles they've applied to or which documents they sent. Traditional OCR tools require heavy system dependencies, making the setup painful.

    The Solution

    Built a decoupled FastAPI + React.js platform that accepts job descriptions and resumes through any format — text paste, PDF upload, image upload (OCR via Gemini vision), or a direct URL. Gemini 2.5 Flash generates tailored emails and ATS-optimised resume rewrites. A SQLAlchemy-backed application tracker with Kanban and list views manages the full job application lifecycle.

    5+Input modes (text, PDF, image, URL)
    2AI endpoints (email + resume)
    O(1)Local OCR compute cost
    • Python
    • FastAPI
    • React.js
    • Google Gemini 2.5 Flash
    • SQLAlchemy
    • SQLite
    • PostgreSQL
    • Docker
  6. Open Source · Core Developer · 2025

    WhatsApp Automation & Third-Party Sync Engine

    Technical Case Study
    Open Source

    An enterprise-grade, headless browser automation engine designed to programmatically interface with WhatsApp Web infrastructure without relying on official API wrappers. Features an advanced anti-detection stealth framework, decoupled filtering pipelines, and real-time syncing to Notion workspaces.

    Stealth Injector

    Bypasses behavioral telemetry scanners

    Modular Pipeline

    Decoupled engine, filters, sync layers

    Notion Integration

    Asynchronous real-time telemetry syncing

    Local Fallback

    State reconciliation on network blips

    The Problem

    Enterprise operations require programmatically interfacing with WhatsApp messages to synchronize states and logging telemetry to platforms like Notion. However, modern bot mitigation systems employ sophisticated behavioral fingerprinting (analyzing navigator.webdriver flags, WebGL capabilities, mouse movements) that instantly block standard headless automation engines. Additionally, real-time sync introduces a high risk of duplicate records or data gaps during API rate limits and network blips.

    The Solution

    Developed a Python-based headless browser automation engine powered by Playwright and Selenium, featuring a modular pipeline architecture with isolated boundaries. The engine includes a stealth injection layer that dynamically overrides client-side JavaScript automation properties and simulates human-like timing variations to evade detection. To handle network blips, the pipeline uses an isolated filter layer and a localized exclusion system (excluded_log.txt) for robust state reconciliation without duplication.

    StealthAnti-bot evasion framework
    Real-timeNotion workspace synchronization
    ModularPipeline architecture pattern
    • Python
    • Playwright
    • Selenium
    • Notion API
    • YAML
    • Unittest
  7. Academic Project · Full-Stack Dev · 2024

    StudyFlow ERP & Academic Analytics Engine

    Technical Case Study
    Academic

    An enterprise academic ERP and performance tracking portal designed to automate grading workflows, advisor intervention channels, and multi-tenant student tracking. Features dynamic Vite + Vue 3 client-side analytics dashboards and a native custom Object-Oriented PHP REST API engine protected by JWT authentication middleware.

    Role-Based Guards

    Admins, Advisors, Lecturers, Students

    JWT Auth Middleware

    Stateless secure session tracking

    Client Analytics

    Vue-based peer matrix comparison

    OpenAPI / Swagger

    Interactive route contracts

    The Problem

    Traditional educational facilities rely on outdated, manual grading spreadsheets and disjointed, error-prone academic record keeping. This fragmentation slows down advisor intervention loops, makes real-time student performance comparison extremely difficult, and leaves student grade-remarking workflows opaque and unmonitored.

    The Solution

    Engineered StudyFlow, a multi-tenant academic ERP designed with a decoupled client-server model. It implements dynamic Vue 3 dashboards tailored for administrators, lecturers, academic advisors, and students. The backend utilizes a Native OOP PHP REST API with Custom JWT authentication middleware, orchestrating grading pipelines, peer matrices, and re-marking loops inside a containerized Docker-Compose stack.

    Vite + Vue 3Client-side analytics engine
    Native PHPObject-Oriented API service
    Multi-RoleCustom dashboard matrices
    • Vue.js 3
    • Vite
    • TypeScript
    • Pinia
    • PHP
    • MySQL
    • Nginx
    • Docker
    • Tailwind CSS
    • Swagger
  8. Open Source · Lead Developer · 2024

    StudySync Polyglot Indexing Matrix

    Technical Case Study
    Open Source

    An enterprise academic resource indexing platform featuring a decoupled architecture. The backend runs on a custom, un-nested framework-less Perl 5 HTTP socket daemon, providing secure granular access matrices. The front end uses a reactive Vue.js single page application for cohort-scoped document visibility controls.

    Framework-less Daemon

    Custom HTTP socket parsing loop

    Multi-Tier Access

    Semester, category, & link permission mappings

    Unified SQL Gateway

    Secure procedural DBI database mapping

    Automated Auditing

    Low-level endpoint CLI validation scripts

    The Problem

    Traditional multi-tenant file indexes rely on heavy application servers and complex routing stacks that create massive memory overhead. Enforcing granular dynamic permissions across institutional semesters, categories, and direct links via traditional ORM queries introduces severe database bottlenecks and security privilege escalations.

    The Solution

    Engineered StudySync, utilizing an un-nested, low-overhead custom Perl 5 TCP daemon that parses socket headers manually to serve stateless API routes. Built a highly normalized MySQL permission schema mapping semester, category, and direct link matrices, and paired it with a decoupled, reactive Vue.js front end. This shifts access-control verification to efficient single-step database joins, keeping idle server memory footprint minimal.

    Perl 5 SocketCustom HTTP parser & daemon
    Vue.js SPAState-synchronized interface
    GranularACID access control matrices
    • Perl
    • MySQL
    • Vue.js
    • CGI
    • Socket Programming
    • Docker
    • ACID