Skip to main content
Trevor Brown
See the Work

Web Projects

Production apps, personal tools and experimental builds — with screenshots, live links and the thinking behind each one

← Back to Portfolio

The same instincts that drove my investigative reporting — digging through complexity, finding structure in chaos, telling a clear story — now shape how I architect applications. After completing OU Outreach's Fullstack Academy, I now build with Next.js, React, TypeScript and PostgreSQL.

These projects range from production client work — a dental practice site that increased bookings by more than 33% — to open-source intelligence tools, AI model comparisons and a personal data platform processing 200,000-plus records.

Second Brain — Data
Click to expand

Second Brain

Personal Knowledge Base with AI Chat and Search

Processes 200,000+ personal records from a dozen data sources — texts, emails, articles, ChatGPT exports, photos and DNA data — through TypeScript data pipelines with deduplication and normalization.

Features an AI chat assistant, semantic search and visualization dashboards. Built with React and Next.js on a Tauri desktop wrapper with Playwright-based data ingestion.

  • Processes 200,000+ records from a dozen data sources
  • TypeScript data pipelines with deduplication and normalization
  • AI chat assistant powered by Anthropic API
  • Semantic search across the full archive
  • Visualization dashboards for data exploration
  • Tauri desktop wrapper for native app experience
  • Playwright-based web scraping and automated data ingestion
TypeScriptReactNext.jsPlaywrightAnthropic API
Keith Brown DDS desktop screenshot

Keith Brown DDS

Production Dental Practice Site + Admin Dashboard

Production dental practice site in Naperville that increased online bookings by 33%. I manage SEO and optimize a $2,000/month Google Ads campaign directly.

Protected admin dashboard integrates GA4, CallRail and Google Business Profile analytics with real-time ad controls, a Python billing data pipeline, an AI chat interface and a blog CMS.

  • Increased new patient bookings by 33% after launch
  • Manage $2,000/month Google Ads campaign with real-time bid controls
  • Built Python billing data pipeline for automated financial reporting
  • Integrated CallRail, GA4 and Google Business Profile analytics into admin dashboard
  • AI chat interface powered by Claude for patient inquiries
Next.jsReactTailwind CSSGoogle AdsPythonClerk AuthREST APINodemailer
News Pulse desktop screenshot

News Pulse

Open-Source News Intelligence Dashboard

An open-source news intelligence dashboard that aggregates verified sources across RSS, Bluesky, Telegram, Reddit and YouTube.

Built on open-web principles, it features map-based monitoring, surge detection and tiered AI summarization via Claude.

  • Aggregates five source types — RSS, Bluesky, Telegram, Reddit and YouTube
  • Map-based monitoring with geographic surge detection
  • Tiered AI summarization via Anthropic Claude API
  • Built on open-source intelligence (OSINT) principles
Next.jsTypeScriptAnthropic APIRSSBluesky APITailwind CSS
AI Model Arena desktop screenshot

AI Model Arena

Side-by-Side AI Model Comparison Tool

A side-by-side AI comparison tool that sends one prompt to Claude, GPT, Gemini and Grok simultaneously.

Includes AI-powered peer ranking, real-time cost tracking and a Fast vs. Frontier mode toggle.

  • Queries four LLM APIs simultaneously — Claude, GPT, Gemini and Grok
  • AI-powered peer ranking system where models evaluate each other
  • Real-time cost tracking per query across all providers
  • Fast vs. Frontier mode toggle for speed and quality tradeoffs
Next.js 16TypeScriptAnthropic APIOpenAI APIGoogle Gemini APIGrok API
sort(id) desktop screenshot

sort(id)

Media Ranking and Sharing Platform

A media ranking platform where users create and share ranked lists of movies, TV, books, podcasts and anime.

Built with drag-and-drop interfaces, TMDB and Open Library API integrations and PostgreSQL persistence.

  • TMDB and Open Library API integration for movies, TV, books and anime
  • Drag-and-drop ranking interfaces for custom list creation
  • NextAuth.js authentication with PostgreSQL persistence via Neon
  • Shareable ranked lists with public profile pages
Next.js 16Tailwind CSS 4PostgreSQL (Neon)TMDB APINextAuth.js
Caught Up Yet desktop screenshot

Caught Up Yet

Spoiler-Free Sports Chat for Delayed Viewers

Sports app for fans watching games on delay. Create rooms, invite friends and family and chat about games without scores being revealed.

Filters alerts by team and sport with Supabase authentication and real-time PostgreSQL persistence. Built because my dad watches Cubs games on delay and we wanted to react together without spoilers.

  • Spoiler-free chat rooms for delayed game viewing
  • Team and sport filtering for personalized alerts
  • Supabase authentication with real-time PostgreSQL
  • Built for a real use case — watching Cubs games on delay with family
Next.jsTypeScriptReactTailwind CSSSupabasePostgreSQL
Food Xpiry desktop screenshot

Food Xpiry

AI-Powered Grocery Expiration Tracker

Grocery management app that reduces food waste using USDA FoodKeeper data and Anthropic API shelf-life estimates.

Users log items, get AI-powered storage tips and track expiration dates with PostgreSQL persistence via Neon.

  • USDA FoodKeeper data for government-sourced shelf-life baselines
  • Anthropic API generates custom storage tips and expiration estimates
  • PostgreSQL persistence via Neon with Prisma ORM
  • Item logging with category-based expiration tracking
Next.jsTypeScriptPostgreSQL (Neon)PrismaAnthropic AI API
StuddyBuddy desktop screenshot

StuddyBuddy

AI Study Platform for Web Developers

An AI-powered study platform for web developers.

Pick a tech stack and skill level to get interactive quiz sessions powered by GPT-4o Mini alongside curated documentation links.

  • GPT-4o Mini powers interactive quiz generation
  • Tech stack selection — JavaScript, TypeScript, React, Next.js and more
  • Skill level personalization from beginner to advanced
  • Curated documentation links alongside each quiz session
Next.js 16React 19TypeScriptOpenAI APITailwind CSS 4
Investigative Journalism

Data Visualization & Public Records

Interactive graphics and data analysis built with Tableau, Datawrapper and Flourish at Oklahoma Watch — an independent nonprofit newsroom covering elections, policy and accountability in Oklahoma.

Lost in the Pandemic: Oklahoma COVID-19 Digital Memorial

Lost in the Pandemic: Oklahoma COVID-19 Digital Memorial

2020 · Oklahoma Watch

Community Champion Award, Institute for Nonprofit News (2020)
Flourish

Interactive Flourish memorial visualizing individual lives lost to COVID-19 in Oklahoma through crowdsourced stories and obituaries.

Read Article →
As Some Oklahoma Churches Push Vaccines, Others Sow Misinformation, Doubt

As Some Oklahoma Churches Push Vaccines, Others Sow Misinformation, Doubt

Dec. 20, 2021 · Oklahoma Watch

1st Place Investigative Reporting, Oklahoma SPJ (2022)
Datawrapper

Award-winning investigation analyzing county-level relationship between vaccination rates and church density. Three Datawrapper visualizations — scatter plot with regression line plus two choropleth maps.

Read Article →
Amid COVID-19, Some Hospitals Continue Suing Patients Over Unpaid Bills

Amid COVID-19, Some Hospitals Continue Suing Patients Over Unpaid Bills

Aug. 4, 2020 · Oklahoma Watch

1st Place General News Reporting, Oklahoma SPJ (2020)
TableauInfogram

Follow-up to award-winning investigation that structured 22,250 court records into a searchable database. Tracked which hospitals continued suing patients during the pandemic.

Read Article →

Explore the full portfolio