live-quiz

Live audience quizzes for Reveal.js presentations. Powered by AnyCable.
npx create-live-quiz

You're building a presentation

What if your audience could interact with it live?

Here's what happens

  • You're presenting. You land on a slide…
  • Boom, there's a live quiz.
  • A QR code appears. Your audience scans it.
  • They vote from their phones. You see who's online.
  • You show the results. You scroll — they see the next question.

Prerequisites

What you need

Netlify
or Vercel — to deploy your presentation
(serverless functions relay the votes)
AnyCable Plus
managed WebSocket server (free!)
up to 2,000 concurrent connections

Installation

Let's get started

Commit your presentation to a GitHub repo, then run:

npx create-live-quiz

It adds live quizzes to your existing Reveal.js project — serverless functions, participant page, and sample slides.

CLI Walkthrough

The CLI walks you through it

$ npx create-live-quiz ◆ create-live-quiz | ◇ Reveal.js project detected! | | +-- Detected project ------------------+ | | HTML file: index.html | | | JS entry: main.js | | | Platform: Netlify | | +--------------------------------------+ | ◇ Do you already have an AnyCable Plus app? | No | ◆ Let's create your AnyCable Plus app | Opened plus.anycable.io -- sign in with GitHub

CLI Walkthrough

AnyCable setup

| +-- Create a new cable ----------------+ | | 1. Click New Cable | | | 2. Name it anything | | | 3. Pick JavaScript as backend | | | 4. Click Next | | +--------------------------------------+ | | +-- Enable public streams -------------+ | | -> Clear the Application Secret | | | -> Click Next, wait for deploy | | +--------------------------------------+ | ◇ Cable deployed? | ✔ Continue

CLI Walkthrough

Paste your URLs, review, go

◇ WebSocket URL | wss://my-cable.anycable.io/cable | ◇ Broadcast URL | https://my-cable.anycable.io/_broadcast | | +-- Review your settings --------------+ | | HTML file: index.html | | | Platform: Netlify | | | WS URL: wss://...anycable.io | | | Broadcast: https://...anycable.io | | +--------------------------------------+ | ◇ Look good? | Yes, install live-quiz

Done!

◇ live-quiz installed! ◇ Created quiz.html ◇ Created quiz.js ◇ Created netlify/functions/ ◇ Added sample quiz slides to index.html | | +-- Next steps ----------------------+ | | 1. Add the imports to main.js | | | 2. npm run dev and try your quiz! | | +------------------------------------+ | +-- Happy quizzing!

quiz.html + quiz.js = participant page (where your audience votes)

Let's try it live!

Scan the QR code on the next slide
or open the quiz URL on your phone.

Get started

npx create-live-quiz
GitHub  ·  AnyCable Plus

MIT License · Built by the AnyCable team

Appendix

What is AnyCable?

  • Open-source WebSocket server for reliable real-time apps
  • Used by Doximity, Circle.so, Healthie, and many others
OSS
Free, self-hosted
Pro
Clustering & enterprise
Plus
Managed on Fly.io (free!)
up to 2k connections
anycable.io  ·  Star us on GitHub