John Aleman

Selected work

Projects

Each case study covers the problem, the product decisions and the engineering trade-offs, with what shipped and what is still open.

Products

Designed and built end to end, from the first screen to the database.

FlightNotes landing page with the headline 'Guest feedback for every pour' beside a sample tasting flight card

Guest feedback for every pour. Breweries, wineries and bars put a QR code on the table, and guests rate what they are drinking.

Tasting-room feedback usually leaves with the guest. FlightNotes captures it in the moment, with no app or account, and turns it into analytics and weekly winners for the business.

Engineering highlight

Guest tastings are anonymous and bound to a cookie. The server stores only a hash of the token, so nobody signs up to rate a pour.

  • Next.js
  • GraphQL Yoga
  • TanStack Query
  • Drizzle ORM
  • Neon Postgres

Bookshelf Builder

In development

A personal library app that reads the spines in a photo of your bookshelf and turns them into a catalog you can organize.

Cataloguing a physical library means typing every title by hand. Bookshelf Builder starts from a photo and keeps a person in charge of every uncertain match.

Engineering highlight

AI reads are never trusted blindly. A low-confidence detection goes to review even when Google Books returns a strong match.

  • Next.js
  • OpenAI vision
  • Google Books API
  • GraphQL Yoga
  • Drizzle ORM

Engineering explorations

Working apps, each built around one engineering problem: real-time fairness, streaming over a rate-limited API, runtime composition and safe public input.

Spot The Difference round reveal: a field of sad-faced flowers with the one smiling flower found, a Fast Hands bonus and the live scoreboard

A real-time multiplayer game. Find the one smiling flower before the timer runs out, and before everyone else.

A party game only works if it feels fair. Every player needs the same clock, and the fastest correct answer has to actually win.

Engineering highlight

One Cloudflare Durable Object per room owns the clock and the scoring, so no client can post a score it did not earn.

  • Cloudflare Durable Objects
  • WebSockets
  • Zustand
Weather Analytics dashboard showing current conditions for Dublin, California beside a 10-day forecast, above key metrics for temperature, precipitation, wind and clear days

A weather dashboard with current conditions, forecasts, trends and year-over-year comparisons for any US ZIP code.

Most weather apps answer “what is it like now?”. This one answers “is this normal?”, while staying inside a free API’s rate limits.

Engineering highlight

Each widget streams in behind its own Suspense boundary, and a failed dataset degrades only the widgets that use it.

  • Open-Meteo
  • Next.js
  • TanStack Query
  • Recharts
Products table served by the Products micro frontend inside the Next.js shell

A Next.js 16 shell that composes two independently deployed Vite apps, Products and Orders, at runtime with Module Federation.

Large frontends slow teams down when every change goes through one build and one release. This demo shows how one team could ship its part alone.

Engineering highlight

Next.js owns browser history and each remote runs React Router in controlled mode, so there is one history stack and no sync code.

  • Next.js 16
  • Module Federation
  • Vite
  • Nx
Birthday card for Olivia covered in colourful hearts, one open to show a birthday message in a thought bubble

A digital birthday card that friends and family sign together. Each heart holds a message.

A shared card has to be open to anyone with the link, without letting anyone sign as someone else.

Engineering highlight

A signature stays off the card until a one-time emailed link confirms it, so every heart comes from a proven address.

  • Next.js
  • GraphQL + Drizzle/Postgres
  • TanStack Query

Earlier work: interactive installations

Client projects for venues and brand experience centers, built as a contract developer.

Video wall graphic showing Pablo Sandoval trending #1 with his batting stats, alongside a social media trivia question

SF Giants @Café

Client work

A real-time social media and MLB data display for the San Francisco Giants’ @Café, the first social media headquarters of its kind in Major League Baseball.

The Giants wanted posts from fans, players and reporters on a video wall and the stadium scoreboard during games.

Engineering highlight

Backend integrations gathered posts across custom hashtags and pushed them to both a 3×2 video wall and the scoreboard.

  • Digital display
  • Twitter API
  • Instagram API
Avaya fan wall: a 20th anniversary badge over a grid of Instagram fan photos and player selfies

A fan engagement wall at the Pepsi Center in Denver that showed live social media content for the Avalanche and Nuggets.

The venue wanted fans’ own posts on its screens during games, connecting the crowd with the team in real time.

Engineering highlight

Real-time Twitter and Instagram content was aggregated into branded digital signage layouts.

  • Digital signage
  • Twitter feed
  • Instagram feed
Cisco Internet of Everything touch display with economic data panels beside an illuminated globe

An interactive touch installation at Cisco’s Customer Experience Center that brought the four pillars of the Internet of Everything to life.

Cisco wanted visitors to explore an abstract idea (People, Process, Data and Things) through something they could touch.

Engineering highlight

Interactive software let visitors explore data and visualizations across large-format video and touch displays.

  • Digital display
  • Touch interaction