Welcome to Crude Cards, a real-time, WebSocket-enabled card game designed for both learning and fun! If you've ever played Cards Against Humanity or Apples to Apples, you already know how to play. This project is built with modern web technologies like React, Next.js, and NestJS to demonstrate technical concepts in a fun and engaging way.
Crude Cards is a good party game for bad people. Perfect for casual hangouts or virtual game nights. Real-time play for multiple players via a WebSocket-powered backend. Adaptable for learning games or quizzes. |
More than entertainment—this project is a learning resource for full-stack, real-time app development. Find tutorials on building, deploying, and scaling the app in the cloud. |
The tech stack is carefully chosen to showcase modern full-stack development practices. Here's a breakdown:
-
Setup:
- Players connect to a game session via a room code.
- One player is selected as the "Dealer" for each round.
-
Gameplay:
- The Dealer plays a black card with a prompt or question e.g., "Wy can't I sleep at night?")
- The other players choose the funniest white card from their hand to complete the sentence or answer the question.
- The Dealer reviews the responses and selects the one they find funniest.
-
Winning:
- The player whose card is chosen wins that round and earns a point.
- The first player to reach a predefined number of points wins the game.
-
Additional "Fun":
- The game is customizable with different rule variations to keep things interesting.
- Clone the repository:
git clone https://github.com/dandonahoe/crude-cards.git
- Install dependencies:
pnpm install
- Run the development server:
pnpm run reset
- Open http://localhost:3000 in your browser to view the game.
%%{init: {'theme': 'dark', 'themeVariables': {
}}}%%
sequenceDiagram
participant Browser
participant GameService
participant PlayerService
participant WebSocket
Browser->>WebSocket: Connect with AuthToken
WebSocket->>GameService: Handle connection request
GameService->>PlayerService: Validate AuthToken
PlayerService->>GameService: Return existing Player (if found)
alt AuthToken is valid and game is active
GameService->>Browser: Rejoin Player to game (Limbo status)
GameService->>Browser: Check if Player was the dealer
alt Player was the dealer
GameService->>Browser: Restore dealer status (if conditions are met)
end
else AuthToken is invalid or outdated
WebSocket->>GameService: Create new Player
GameService->>Browser: New Player stays on home page
end
alt Dealer leaves mid-game
GameService->>WebSocket: Wait 30 seconds for rejoin
alt Dealer rejoined
GameService->>Browser: Continue game
else Dealer does not rejoin
GameService->>Browser: Notify players of game end (all lose)
end
end
alt Player uses game code URL
GameService->>Browser: Validate AuthToken and game code
alt Game code matches player's current game
GameService->>Browser: Player joins Limbo status
GameService->>Browser: Prompt dealer to accept or skip Player
alt Dealer accepts Player
GameService->>Browser: Player joins game
else Dealer skips Player
GameService->>Browser: Notify Player of removal
end
else Game code does not match current game
Browser->>GameService: Prompt Player to leave current game
end
end
This project is licensed under a Creative Commons Attribution-NonCommercial-NoDerivatives (CC BY-NC-ND) License with Custom Terms. You can learn from it, share it, and use it for educational purposes, but you must obtain permission for commercial use or any significant modifications.