Skip to content

RaJharit77/Minesweeper

Repository files navigation

๐ŸŽฎ Mineswipper - React Native Minesweeper Game

Expo React Native TypeScript NativeWind SQLite

A modern, cross-platform Minesweeper game built with React Native and Expo, featuring native performance, beautiful animations, and offline capabilities.

โœจ Features

  • ๐ŸŽฎ Classic Minesweeper Gameplay - Authentic minesweeper experience with multiple difficulty levels
  • ๐Ÿ“ฑ Cross-Platform - Runs on iOS, Android, and Web
  • ๐ŸŽจ Modern UI - Beautiful interface with NativeWind (Tailwind CSS for React Native)
  • ๐Ÿ’พ Local Storage - Game progress saved using SQLite and AsyncStorage
  • ๐ŸŽต Immersive Experience - Audio feedback and haptic vibrations
  • ๐Ÿ”— Navigation - Smooth navigation with Expo Router
  • โšก Performance - Optimized with Reanimated 2 and React 19

๐Ÿ›  Tech Stack & Dependencies

Core Framework

Expo React Native React 19

UI & Styling

NativeWind Reanimated 2 React Navigation 7

State Management

Zustand

Storage

SQLite AsyncStorage

Multimedia

Expo Audio Expo Haptics

Navigation & Routing

Expo Router React Navigation

Icons & Assets

Expo Vector Icons Expo Symbols

Utilities

Expo Linear Gradient Expo Image Gesture Handler

๐Ÿš€ Quick Start

Prerequisites

  • Node.js >= 18.0.0
  • npm >= 8.0.0
  • Expo CLI (optional, included in dependencies)
  • iOS Simulator (for iOS development) or Android Studio (for Android)

Installation

# Clone the repository git clone <repository-url> cd mineswipper # Install dependencies npm install # Start the development server npm start

Running the App

# Start development server npm start # Run on Android npm run android # Run on iOS npm run ios # Run on Web npm run web

๐Ÿ“ฑ Platform Support

Platform Status Requirements
iOS โœ… Fully Supported iOS Simulator or physical device
Android โœ… Fully Supported Android Emulator or physical device
Web โœ… Supported Modern browser with ES6 support

๐Ÿ— Project Structure

mineswipper/ โ”œโ”€โ”€ app/ # Expo Router app directory โ”‚ โ”œโ”€โ”€ (tabs)/ # Tab navigation screens โ”‚ โ”œโ”€โ”€ _layout.tsx # Root layout configuration โ”‚ โ””โ”€โ”€ index.tsx # Entry point โ”œโ”€โ”€ assets/ # Static assets (images, fonts, icons) โ”œโ”€โ”€ components/ # Reusable UI components โ”œโ”€โ”€ hooks/ # Custom React hooks โ”œโ”€โ”€ store/ # Zustand state management โ”œโ”€โ”€ utils/ # Utility functions and helpers โ”œโ”€โ”€ scripts/ # Build and utility scripts โ”œโ”€โ”€ app.json # Expo configuration โ”œโ”€โ”€ package.json # Dependencies and scripts โ””โ”€โ”€ tailwind.config.js # NativeWind configuration 

๐ŸŽฏ Available Scripts

# Development npm start # Start Expo development server npm run android # Run on Android emulator/device npm run ios # Run on iOS simulator/device npm run web # Run in web browser # Build npm run build:android # Build Android release APK # Quality Assurance npm run lint # Run ESLint for code quality npm run doctor # Check project dependencies and health # Project Management npm run reset-project # Reset project to clean state

โš™๏ธ Configuration

App Configuration (app.json)

  • Name: Mineswipper
  • Bundle ID: com.rajharit77.mineswipper
  • Orientation: Portrait
  • Theming: Automatic dark/light mode
  • New Architecture: Enabled
  • Permissions: Audio, vibration, full-screen intents

Key Features Configuration

  • Audio Background Modes: Enabled for iOS
  • Splash Screen: Custom with themed background
  • SQLite Database: Local game data storage
  • Haptic Feedback: Enhanced user experience

๐ŸŽจ Theming & Styling

The project uses NativeWind (Tailwind CSS for React Native) for styling:

  • Utility-first CSS framework
  • Dark mode support
  • Responsive design
  • Custom animations and transitions

๐Ÿ”ง Development

Adding New Dependencies

npx expo install <package-name>

TypeScript Support

Full TypeScript support with strict type checking and Expo's typed routes.

Hot Reloading

Enjoy fast development with Expo's hot reloading and fast refresh capabilities.

๐Ÿ“Š Performance Optimizations

  • Reanimated 2: 60 FPS animations on native thread
  • React Compiler: Enabled for performance improvements
  • Image Optimization: Expo Image with caching
  • Memory Management: Efficient state management with Zustand

๐Ÿ—‚๏ธ Data Persistence

  • SQLite: Game statistics and user progress
  • AsyncStorage: App preferences and settings
  • Asset Caching: Efficient asset loading with Expo Asset

๐Ÿ”Š Audio & Haptics

  • Sound Effects: Game actions feedback
  • Background Audio: Continuous playback support
  • Haptic Feedback: Tactile responses for game events
  • Vibration: Android vibration API support

๐ŸŽฎ Game Features

  • Multiple difficulty levels
  • Timer and score tracking
  • High score leaderboard
  • Game statistics
  • Customizable themes
  • Sound and vibration settings

๐Ÿค Contributing

  1. Fork the repository
  2. Create a feature branch
  3. Commit your changes
  4. Push to the branch
  5. Open a Pull Request

๐Ÿ“ License

This project is licensed under the MIT License - see the LICENSE file for details.

๐Ÿ™ Acknowledgments

  • Expo team for the amazing framework
  • React Native community
  • NativeWind for Tailwind CSS integration
  • All open-source contributors

Built with โค๏ธ using Expo & React Native

For issues and feature requests, please use the issue tracker.

About

Minesweeper game with react-native, native wind with expo-go

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors