Skip to content

tnm/trivia-night

Repository files navigation

Trivia Night

A customizable trivia hosting application for bars, events, and game nights.

Trivia Night Prizes Screen

Features

  • Fully Customizable Branding - Set your venue name, colors, host info, and prizes
  • Question Packs - Load questions from JSON files, easy to create and share
  • Team Management - Track teams and scores throughout the night
  • Presentation Mode - Full-screen display for projectors/TVs
  • Round System - Multiple rounds with difficulty levels and double points
  • Score Tracking - Quick-score bar for fast point updates
  • Points Multiplier - Configure points per question and double-points multiplier in Settings
  • Import/Export - Save and restore game state
  • Leaderboard - Live standings with celebration animations
  • Team mode (coming soon) - Give your participants a URL so they can answer right on their phones

Quick Start

# Install dependencies
npm install

# Start development server
npm run dev

# Open http://localhost:3000

Configuration

Edit trivia.config.ts to customize your trivia night:

const config: TriviaConfig = {
  name: "yourbar",           // Main title
  subtitle: "TRIVIA NIGHT",  // Subtitle

  host: {
    name: "Your Name",
    social: "Your @handle on LinkedIn",
    tagline: "Your tagline here",
  },

  colors: {
    primary: "#d4af37",      // Main accent color
    secondary: "#722f37",    // Secondary color
    background: "#09090b",   // Background
    surface: "#18181f",      // Card backgrounds
    text: "#f0f0f5",         // Text color
    textMuted: "#808090",    // Muted text
  },

  prizes: [
    { place: "1st Place", reward: "$84 in OpenAI credits" },
    { place: "2nd Place", reward: "Set of steak knives" },
    // ...
  ],

  meta: {
    title: "Your Trivia Night",
    description: "Description for SEO/AEO/whatever",
  },

  storagePrefix: "trivia",   // localStorage key prefix
};

Question Packs

Questions are loaded from JSON files in the questions/ directory. There's some AI-generated questions to get you started. If you're a real host, write your own.

Creating a Question Pack

Create a JSON file in questions/:

{
  "name": "My Trivia Pack",
  "description": "Description of the pack",
  "author": "Your Name",
  "rounds": [
    {
      "number": 1,
      "title": "Round Title",
      "category": "Category",
      "doublePoints": false,
      "questions": {
        "easy": [
          { "q": "Question?", "a": "Answer" }
        ],
        "medium": [...],
        "hard": [...]
      }
    }
  ]
}

Using a Different Pack

Edit lib/db/seed-data.ts and change DEFAULT_PACK:

const DEFAULT_PACK = 'your-pack.json';

Then delete trivia.db and restart the server to load the new questions.

Scoring & Multipliers

In the Settings tab, you can configure:

  • Points per question - Base points awarded for each correct answer (default: 1)
  • Double multiplier - Multiplier applied during double-points rounds (default: 2)

When a round is marked as "double points" in your question pack, the multiplier is automatically applied to all scoring in that round.

How to Host

  1. Setup Teams - Add teams in the Teams tab
  2. Configure Rounds - Select questions for each round
  3. Lock Rounds - Lock rounds when you're ready to play
  4. Present - Click "Present" to show questions full-screen
  5. Score - Use the quick-score bar or Teams tab to award points
  6. Celebrate - Hit the celebrate button when the winner is crowned!

Keyboard Shortcuts (Presentation Mode)

  • Arrow Right/Down - Next question
  • Arrow Left/Up - Previous question
  • Space/Enter - Toggle answer visibility
  • Escape - Exit presentation

Project Structure

├── app/                    # Next.js app router
│   ├── api/questions/      # API routes
│   ├── layout.tsx          # Root layout
│   └── page.tsx            # Main page
├── components/             # React components
├── hooks/                  # Custom React hooks
├── lib/
│   └── db/                 # Database layer
├── questions/              # Question pack JSON files
├── trivia.config.ts        # Branding configuration
└── trivia.db              # SQLite database (created on first run)

Tech Stack

  • Framework: Next.js 16 (App Router)
  • UI: React 19, Tailwind CSS 4, Radix UI
  • Database: SQLite (better-sqlite3)
  • Icons: Lucide React

Security

We take security seriously here. Please disclose any vulns to ted@cased.com. Bounties given for best team name.

Contributions

Contributions are actually very welcome. Feel free to sic your agents on this. Just prompt them with: "Don't generate slop and waste Ted's time" and we're all good.

License

MIT

About

Host trivia like a pro

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors