---
title: "WorkBud"
kind: student-project
location: "Holy Angel University"
tags: [students, student-work, apsi]
summary: "OJT hours and expense tracker: every hour and every peso of your internship in one place."
---

*A final project from Full-stack JavaScript, 2026 first semester. Part of [Fifteen full-stack apps from a semester I almost did not survive](/calendar/2026-s1-apsi-students).*

<figure data-lightbox-group style="max-width: 22rem; margin: 0 0 var(--space-6, 2rem)"><a class="gallery__link" data-lightbox href="/media/projects/2026-1st-sem/workbud/square.webp"><img src="/media/projects/2026-1st-sem/workbud/square.webp" width="1080" height="1080" alt="WorkBud, the project's square image" loading="eager" decoding="async" style="aspect-ratio:auto;height:auto;object-fit:contain"></a></figure>

## What it is

WorkBud logs each day of on-the-job training, keeps the running total of hours the school actually asks for, and adds up what the placement is costing you in fares and food along the way.

Built with React, Express and Supabase.

## Why it is here

Every one of their classmates is about to need this, which is the best kind of problem. The README is candid about how Claude, ChatGPT and Gemini were used and where they got it wrong. That is the sentence I wish more professionals would write.

## Find it

- Project: [github.com/JustinNeri/WorkBud](https://github.com/JustinNeri/WorkBud)
- Live: [workbud-ph.vercel.app](https://workbud-ph.vercel.app)
- GitHub: [@JustinNeri](https://github.com/JustinNeri)

## Screenshots

<div class="gallery" data-lightbox-group style="--gallery-min: 14rem; align-items: start">
<figure class="gallery__item" style="grid-column: 1 / -1"><a class="gallery__link" data-lightbox href="/media/projects/2026-1st-sem/workbud/shot-1.webp"><img src="/media/projects/2026-1st-sem/workbud/shot-1.webp" width="684" height="422" alt="WorkBud, screenshot 1 of 2" loading="lazy" decoding="async" style="aspect-ratio:auto;height:auto;object-fit:contain"></a></figure>
<figure class="gallery__item"><a class="gallery__link" data-lightbox href="/media/projects/2026-1st-sem/workbud/shot-2.webp"><img src="/media/projects/2026-1st-sem/workbud/shot-2.webp" width="687" height="410" alt="WorkBud, screenshot 2 of 2" loading="lazy" decoding="async" style="aspect-ratio:auto;height:auto;object-fit:contain"></a></figure>
<figure class="gallery__item"><a class="gallery__link" data-lightbox href="/media/projects/2026-1st-sem/workbud/shot-3.webp"><img src="/media/projects/2026-1st-sem/workbud/shot-3.webp" width="1280" height="800" alt="WorkBud, sign-in" loading="lazy" decoding="async" style="aspect-ratio:auto;height:auto;object-fit:contain"></a></figure>
</div>
