Tug-o-War Game

A tug-o-war game with Remix, WebSockets, and MSW. Help the stubborn dwarves settle one of the most important questions of humankind: Tabs or Spaces? And, well, learn about the WebSocket mocking with MSW while you're at it!

👉 Play the live game 👈

If you are reading this after EpicWeb Conf 2024, launch the game in Admin mode and click "Start game" in order to play.

Key points

• /server for the production WebSocket server and the game logic.
• /app/mocks/handlers.ts for the WebSocket event handlers with MSW.
• /app/components/tug-o-war.test.tsx for integration tests with Vitest and MSW. Note that the integration tests run in a special environment (/test/environments/vitest-environment-node-websocket that exposes the WebSocket constructor globally in Node.js).
• /app/entry.client.tsx for browser integration of MSW.

Local development

npm install
npm run dev

For build and preview:

npm run build
npm start

Learn more

• Documentation: Handling WebSocket events with MSW
• Documentation: ws API
• Submit your feedback on the new ws API