Playground   Works   About          


Job Tracker

Scope & Press

AI  Coding Design Engineer Gmail API / OAuth
Full-Stack Development AI Integration
React.js / Node.js

Summary

The Pain Point: I was tired of the manual drudgery of maintaining ugly spreadsheets. My applications were fragmented across LinkedIn, Indeed, and cold emails, making tracking a chore.

The Insight: No matter where I apply, the confirmation always lands in one place—my email.

The Solution: Instead of fighting the chaos, I built a tool directly on the Gmail API to automatically organize and track my job search progress from the inbox out.

Links
Live App: https://jobtrack-zeta.vercel.app/


Demo Walk Through Video: https://app.arcade.software/share/gjZR0Drn2YiFmTgSEAYB


Want in? DM me your email to sayhitoyutonghu@gmail.com, 
and I will grant you access to sign in and scan your own applications.


The app authenticates via Google OAuth 2.0, securely scans my inbox, and auto-parses job updates using AI. No more manual data entry. 
Seamless Workflow:  Direct deep-linking opens the specific email thread right in Gmail.

Your data stays yours. The app utilizes Google’s official OAuth 2.0 protocol for authentication, ensuring strict privacy standards without storing sensitive credentials.
Automated Label Sync Description: 
JobTrack integrates directly with your Gmail Label System, automatically categorizing incoming applications and syncing status updates back to your inbox.



How I Built It

Phase 1: Agentic Workflow 

I built this entire full-stack application without writing a single line of manual code. Instead, I utilized an agentic workflow within the IDE (using tools like Antigravity and Cursor).

My role shifted from syntax writing to Context Management. I treated the IDE as a command center, prompting AI agents to generate file structures, debug terminal errors, and refactor logic via natural language. 


Phase 2: The Intelligence Pivot 

Moved from brittle keyword matching to GPT-4o-mini. The app now "reads" email semantics to accurately distinguish between a generic newsletter and a specific rejection.
Railway Log
Phase 3: UX Refinement

The Shift to Kanban Board 
Early versions used a linear list (like an email inbox). I realized job hunting isn't about reading; it's about moving forward. I redesigned the UI into a drag-and-drop Kanban Board. This matches the user's mental model of a "pipeline" rather than a static feed.
First prototype


The Challenge

Initially, I tried running everything locally or on a single instance. This made managing Google OAuth 2.0 callbacks a nightmare—I kept hitting "Redirect URI mismatch" errors, and the authentication handshake was unstable.

The Solution: Divide and Conquer I re-architected the deployment by separating concerns:

Frontend (Vercel): Hosting the React UI here ensured lightning-fast static delivery and automatic CI/CD.

Backend (Railway): I deployed the Node.js/Express server on Railway to handle the heavy lifting (API requests & Database).

The Result: This separation solved the callback conflicts. By having a dedicated production URL for the backend, the OAuth handshake became rock-solid, mimicking a real-world enterprise architecture.
Frontend: Deployed on Vercel.

Backend: Deployed on Railway.