Quick Start

Introduction

Blackjack-deck is a comprehensive TypeScript library for building blackjack games and card-based applications. It provides everything you need from core game logic to beautiful React components.

Blackjack-deck consists of different packages:

• @blackjack-deck/core - Game logic, hand evaluation, and utilities
• @blackjack-deck/icons - Card suit icons with multiple variants
• @blackjack-deck/react - Headless React components (coming soon)

Terminology

Headless Components: Unstyled, accessible components that provide logic and structure without enforcing visual design.

Tree-shaking: Modern bundlers only include the code you actually import, keeping bundle sizes small.

TypeScript: A typed superset of JavaScript that provides excellent developer experience and type safety.

Some basic knowledge of React.js and TypeScript would be useful for building card games.

Installation

Install the packages you need:

# Core game logic
npm install @blackjack-deck/core

# Icon components
npm install @blackjack-deck/icons

# Or both
npm install @blackjack-deck/core @blackjack-deck/icons

Quick Examples

Core - Game Logic

import { createDeck, shuffle, calculateHandValue, isBlackjack } from '@blackjack-deck/core';

// Create and shuffle a deck
const deck = shuffle(createDeck());

// Evaluate a hand
const playerHand = [
  { suit: 'spades', rank: 'A' },
  { suit: 'hearts', rank: 'K' }
];

console.log(calculateHandValue(playerHand)); // 21
console.log(isBlackjack(playerHand)); // true

Icons - Card Suits

import { Spades, Hearts } from '@blackjack-deck/icons/outline';
import { Diamonds, Clubs } from '@blackjack-deck/icons/filled';

function MyCard() {
  return (
    <div className="flex gap-2">
      <Spades className="w-6 h-6 text-black" />
      <Hearts className="w-6 h-6 text-red-500" />
      <Diamonds className="w-6 h-6 text-red-500" />
      <Clubs className="w-6 h-6 text-black" />
    </div>
  );
}

Next Steps