Crash - Trivia Game

A real-time multiplayer trivia game where the lowest score wins! Answer questions correctly, but try to pick the answers that the fewest other players will choose.

Game Rules

• 10 trivia questions per game
• Each question has multiple correct answers
• All players see the same question simultaneously
• 15-second time limit per question

Unique Scoring System

• Correct answer: You get points equal to the number of players who chose the same answer
• Wrong answer: You get the highest correct answer count + 5 penalty points
• Lower score wins!

Example

Playing with 10 players, question: "Name one of the Beatles"

• 5 people guessed John → each gets 5 points
• 3 people guessed Ringo → each gets 3 points
• 1 person guessed Paul → gets 1 point (best score!)
• 1 person guessed Marty (wrong) → gets 10 points (5 + 5 penalty)

Tech Stack

• Frontend: Next.js 14 (App Router), React, TypeScript, Tailwind CSS
• Backend: Next.js API Routes, Socket.io for real-time features
• Database: PostgreSQL with Prisma ORM
• Authentication: NextAuth.js with Google OAuth
• AI: ATXP LLM Gateway for question generation

Setup Instructions

Prerequisites

• Node.js 18+ and npm
• PostgreSQL database
• Google OAuth credentials
• ATXP connection string (optional, for AI question generation)

1. Install Dependencies

npm install --legacy-peer-deps

2. Configure Environment Variables

Copy the example env file and fill in your values:

cp .env.example .env

Edit .env with your configuration:

# Database
DATABASE_URL="postgresql://user:password@localhost:5432/crash_trivia"

# NextAuth
NEXTAUTH_URL="http://localhost:3000"
NEXTAUTH_SECRET="your-secret-key-here"  # Generate with: openssl rand -base64 32

# OAuth Provider (Google)
GOOGLE_CLIENT_ID="your-google-client-id"
GOOGLE_CLIENT_SECRET="your-google-client-secret"

# ATXP LLM Gateway (optional, for AI question generation)
ATXP_CONNECTION_STRING="your-atxp-connection-string"

3. Set Up Database

# Generate Prisma client
npm run db:generate

# Push schema to database
npm run db:push

4. Create Admin User

After signing in for the first time, you'll need to manually set your user role to "admin" in the database:

UPDATE "User" SET role = 'admin' WHERE email = 'your-email@example.com';

5. Add Questions

Visit /admin after signing in as an admin to:

• Manually create questions
• Generate questions using AI
• Manage existing questions

6. Run Development Server

npm run dev

Visit http://localhost:3000

Usage

For Players

1. Sign in with Google
2. Create a game or join with a code
3. Wait for host to start the game
4. Answer questions within 15 seconds
5. View results after all questions are answered
6. Lowest score wins!

For Admins

1. Visit /admin
2. Create questions manually or use AI generation
3. Each question needs:
   • Question text
   • Multiple correct answers (comma-separated)
   • Optional: category and difficulty

Deployment

Deploy to Vercel

1. Push code to GitHub
2. Import project in Vercel
3. Add environment variables
4. Deploy!

Note: For production, you'll need to handle Socket.io differently as Vercel doesn't support WebSockets. Consider:

• Using a separate Socket.io server on Railway/Render
• Switching to Pusher or Ably for real-time features
• Deploying the entire app on Railway/Render instead

Deploy to Railway

# Install Railway CLI
npm install -g @railway/cli

# Login
railway login

# Initialize project
railway init

# Add PostgreSQL
railway add postgresql

# Deploy
railway up

Database Schema

• User: Authentication and user profiles
• Account: OAuth provider accounts
• Session: User sessions
• Question: Trivia questions with multiple correct answers
• Game: Game instances with status and code
• GamePlayer: Players in a specific game
• GameQuestion: Questions assigned to a game
• PlayerAnswer: Answers submitted by players

API Routes

Public Routes

• POST /api/games/create - Create a new game
• POST /api/games/join - Join an existing game
• GET /api/games/[id] - Get game details
• POST /api/games/[id]/submit-answer - Submit an answer
• POST /api/games/[id]/start - Start a game (creator only)
• POST /api/games/[id]/calculate-scores - Calculate question scores

Admin Routes

• GET /api/admin/questions - List all questions
• POST /api/admin/questions - Create a question
• GET /api/admin/questions/[id] - Get question details
• PUT /api/admin/questions/[id] - Update a question
• DELETE /api/admin/questions/[id] - Delete a question
• POST /api/admin/generate-question - Generate questions with AI

Socket.io Events

Client → Server

• join-game - Join a game room
• leave-game - Leave a game room
• start-game - Start the game
• show-question - Show question to all players
• start-timer - Start question timer
• times-up - Time expired for question
• answer-submitted - Player submitted answer
• start-reveal - Start reveal phase
• reveal-answers - Show all answers and scores
• game-complete - Game finished

Server → Client

• player-joined - New player joined
• game-started - Game has started
• question-revealed - New question shown
• timer-started - Timer started
• time-expired - Time is up
• player-answered - Another player answered
• reveal-phase-started - Reveal phase beginning
• answers-revealed - Answers and scores shown
• game-ended - Game completed with final scores

Development Scripts

npm run dev          # Start development server
npm run build        # Build for production
npm run start        # Start production server
npm run lint         # Run ESLint
npm run db:push      # Push Prisma schema to database
npm run db:studio    # Open Prisma Studio
npm run db:generate  # Generate Prisma client

Future Enhancements

• Game history and statistics
• Leaderboards
• Custom game settings (question count, time limit)
• Question categories and difficulty filtering
• Team mode
• Tournament brackets
• Sound effects and animations
• Mobile app (React Native)

License

MIT

Contributing

Contributions are welcome! Please open an issue or submit a pull request.