The minesweeper from yongveloper

minesweeper's Introduction

프로젝트 개요

지뢰찾기 게임

배포 링크

기능 구현

지뢰 찾기 기본 기능
- 게임 시작, 승리, 패배
- 게임 초기화
- 주변 지뢰 갯수 표시
- 빈 공간 클릭 시 주변 탐색
- 난이도 설정
- 우클릭 깃발
- 타이머
첫 클릭은 지뢰가 터지지 않음
브라우저 새고로침 시 난이도 유지
Area open 기능

프로젝트 폴더 구조

📦src
 ┣ 📂components
 ┃ ┣ 📂Board
 ┃ ┃ ┣ 📜Board.styles.ts
 ┃ ┃ ┣ 📜Board.tsx
 ┃ ┃ ┗ 📜index.tsx
 ┃ ┣ 📂Cell
 ┃ ┃ ┣ 📜Cell.styles.ts
 ┃ ┃ ┣ 📜Cell.tsx
 ┃ ┃ ┗ 📜index.tsx
 ┃ ┣ 📂Footer
 ┃ ┃ ┣ 📂Modal
 ┃ ┃ ┃ ┣ 📜index.tsx
 ┃ ┃ ┃ ┣ 📜Modal.styles.ts
 ┃ ┃ ┃ ┗ 📜Modal.tsx
 ┃ ┃ ┣ 📜Footer.styles.ts
 ┃ ┃ ┣ 📜Footer.tsx
 ┃ ┃ ┗ 📜index.tsx
 ┃ ┗ 📂Header
 ┃ ┃ ┣ 📜Header.styles.ts
 ┃ ┃ ┣ 📜Header.tsx
 ┃ ┃ ┗ 📜index.tsx
 ┣ 📂hooks
 ┃ ┣ 📜useAppSelector.ts
 ┃ ┗ 📜useModal.ts
 ┣ 📂store
 ┃ ┣ 📜gameSlice.ts
 ┃ ┗ 📜store.ts
 ┣ 📂styles
 ┃ ┗ 📜GlobalStyles.ts
 ┣ 📜App.tsx
 ┣ 📜main.tsx
 ┣ 📜types.ts
 ┣ 📜utils.ts
 ┗ 📜vite-env.d.ts

components/: 프로젝트의 React 컴포넌트들이 위치한 폴더입니다.
hooks/: 커스텀 훅들이 위치한 폴더입니다.
store/: Redux store와 관련된 파일들이 위치한 폴더입니다.
styles/: 전역 스타일과 관련된 파일들이 위치한 폴더입니다.