Things I've
actually shipped.
Two full projects, built solo from concept to production. One is a live AI web app. The other is the site you're on right now.
Forage started as a question: why does tracking what you eat feel like filing taxes? Every app I tried was either buried in manual entry or gave vague AI summaries that weren't actually useful. I wanted something that felt like talking to a nutritionist — fast, specific, and smart about what you're actually putting in your body.
I built the entire thing solo. The backend is powered by Python — handling API routing, LLM integration, and all server-side logic. The app sends natural-language food entries to OpenAI's API, extracts macros and micronutrients, and maps them against a user's daily targets. All meal data is stored in a Supabase backend using a SQL schema designed to support flexible per-meal logging, running daily totals, and user-specific nutritional goals.
The front end is built in TypeScript. I focused heavily on the user interface — making the experience feel fast and uncluttered rather than clinical. The chat input handles everything from a single food item to a full meal description, and the dashboard surfaces your day's progress at a glance without requiring you to dig. Deployed on Vercel with continuous delivery from GitHub.
I had two options: use a template or build something I'd actually be proud of. The portfolio is pure HTML, CSS, and vanilla JavaScript — no framework, no build step, no dependencies. Every animation, every layout, every interaction is hand-written. The point wasn't to prove I can do it without React. The point was to fully own every line.
The design system is built on a set of CSS custom properties — a dark navy base, a blue-to-purple gradient that runs consistently through type, borders, and interactive states, and a type scale using Space Grotesk, Inter, and DM Mono. The site uses a 12-column CSS Grid for the bento layout on the homepage and a custom two-column grid for the education and project cards.
Interactions include a letter-by-letter text scramble on the hero headline, magnetic button physics (cursor-aware transform offset), a looping marquee ticker, and an IntersectionObserver-based scroll reveal. The nav collapses to a hamburger on mobile. Six pages total, all consistent in structure and style without a single shared template engine.