Skip to content
tickcli

Quick start

  1. Save this as dots.html in an empty folder:
<!doctype html><meta charset="utf-8"><title>Dots</title>
<script src="room.js"></script>
<script src="game.js"></script>
<script>
let x = 400, y = 300;                        // where my dot is
Game({
  title: "Dots", size: [800, 600],           // draw in 800 x 600 on any screen
  multiplayer: { max: 8, player: { x: [0, 800], y: [0, 600] } },   // what each player shares
  update(g, dt) {
    const a = g.axis();                      // arrow keys, WASD or the touch pad
    x = Math.min(800, Math.max(0, x + a.x * 250 * dt));
    y = Math.min(600, Math.max(0, y + a.y * 250 * dt));
    g.me.set({ x, y });                      // 1. tell everyone where I am
  },
  draw(g, ctx, w, h) {
    ctx.fillStyle = "#0f172a"; ctx.fillRect(0, 0, w, h);
    for (const p of g.players) {             // 2. draw everyone, me included
      ctx.fillStyle = p.me ? "#60a5fa" : "#e2e8f0";
      ctx.beginPath(); ctx.arc(p.state.x, p.state.y, 12, 0, 7); ctx.fill();
    }
  },
});
</script>
  1. Run npx tickcli in that folder (Node 22 or later).
  2. Open http://localhost:8080/, pick the game, and open it again in a second window or send the link to a friend: you get a lobby, a room code, an invite link and both dots moving live.

More: npx tickcli ./games --port 3000 --saves ./saves (saved profiles and worlds), --title "Game night", --help. Set TICKCLI_SECRET to any long random text so players keep their seats across restarts. The bigger example games (tag, chess, a race, a shooter, a dungeon, a tournament…): npx tickcli node_modules/tickcli/examples/games after npm install tickcli, or npm run demo in a clone of this repo.