About the Project

buzzrr was inspired by the energy of live quiz nights, classrooms, workshops, and game shows — moments where people want to answer quickly, compete fairly, and stay engaged without needing complicated setup or player accounts.

The idea was to build a mobile-first real-time quiz and buzzer app where a host can create a game, invite players with a short code or QR code, and run spontaneous answer rounds. Instead of forcing every question into the app, buzzrr supports a flexible real-world flow: the host can ask a question out loud, on a slide, or in person, then open a round for players to answer by text or buzz in.

What I Built

I built a web app that lets a registered host create and manage quiz games while players can join instantly without accounts. The app supports two main modes:

  • Text answer mode, where players submit written answers and the host reviews them.
  • Buzzer mode, where players compete to buzz first and answer verbally.

The project also includes real-time updates, server-side ordering of answers and buzzes, scoring, round control, QR-code joining, and host-side sound feedback.

How I Built It

buzzrr is built as a full-stack web application using:

  • Next.js App Router and React for the application interface
  • TypeScript for type safety
  • Tailwind CSS for styling
  • PostgreSQL as the source of truth
  • Prisma for database access and migrations
  • Auth.js for host authentication
  • Pusher Channels for real-time updates
  • Playwright and Vitest for end-to-end, integration, and unit testing

A key design decision was that real-time events are only used as a transport layer. The database remains the authority. For example, when two players buzz at nearly the same time, the winner is not decided by the phone clock or by which browser receives an event first. Instead, the server writes the buzz attempt to PostgreSQL, and the accepted database order determines the result.

Challenges I Faced

One of the biggest challenges was making the game feel instant while still keeping it fair. In a live buzzer game, milliseconds matter, but browser timing, network latency, and device clocks cannot be trusted. I solved this by making PostgreSQL the source of truth and by handling answer and buzz ordering on the server.

Another challenge was balancing flexibility with simplicity. Many quiz apps require prepared question catalogs, but buzzrr is designed for spontaneous games. That meant intentionally not storing question text in the MVP and focusing instead on rounds, answers, buzzes, scoring, and host control.

Building the buzzer rules was also challenging. Different games need different behavior, such as ending after the first attempt, locking out wrong players, allowing retries, or using limited “golden beans.” Each rule had to be implemented so that scoring, lockout, retry behavior, and resource consumption remained consistent and atomic.

The user experience was another important challenge. Since players join from phones, the interface needed to be fast, readable, mobile-first, and accessible. The host view also needed to clearly show the current round state, who is answering, what needs to be reviewed, and the live scoreboard.

What I Learned

I learned a lot about designing real-time applications where speed and correctness both matter. The project reinforced that real-time messages should not replace reliable data modeling. They can make the interface feel alive, but the database still needs to define the actual game state.

I also learned how important it is to build around the real social context of a product. In buzzrr, the host may ask questions verbally, from slides, or in a classroom. Supporting that workflow made the app simpler and more flexible than a traditional question-management system.

Finally, I learned that fairness is not just a technical feature — it is part of the user experience. If players believe the buzzer result is reliable, the game becomes more fun, competitive, and trustworthy.

Built With

  • friends
  • fun
  • game
  • pubquiz
  • quiz
  • websocket
Share this project:

Updates