Gamulpung

It follows the same rules as Minesweeper. However, the map expands infinitely, and you can play with oher people in this website!

What is this Project?

This project is an online multiplayer version of Minesweeper, where the map expands infinitely. Players can join and play together in real-time, making it a unique and engaging experience compared to the traditional single-player Minesweeper game.

Features

• Infinite Map: The game map expands infinitely as you explore.
• Multiplayer: Play with other people in real-time.
• Chat: Press Enter and Chat with other players.
• Real-time Updates: See the moves of other players instantly.

Technologies Used

• Frontend: Next.js, Zustand, Scss, Pixi/react
• Backend: FastAPI
• WebSocket: For real-time communication
• Tile engine: Rust (WebAssembly) for fast tile parsing and diff; falls back to JS if WASM is not ready.

Project Structure

• /src: Frontend source (app, components, store, utils). Built WASM bindings live in src/wasm-pkg/.
• /wasm: Rust source for the WebAssembly tile engine (hex/binary parsing + diff). Build output is in src/wasm-pkg/; wasm/target/ is gitignored.
• /public: Static files and assets.
• /public/documents: Documents for contributing.

Play

Let's play the game here.

Contribute

Here's more information to contribute this project: https://gamultong.github.io/gamulpung-client/documents/contribute-guide/?lang=en#overviewofcontributersguide

If you want to contribute this project, Follow these steps.

Fork this repository

1. Navigate to the GitHub repository you want to fork.
2. In the top-right corner of the repository page, click the "Fork" button.
3. GitHub will create a copy of the repository in your own GitHub account.
4. You can now clone the forked repository to your local machine using the following command:

git clone https://github.com/your-username/minesweeper-client.git

5. Make changes to the code in your local repository.
6. Commit and push your changes to your forked repository on GitHub.
7. If you want to contribute your changes back to the original repository, create a pull request:

• Go to your forked repository on GitHub.
• Click the "Pull Request" button.
• Compare your changes with the original repository.
• Add a title and description for your pull request.
• Click "Create Pull Request".

How to set devleopment environment.

1. Setting Environments

node >= 20.10
npm >= 10.9

In .env file, There are two environment values.

NEXT_PUBLIC_WS_HOST = 
NEXT_PUBLIC_HOST = "http://localhost:2001/gamulpung-client"

Mail me to get websocket host url: Email: kkh061101@naver.com

2. Install Dependencies.

npm install 

3. Run Development Server.

npm run dev

4. Test Linting Codes Before Building.

npm run lint

5. Building with the WASM tile engine
   The repo includes pre-built WASM in src/wasm-pkg/, so you can run and build the app without Rust. If you change code in /wasm (Rust), install Rust and wasm-pack, then build:

   Install Rust (one-time):

   # Windows (PowerShell)
   winget install Rustlang.Rustup
   # Or: https://rustup.rs/ — download and run the installer for your OS.

   # macOS / Linux
   curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh

   Restart the terminal (or run source $HOME/.cargo/env on macOS/Linux) so cargo is on your PATH.

   Install wasm-pack (one-time):

   cargo install wasm-pack

   Build the WASM package (when you change /wasm):

   cd wasm && wasm-pack build --target web --release --out-dir ../src/wasm-pkg

   CI (GitHub Actions) runs the Rust + wasm-pack setup and this build before npm run build on every push/PR, so the deployed site always uses an up-to-date WASM build.