Selected Projects

Personal Portfolio Site

Vite 6 · Three.js · GSAP + Lenis

• Built and shipped to production two independent, framework-free Vite static sites with custom Three.js WebGL hero scenes and a shared GSAP/Lenis animation pattern
• Diagnosed a silent CI/CD deployment failure across two production pipelines, isolating a CDN-fronted hostname as root cause and restoring 100% deploy success
• Architected path-filtered, per-site GitHub Actions pipelines so unrelated site changes trigger zero cross-site rebuilds

Shoshin Systems — Agency Site

Vite 6 · Three.js · GSAP + Lenis

• Second independent site in the same path-filtered monorepo, deployed to a custom domain with zero shared runtime dependencies from the portfolio site
• Established a credentials-and-infrastructure runbook decoupling all secrets from source control while keeping deployment topology documented and reproducible
• Added a new privacy-policy page through the existing CI/CD pipeline with zero pipeline changes

CHMF Healthcare & Accounting System

Python · Django · PostgreSQL · QODBC

• Architected an enterprise in-house healthcare and accounting system from scratch for a medical cooperative federation, with a service-layer architecture separating business logic from controllers and models
• Implemented double-entry accounting with atomic transactions, debit/credit validation, and a Draft → Approved state machine with idempotency keys
• Solved a legacy 32-bit QuickBooks Desktop + Python integration via the QODBC driver, building a Chart-of-Accounts sync pipeline

Internal enterprise system — no public link

Republika Steel — Inventory & Admin Panel

Ruby on Rails · MySQL · Render

• Built a sales invoice and inventory admin panel with role-based access control and PDF invoice generation
• Deployed to production on Render with a Rails + MySQL stack

Private system — no public link

SmartResume — AI-Powered Resume Builder

FastAPI · Next.js 16 · React 19 · TypeScript

• Built an AI-powered resume builder with a knowledge-base system (profile, experience, education, skills, projects, certs), job URL scraping, fit scoring, and tailored resume/cover-letter generation
• Migrated the app from a shared-secret auth model to real per-user accounts — password hashing, DB-backed sessions, and per-user encrypted API-key storage across every table and router
• Fixed a live concurrency bug where AI provider credentials were read from a process-global environment variable shared across concurrent requests from different users

TCG Arbitrage Explorer

Next.js 16 · TypeScript · Prisma 7 + PostgreSQL · Playwright · Cheerio

• Designed a three-tier price-scraping fallback pipeline (headless-browser scrape → static HTML parse → cached snapshot) with heuristic DOM-candidate scoring, keeping the dashboard populated despite a third-party site with no public API
• Modeled a weighted arbitrage-scoring system in Prisma/PostgreSQL exposed through an aggregated dashboard API computing leaderboards and top movers over hundreds of tracked card pairs in a single request
• Implemented a scheduled background sync job (node-cron) that selectively refreshes only stale records, bounding scrape load to the stale subset of the catalog

Built, pending deployment — v2 architecture (Prisma/PostgreSQL, scheduled sync) rebuilt on this same concept

PSE Stock Compass

Next.js 16 · TypeScript · Cheerio · lightweight-charts

• Engineered a resilient data pipeline scraping the Philippine Stock Exchange with a three-tier fallback chain (disk cache → live scrape → static snapshot) guaranteeing near-100% uptime
• Built a composite financial health-scoring engine synthesizing earnings trends, debt-to-equity ratios, valuation multiples, and dividend sustainability into a single weighted score
• Designed a fault-tolerant Cheerio-based scraping layer with fuzzy label matching across 200+ listed companies with no per-ticker configuration

Built, scrapped for now — revisit post-September 2026

Only10 (ReelsCreator)

TypeScript · Node.js · Express · Puppeteer · FFmpeg

• Architected an end-to-end short-form video generation pipeline converting structured JSON content into rendered 1080x1920 MP4 reels with no external rendering service
• Solved deterministic frame-accurate video capture by pausing and manually stepping CSS Web-Animations time in headless Chrome
• Generated 2,016 real rendered video outputs proving a production-grade pipeline, not a prototype

