📋 지뢰 찾기 게임 만들기

🚀 시작하기

1. 코드 에디터(예: VSCode)에서 classum_김규리_minesweeper 폴더를 열어 주세요.
2. 터미널을 열고 npm i 명령어를 입력하여 의존성 패키지를 설치하세요.
3. 모든 준비가 완료되면 npm run dev 명령어를 실행하여 프로젝트를 실행할 수 있습니다.

📚 사용한 라이브러리

• react-redux, redux-toolkit: 상태 관리를 위해 사용
• react-router-dom: 라우팅을 위한 라이브러리
• tailwindcss: 스타일링 라이브러리
• react-icons: 다양한 아이콘 사용을 위해 적용
• typescript: 타입 안정성을 보장하며 코드를 작성

💡 구현한 주요 기능

1. 게임 설정

• 난이도 선택: 초보자(8x8, 10지뢰), 중급자(16x16, 40지뢰), 고급자(32x16, 100지뢰) 난이도를 선택할 수 있습니다.
• 사용자 지정 난이도: 가로, 세로 크기와 지뢰 개수를 직접 입력하여 게임을 설정할 수 있습니다.
• 난이도 저장: 선택한 난이도는 로컬스토리지에 저장되어 브라우저를 새로고침해도 유지됩니다.
• 게임 초기화: 버튼을 눌러 현재 설정으로 게임을 초기화할 수 있습니다.

2. 게임 플레이

• 셀 좌클릭: 셀을 클릭하여 지뢰를 확인하거나 주변 숫자를 엽니다. 빈 칸을 클릭하면 연결된 빈 칸들이 자동으로 열립니다. 지뢰를 클릭하면 게임이 종료됩니다.
• 셀 우클릭: 셀에 깃발을 꽂아 지뢰로 표시하거나, 깃발을 제거할 수 있습니다.
• 게임 종료 조건: 모든 지뢰를 제외한 셀이 열리면 게임 성공, 지뢰를 클릭하면 게임 실패.

3. UI 및 타이머

• 타이머 기능: 게임 시작(RUN 상태) 시 타이머가 작동하며, 성공(SUCCESS) 또는 실패(GAMEOVER) 시 자동으로 멈춥니다.
• 남은 지뢰 표시: 총 지뢰 개수에서 현재 깃발 개수를 뺀 남은 지뢰 수가 표시됩니다.