Portfolio

Web development portfolio.

Production apps, cloud platforms, zero templates — designed, coded, and deployed end to end. Browse the galleries (screenshots use demo data).

PublicPublic landing page1/14

01

Sunset-Speaks Class Management

Full-stack ESL school platform on the Cloudflare edge

The class-management platform behind Sunset-Speaks, an online ESL tutoring service. Teachers and admins run their entire operation here — scheduling live lessons, tracking student progress, filing class reports, and issuing class-balance receipts.

Solo developer: designed, built, and shipped by me.

  • Cloudflare Worker API backed by D1 (SQLite), R2 file storage, and a Durable Object notification hub
  • Cron triggers for automated monthly backups and hourly pending-report alerts
  • Role-based access (admin / teacher / student) plus an Android WebView companion app
ReactViteJavaScriptCloudflare WorkersD1 (SQLite)R2Durable ObjectsKotlin
Live in production▲ Cloudflare Workers▲ Cloudflare Pages
Portfolio demo preview

Portfolio-only demo preview: frontend on Netlify, backend/database on Supabase. Visitor-created demo data resets every day at 12:00 AM Asia/Manila.

▲ Netlify▲ Supabase
Open demo preview
Attendance calendar1/4

02

RCMI Attendance Checker

Attendance management for a ministry organization

A responsive attendance system for Radiance of Christ Ministries International. Leaders record attendance on a calendar, manage the member directory, and review a leadership overview — then export everything to Excel in one click.

Solo developer: designed, built, and shipped by me.

  • Serverless API via Netlify Functions with Supabase (PostgreSQL) as the datastore
  • Grouped Excel exports (per-day and per-leader sheets) generated client-side with ExcelJS
  • Member directory, leadership hierarchy view, and password-protected admin actions
React 19ViteJavaScriptNetlify FunctionsSupabaseExcelJS
Live in production▲ Netlify▲ Supabase
Portfolio demo preview

Portfolio-only demo preview: frontend on Netlify, backend/database on Supabase. Visitor-created demo data resets every day at 12:00 AM Asia/Manila.

▲ Netlify▲ Supabase
Open demo preview
Dark theme1/2

03

Hours Tracker

Calendar-based work hours logging with cloud sync

A zero-framework hours logger. Click any day to add or edit logged hours; weekly and monthly totals compute automatically. Data syncs to Supabase and the whole app sits behind a password gate stored in the database.

Solo developer: designed, built, and shipped by me.

  • Hand-rolled calendar rendering, totals engine, and theme system in vanilla JavaScript
  • Supabase REST sync with Row Level Security governing access
  • Dark / light themes and a fully responsive layout — no dependencies at all
HTML5CSS3JavaScriptSupabase
Live in production▲ Netlify
Portfolio demo preview

Portfolio-only demo preview: frontend on Netlify, backend/database on Supabase. Visitor-created demo data resets every day at 12:00 AM Asia/Manila.

▲ Netlify▲ Supabase
Open demo preview
USD setup & hours1/2

04

Payroll Splitter

USD → PHP payroll math without the spreadsheet

A focused calculator that splits a USD payroll across multiple people by hours rendered, then converts each share to PHP with a manually entered exchange rate. Built for a real recurring payday problem.

Solo developer: designed, built, and shipped by me.

  • Auto-fills a missing person’s hours and warns when totals don’t add up
  • Full formula trace so every peso in the result can be audited
  • Instant, entirely client-side computation — works offline once loaded
HTML5CSS3JavaScript
Live in production▲ Netlify
Portfolio demo preview

Portfolio-only demo preview: frontend on Netlify, backend/database on Supabase. Visitor-created demo data resets every day at 12:00 AM Asia/Manila.

▲ Netlify▲ Supabase
Open demo preview
Full-bleed hero1/4

05

P Travel Tours Landing Page

Responsive travel-agency landing page for Philippine tours

A polished marketing landing page for a fictional Philippine travel agency. Visitors land on a full-bleed hero, learn about the company, browse the services on offer, and scroll a grid of featured tour packages across the islands — from Boracay and Palawan to Batanes and Vigan.

Solo developer: designed, built, and shipped by me.

  • Component-driven React build with distinct hero, about, services, and featured-tours sections
  • Data-driven tour cards (destination, date, duration, price) rendered from a single data source
  • Smooth in-page navigation, Font Awesome iconography, and a fully responsive layout
React 19Create React AppJavaScriptCSS3Font Awesome
Live in production▲ Netlify
Portfolio demo preview

Portfolio-only demo preview: frontend on Netlify, backend/database on Supabase. Visitor-created demo data resets every day at 12:00 AM Asia/Manila.

▲ Netlify▲ Supabase
Open demo preview