Built, pending deployment

SkillStack Certification Tracker

Next.js 16 · React 19 · TypeScript · Recharts

• Architected a zero-backend certification-tracking dashboard using browser localStorage as the sole persistence layer, eliminating server infrastructure and hosting cost
• Built a weighted ROI-scoring engine ranking certifications across four independent axes, driving sorting, filtering, and a "Top 5" recommendation widget
• Designed a byte-accurate storage-guard system preventing silent browser-storage quota failures

Premium Video Downloader

FastAPI · yt-dlp · curl-cffi · React 19 + Vite

• Built a full-stack video retrieval service abstracting yt-dlp's raw multi-format output into a filtered, client-ready API
• Resolved a platform-compatibility blocker by integrating curl-cffi TLS/browser impersonation to unblock downloads against bot detection
• Implemented correct binary file delivery with RFC 5987-compliant filename headers

Built, pending deployment

Claude Usage Widget

Python 3 · PySide6 (Qt6) · keyring · pytest

• Re-architected a Windows-only desktop app into a fully cross-platform Qt client, replacing OS-specific credential storage and autostart mechanisms with unified APIs for Windows, macOS, and Linux
• Directed a structured, review-gated engineering process that surfaced and resolved a dozen-plus concurrency defects — including fatal thread-destruction crashes and a spoofable cookie-domain validation bug — before they reached end users
• Built a 76-test automated suite from zero coverage for a previously untested GUI application, validating threading and state-mutation logic headlessly with no physical display

Built — cross-platform release candidate

Content Guard

Chrome Extension · Manifest V3 · declarativeNetRequest

• Built a Manifest V3 Chrome extension enforcing network-level content blocking via declarativeNetRequest, eliminating reliance on deprecated blocking APIs ahead of Chrome's MV2 sunset
• Designed a dynamic rule-sync system scaling user-managed blocklists from a static 2-entry set to 500 concurrently enforced domains
• Audited the store listing and default configuration against platform disclosure policy before submission, correcting a metadata-transparency gap

Shoshin Tools

Eleventy (11ty) · Vanilla JS · pdf-lib · fflate

• Built and shipped 70 free, single-purpose developer utilities and financial calculators (JSON formatter, JWT decoder, five client-side PDF tools, an in-browser OCR tool, a 55-country regional-pricing calculator, mortgage/tax/investing calculators) as one zero-framework Eleventy static site, with all processing client-side and no accounts, uploads, or server-side data handling
• Implemented a full light/dark theming system — CSS custom-property token layer, a CSP-compliant external no-flash script, and a pure theme-resolution module covered by unit tests — retrofitted across all 70 tool pages with zero flash-of-wrong-theme
• Ran a security and SEO audit that caught and fixed a DOM-based XSS vulnerability (unescaped error messages via innerHTML) across 9 tools, then closed out meta-description/title-length and structured-data gaps site-wide

Usage Meter for Claude.ai

Chrome Extension · Manifest V3 · Playwright

• Built a Chrome extension surfacing 7-day claude.ai session/weekly usage-cap tracking directly in the toolbar, with no API key or sign-up required
• Verified the extension against a real loaded Chrome instance via a Playwright script mocking claude.ai's endpoints and asserting actual badge text/color through genuine extension code paths, not just unit tests
• Took the extension through a full store publish-readiness pass — trademark-safe rebrand, a dedicated privacy-policy page, real generated icons — ahead of Chrome Web Store submission

Design Systems

Eleventy (11ty) · GSAP/ScrollTrigger · Three.js

• Built a gallery of 58 fully-realized fictional-business design systems, each with a distinct brand, a computed-WCAG-contrast color system, a from-scratch inline-SVG logo, and a signature scroll-driven interaction mechanic tied to that brand's real-world process
• Adopted a third-party design-audit tool mid-project after the gallery's visual output was flagged as generic, then retrofitted the existing registry through the new audit/critique gate rather than applying it only to new work going forward
• Diagnosed and fixed two recurring scroll-animation bug classes across the batch (a viewport-height-dependent completion bug, an SVG-transform-vs-JS-transform collision), backporting both fixes to earlier systems once found

