Full-Stack Development
UI, backend, database, deploys, and automation. Fewer handoffs, fewer mysteries.
Hi, I'm
PauFull-stack Web Developer in the Philippines
Web Developer
I design, build, and ship full-stack web applications with a Next.js and TypeScript-first workflow, plus React interfaces, database-backed features, cloud deployments, UI/UX, SEO, and security baked in. Off the clock, I'm into music and gaming.
01 · About
More than just code.
I'm Pau, and P-Devs is the label I use for this personal collection of projects, experiments, and technical notes.
Design & Media
UI/UX plus video, photo, and audio work. I care how things feel, not just how they run.
SEO & Security
Search structure from day one, with a pen-tester habit of asking what could break.
Beyond the Code
I write and produce music too. Same loop: find the pattern, tune the timing, make it land.
02 · Focus
Areas I explore through code.
A snapshot of the technical areas represented across my projects, experiments, and ongoing learning.
Full-Stack Architecture
How interfaces, APIs, data, and deployments fit together in complete applications.
Interface Design
Responsive, accessible interfaces with clear structure and thoughtful interaction.
Search & Semantics
Metadata, structured content, performance, and crawl-friendly page architecture.
Reliability
Updates, diagnostics, backups, observability, and maintainable code paths.
Application Security
Threat-aware design, boundary validation, secure defaults, and focused testing.
Cross-Platform Packaging
Exploring how web applications can run across browsers, Windows, and Android.
Performance Engineering
Rendering, queries, caching, and Core Web Vitals across different devices.
Commerce Platforms
Storefront architecture, catalog interfaces, content modeling, and platform tooling.
APIs & Integrations
REST APIs, email delivery, analytics, automation, and third-party platforms.
03 · Portfolio
Things I've shipped.
Production apps, cloud platforms, zero templates — designed, coded, and deployed end to end. Browse the galleries (screenshots use public or demo data).
01
P-Devs Portfolio
A type-safe, style-switchable portfolio built with Next.js
The portfolio you are browsing: a responsive, TypeScript-first Next.js application for presenting my work, technical focus areas, skills, and contact flow. One accessible content structure powers six distinct visual styles without sacrificing performance or usability.
Solo developer: designed, built, and shipped by me.- Strict TypeScript across the App Router, React components, shared data, hooks, and server routes
- Six persistent visual styles: Default, Graffiti, Old School, Pixels, Luxe, and Hacker
- Smooth single-page navigation, optimized WebP galleries, and an accessible fullscreen lightbox
- SEO metadata, structured data, hardened response headers, rate limiting, Zod validation, and Cloudflare Turnstile
Next.js 16React 19TypeScriptCSS3ZodReact Hook FormVercelBrevoCloudflare Turnstile
02
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
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
03
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
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
04
Feuille Flip
Local-first page editor and HD flipbook publisher
Feuille Flip is a local-first page designer and PDF publisher. Users can create pages from scratch or import a PDF, preserve the chosen ratio, autosave projects on-device, and publish an HD flipbook with social sharing. Public links and files expire after three calendar months.
Solo developer: designed, built, and shipped by me.- Design up to 100 pages with flexible sizes, quick layouts, text, photos, drawing, cropping, gradients, borders, shadows, and drag-to-reorder thumbnails
- IndexedDB autosave plus portable .feuilleflip project export and import, with no account required
- PDF import preserves the source page ratio; editor pages publish as sharp HD WebP assets with at least 2,560 pixels on the longest edge
- Turnstile-protected publishing, social sharing, and automatic link and file deletion after three calendar months
Next.js 16React 19TypeScriptFabric.jsIndexedDBPDF.jsSupabaseCloudflare TurnstileZodNetlify
05
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
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
06
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
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
07
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, and trip details) rendered from a single data source
- Smooth in-page navigation, Font Awesome iconography, and a fully responsive layout
React 19Create React AppJavaScriptCSS3Font Awesome
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
04 · Skills
My toolbox.
The technologies, platforms, and disciplines I use across the full development lifecycle.
Frontend Development
HTML5CSS3JavaScriptTypeScriptReactMotionNext.jsViteTailwind CSSResponsive DesignUI AnimationAxiosTanStack QueryShadcn
Backend & Data
Node.jsPythonLuaCloudflare WorkersCloudflare D1Cloudflare R2Cloudflare DONetlify FunctionsSupabasePostgreSQLSQLiteREST APIsJWTPrisma ORMZod
Platforms & Development Tools
NetlifyVercelCloudflareAlibaba CloudGitHub PagesAWSVPS (Hostinger, OVH, etc)ShopifyGitHubGoogle Cloud ConsoleWrangler CLIn8nElectronKotlinCapacitor
Design & Creative
UI/UX DesignVideo EditingPhoto EditingAudio Editing
SEO & Optimization
Technical SEOOn-Page SEOPerformance OptimizationResponsive Optimization
Security
Web SecurityCybersecurityPenetration TestingSecure API Development
05 · Contact
Say hello or share
what's on your mind.
Questions, feedback, shared interests, and friendly messages are welcome.