Skip to content

Architecture

Jump to bottom
mcinquin edited this page Oct 12, 2026 · 1 revision

Architecture

MarkIt is a Next.js app for real-time meeting bingo: teams share a board live via Socket.io.

Stack

Layer Technology
Framework Next.js (App Router) + TypeScript + React
Styles Tailwind CSS
Animations Framer Motion + react-confetti
Auth NextAuth.js v4 (email/password)
Database PostgreSQL 16 via Prisma ORM
Real time Socket.io on a custom Node.js server (server.js)
Deployment Docker Compose
Reverse proxy Apache 2.4 (TLS, WebSocket, security headers)

Features

  • Teams — create / join with invite code; roles OWNER, ADMIN, MEMBER
  • Boards — configurable size (2×2–10×10), optional FREE center (odd boards), phrase bank + custom phrases
  • Live play — shared board, instant cell checks, automatic bingo (rows, columns, diagonals on square boards), confetti celebration, online members
  • History — past boards with date and completion rate
  • Admin — users and invite codes

Runtime topology

Internet
    │
    │ HTTPS :443
    ▼
┌─────────────┐
│  Apache 2.4 │  ← SSL termination, security headers, HSTS, Socket.io WS
│ (host)      │
└──────┬──────┘
       │ HTTP / WS 127.0.0.1:3000
       ▼
┌─────────────────────────────┐
│  Docker network: internal   │
│  markit_app (Next.js + IO)  │
│  markit_db (PostgreSQL 16)  │
└─────────────────────────────┘
  • The app is reachable only via 127.0.0.1:<PORT> from the host.
  • The database exposes no public ports.
  • Apache handles SSL, HTTP→HTTPS redirects, and WebSocket proxying for /api/socketio.

Project layout (high level)

markit/
├── .github/workflows/ci.yml
├── apache/markit.conf
├── docs/screenshots/
├── prisma/                 # schema, migrations, seed
├── scripts/                # ci, entrypoint, checks
├── src/app/                # App Router pages + API
├── src/components/
├── src/lib/                # auth, bingo, prisma, schemas, socket
├── docker-compose.yml
├── Dockerfile
└── server.js               # Next.js + Socket.io

Related

Clone this wiki locally