Prompt Library

Next.js 16 (App Router) · Supabase (Postgres/Auth/RLS) · Vitest

• Built a multi-user AI-prompt manager with three independently-composable visibility tiers (private, revocable share-link, and a public gallery at /explore readable without an account) — authorization enforced entirely through Postgres Row Level Security, never app-layer checks
• Ran a full defensive security audit post-launch that found and fixed a critical, live privilege-escalation bug — a forged share link could grant permanent read access to any user's private prompt by UUID alone — closed with a layered ACL/RLS/function-level fix and a revoke-cascades-access trigger, verified against the real production database before and after
• Deployed to Vercel + Supabase Cloud with CI (lint, typecheck, tests, dependency audit) gating every push, catching a route-typegen ordering bug that only surfaced on a truly fresh checkout, invisible in local dev

Remotive MCP Server

Python · MCP Python SDK · httpx · Pydantic

• Built and published an MCP (Model Context Protocol) server exposing Remotive's public remote-job board as two tools — keyword/category search and full job-detail lookup — connectable to Claude Desktop or Claude Code with zero API key
• Diagnosed a live upstream defect where Remotive's CDN cached responses by URL path only, silently ignoring all query-string filters, and worked around it with client-side filtering over the full listing — verified via response cache headers, not assumption
• Verified correctness with a real stdio MCP client/server protocol session (not just unit tests) plus a 10-question evaluation set with hand-checked answers against the live API

Cloudflare Uptime Monitor

Cloudflare Workers · Hono · D1 · Cron Triggers

• Built a self-hosted uptime monitor entirely on Cloudflare's edge stack — a Worker on a 5-minute Cron Trigger checks site health and writes to D1, the same Worker serves a server-rendered status page, no separate frontend build or Pages project
• Ran a subagent-driven implementation with a review after every task plus a final whole-branch review, which caught two real bugs no single task's reviewer could see — a missing spec-mandated error state on D1 failure, and outbound health checks not bypassing Cloudflare's own edge cache, which could have silently reported a down site as up
• Deployed end-to-end (D1 database, migrations, Cron Trigger) with a 21-test suite run against real local D1 emulation, not mocks, and a clean TypeScript typecheck gating every change

PokéRAG AI

Qdrant · LangChain · RAGAS · MCP · LangGraph · CrewAI · Gradio

• Built a full RAG-to-agentic pipeline across 8 independently-verified stages: vector search (Qdrant) → RAG (LangChain) → quantitative evaluation (RAGAS) → tool-calling (MCP) → stateful workflows (LangGraph) → multi-agent orchestration (CrewAI) → production deployment
• Ran a 20-question RAGAS evaluation harness that quantified a real retrieval weakness — structured facts were never embedded, the worst-performing question category — then closed that exact gap with a Postgres store and re-verified the fix against the same harness
• Shipped a LangGraph workflow with a genuine human-in-the-loop interrupt (pause execution, wait for external approval, resume from persisted state) and a 6-agent CrewAI crew independently verified hallucination-free by a dedicated fact-checking agent
• Root-caused a Hugging Face ZeroGPU deployment failure to a large model object crossing a subprocess boundary as a function argument, diagnosed from the platform's own error trace rather than trial and error

PoopLog

Vite · React 19 · TypeScript · Supabase (Postgres + RLS) · vite-plugin-pwa

• Shipped an installable offline-capable PWA to commodity shared hosting as a static bundle with no Node runtime, backed by a managed Postgres database, with production auth configured end-to-end (custom SMTP, redirect URLs, local/prod environment split)
• Built the entire authorization model — owner-only records, a revocable read-only share, and a two-step invite / claim / owner-approve handshake — in Postgres Row Level Security plus one SECURITY DEFINER function with anonymous execute revoked, with zero application-layer permission checks
• Verified every access-control boundary against the live production database with automated, self-cleaning scripts — each RLS policy, the full invite → approve → revoke handshake, and a deliberate cross-tenant write that correctly returned a 403 row-level-security error
• Ran a structured pre-launch audit (security, web-readiness, search hygiene): took the site from a single CSP directive to a locked-down policy, added a React error boundary and real 404s, and bounded previously-unbounded text columns to close a shared-tier storage-exhaustion vector — each fix verified headless before shipping
• Delivered a bespoke katazome (Japanese stencil paste-resist cloth-dyeing) design system across every screen — one authored motif, a single dye owning whole regions, a reduced-motion-safe signature interaction

