A multiplayer blackjack game built with Next.js, TypeScript, and Supabase with real-time synchronization.
- Real-time multiplayer gameplay
- Beautiful casino-inspired UI with animations
- Persistent player data and game state
- Responsive design for desktop and mobile
- Complete blackjack rules implementation
- Node.js 18+ and npm/yarn
- Supabase account (free tier works fine)
- Clone the repository:
git clone https://github.com/SparkyWoo/blackjack_fun.git
cd blackjack_fun- Install dependencies:
npm install
# or
yarn install-
Set up Supabase:
- Create a new Supabase project
- Go to the SQL Editor in your Supabase dashboard
- Run the SQL migration in
supabase/migrations/20230601000000_create_blackjack_tables.sql - Get your Supabase URL and anon key from the API settings
-
Create a
.env.localfile in the root directory with your Supabase credentials:
NEXT_PUBLIC_SUPABASE_URL=your-supabase-url
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-supabase-anon-key
- Start the development server:
npm run dev
# or
yarn dev- Open http://localhost:3000 in your browser to see the game.
The game uses Supabase's real-time functionality to synchronize game state across multiple clients. Here's how it works:
-
Database Schema: The game uses three main tables:
players: Stores player information and balancesgame_state: Stores the current game state (deck, dealer hand, game phase, etc.)player_hands: Stores the hands for each player in the current game
-
Real-time Subscriptions: The game subscribes to changes in these tables using Supabase's real-time API:
- When a player joins, places a bet, or takes an action, the changes are saved to the database
- All connected clients receive these updates in real-time
- The UI updates automatically to reflect the current game state
-
State Synchronization: The game state is synchronized in two ways:
- When a player first loads the game, it fetches the current state from the database
- As the game progresses, all changes are broadcast to all connected clients
- Open the game in multiple browser windows to simulate multiple players
- Enter a name and join a seat
- Place your bets
- Take turns playing blackjack!
The game can be deployed to Vercel with the following steps:
- Push your code to a GitHub repository
- Connect your repository to Vercel
- Add your Supabase environment variables
- Deploy!
This project is licensed under the MIT License - see the LICENSE file for details.
- Built with Next.js, TypeScript, and Tailwind CSS
- Real-time functionality powered by Supabase
- Card game logic inspired by classic casino blackjack rules