Memory Matching Game

A fun and interactive memory matching game built with Vite, React, TypeScript, and Tailwind CSS. This project utilizes local storage to track the best score and Context API for state management.

Features

  • Dynamic Gameplay: Play with shuffled cards that reveal images.
  • Score Tracking: Local storage is used to save and compare the best score.
  • Responsive Design: Fully responsive layout with Tailwind CSS.
  • Context API: Efficient state management using React Context API.

Technologies Used

  • Vite: A fast development environment for modern web projects.
  • React: A JavaScript library for building user interfaces.
  • TypeScript: A superset of JavaScript that adds static types.
  • Tailwind CSS: A utility-first CSS framework for rapid UI development.
  • Local Storage: Used to store the best score across sessions.

Getting Started

Prerequisites

  • Node.js (v20)
  • npm, pnpm or yarn

Installation

  1. Clone the repository:

    git clone https://github.com/Kaempy/memory-matching-game.git
    cd memory-matching-game
  2. Install dependencies:

    pnpm install
  3. Start the development server:

    pnpm run dev
  4. Open your browser and navigate to http://localhost:5173 to see the game in action.

Usage

  • Click on the cards to reveal their images.
  • Match pairs of cards to clear them from the board.
  • Keep track of your turns and try to beat your best score!