BridgeView

Eleventy · GSAP & ScrollTrigger · Web3Forms

• Built a real marketing and lead-capture site for a ₱55M preselling townhouse, from spec through an 11-task subagent-driven implementation with a per-task reviewer and a final whole-branch review
• Rebuilt the entire visual system after a direct design rejection — ran a full redesign cycle into a bespoke "Cyanotype Plot" blueprint/cadastral design language, then layered in GSAP parallax, count-up figures, and choreographed scroll reveals
• Ran three self-authored audit skills (security, SEO/GEO/AEO, web-readiness) against the live build and shipped the fixes directly — a build-time CSP script hash tied to the actual rendered JSON-LD, a spam honeypot, an AI-crawler allowlist, and FAQPage schema for answer-engine citability
• Diagnosed a misleading third-party-API CORS error down to its real cause (a narrower server-side email-delivery gap, not a CORS misconfiguration) by testing across localhost, the live domain, and a direct API call rather than trusting the browser's own error message

DOCUMENT·RAG

React · Vite · Supabase (Postgres + pgvector, Auth, Storage) · Deno Edge Functions · Gemini · Tailwind v4

• Built a reusable single-tenant RAG application end to end — a React/Vite SPA plus a Supabase backend (Postgres + pgvector, Auth, private Storage, two Deno Edge Functions), in-function embeddings, a provider-swappable LLM client, client-side PDF text extraction, salted per-IP rate limiting, and Row Level Security on every table with the vector-chunk table given no client access at all — architected for one isolated deployment per client
• Deployed it to production: provisioned a dedicated managed-Postgres project, pushed the migration set, verified Row Level Security had landed on every table against the live database, set the rate-limiter and salted-hash secrets, deployed the edge functions, seeded the admin account with the service role, and shipped the static bundle to a CDN host — then smoke-tested the ingest → cited-answer → audit-log path against the live stack
• Diagnosed and fixed two deployment failures a fully green test suite could not surface: a third-party model identifier that had been retired and returned 404 only against newly-issued API keys, and a single-page-app deep-link fallback rule the production web host silently ignored, routing every hard refresh of a client-side route to the host's own 404 page
• Designed the frontend on a Tailwind v4 and copied-primitive component layer with a signature interaction that bidirectionally links every inline citation to the exact source passage behind it — hover a claim and its source lifts and expands; hover a source and its claims highlight in the answer

Design Systems (React)

Next.js 15 (static export) · React 19 · Tailwind v4 · shadcn/ui + Base UI · TypeScript

• Built a second design-system gallery on a React component stack (Next.js 15 static export, shadcn/ui plus three effect libraries) enforcing a strict four-tier component-lane policy — every brand renders from one shared primitive layer re-themed via scoped CSS custom properties, with effect-library usage isolated to a single file and verified in the exported artifact
• Deliberately paired against the existing hand-authored HTML gallery to demonstrate the same design output from a fundamentally different implementation approach — a concrete "can architect the same product two ways" artifact
• Ran the build as a 12-task subagent-driven-development plan and closed it with a layered review (whole-branch code review, browser visual-QA across desktop and mobile, one consolidated fix wave, scoped re-review) that caught a dead theming hook, a prefers-reduced-motion timing bug, a single-source-of-truth violation, and an invisible focus indicator before merge
• Diagnosed and fixed a Tailwind v4 @theme inline gotcha where a CSS-custom-property override compiles to a dead value, and a Base UI button-versus-anchor semantics warning, mid-review

Selah — Daily Prayer PWA

Laravel 12 · PHP 8.2 · Blade · Tailwind v4 · Alpine.js · MySQL · Pest

• Shipped a full Laravel 12 application to commodity shared hosting at zero added infrastructure cost — the first framework (non-static) app on the account — using an app-outside-webroot symlink layout, a version-controlled compiled asset build (the host has no Node runtime), a repository deploy key for pull-based releases, and a server-side release script; server-rendered auth with email verification over a relational MySQL model, plus an admin CRUD area
• Designed a leap-safe fixed 365-day content cycle with per-calendar-day resolved-and-cached selection, and authored the full 365-entry devotional corpus — one distinct public-domain Scripture verse per day, every one imported from a Bible API with zero failures — behind a documented voice guide and a seeder that derives ordering from sorted filenames
• Diagnosed and fixed a production email-verification failure (HTTP 403) caused by an untrusted TLS-terminating reverse proxy — signed URLs were generated over HTTPS but validated against the proxied HTTP scheme; the same misconfiguration silently broke password-reset links
• Ran a structured pre-launch audit (security, web-readiness, search hygiene): full CSP and HSTS in application middleware and mirrored in .htaccess to defeat a host-injected weak policy, an explicit per-agent AI-crawler allow/deny list, route rate-limiting, an inactive-record 404, noindex on the authenticated shell, and a generated Open Graph image
• Delivered a bespoke "illuminated Psalter" design system with a six-palette theming feature — each palette a paired day/night variant, built as one runtime CSS-custom-property token set with a flash-free pre-paint script, persisted server-side and in a deliberately unencrypted cookie read before first paint

Salapi — Personal Finance PWA

Laravel 11 · PHP 8.2 · Blade · Tailwind · Alpine.js · Livewire 3 · SQLite · Pest

• Built a 30-theme runtime theming system on CSS custom properties — one token set driving every component, swappable without a page reload, as the app's signature differentiator
• Pivoted the app from a single-user personal tool to public self-registration, re-architecting every Account, Category, Transaction, and Budget behind per-user Policy-authorized data isolation rather than bolting on a single ownership check
• Found and fixed a real IDOR: QuickAdd and BudgetManager accepted a client-supplied category ID validated only with exists:categories,id, no ownership check — a forged ID leaked another user's private category name onto the attacker's dashboard via Dashboard::spendingByCategory(); closed it with policy authorization plus mass-assignment hardening (dropped user_id from $fillable, switched to relationship-based creates)
• Deployed to Hostinger shared hosting today on SQLite rather than MySQL — a deliberate call, since shared hosting there provisions MySQL only through the hPanel dashboard with no CLI/API path, the same git+SSH deploy approach already proven live on a sibling project (YOKAI)

YOKAI: Night Parade

Laravel 12 · PHP 8.2 · Blade · Tailwind · Alpine.js · Livewire 3 · SQLite · Pest

• Built a deterministic, seeded battle simulator plus two purpose-built analysis tools to tune game balance data-driven instead of by feel: game:sweep, which runs seeded nights across a level×shrine-level grid and surfaces findings like "no wall" / "pushover" / "spike", and game:progress, a Monte-Carlo progression simulator running N seeded player trajectories under different spend policies to report median/p10/p90 nights-to-boss
• Found and closed a CRITICAL security hole: two Livewire components credited in-game currency straight from a client-editable public component property instead of recomputing server-side — provably exploitable via Livewire::test(...)->set('state.rewards.gold', 999999999)->call('claim'), which actually credited the forged amount; fixed by recomputing rewards inside a DB transaction from server-only session state
• Ran an HD-2D presentation pass (Octopath/Sea of Stars–inspired) on an AI-generated + CV-recovered pixel-art pipeline — style-anchored Gemini/Duck.ai generation, a grid-based pixel-art recovery tool, then hand-conformed sprites — replacing an initial mixed-source asset set with one cohesive roster
• Ships as an installable PWA with a full day/night idle-RPG loop (shrine upgrades → auto-battle → boss), live today with real GA4 analytics wired behind a proper Google Consent Mode v2 banner