프로젝트 기획서
회원가입 없이도 웹으로 간단하게 라이어 게임을 즐길 수 있는 접근성 높은 서비스입니다.
| J012 | J065 | J143 | J208 |
|---|---|---|---|
 |
 |
 |
 |
| 김경식 | 김한빈 | 이수민 | 최인규 |
-
📑 각 페이지에 대한 설명
✔️ 사용자는 로그인, 비로그인으로 게임을 할 수 있습니다.
✔️ 회원가입을 하면 아이디가 생성되며 이 아이디로 로그인할 수 있습니다.
✔️ 현재 대기중인 방 목록을 확인할 수 있습니다
✔️ 로그인 했을 경우엔, 자신의 점수와 등급을 확인할 수 있습니다.
✔️ 게임 생성, 게임 찾기, 랭킹 확인, 룰 설명 등 여러 기능도 사용 가능합니다.✔️ 게임 생성 버튼을 누르면 방을 생성할 수 있습니다.
✔️ 게임 찾기 버튼을 누르면 검색 모달을 보여줍니다.
✔️ 검색을 하면 검색한 방 제목이 포함된 방 리스트를 보여줍니다.✔️ 자리가 없는 방에 입장하려고 할 경우 알림 모달을 띄웁니다.
✔️ 랭킹 버튼을 누르면 랭킹을 확인할 수 있습니다.
✔️ 게임 방에 입장하면 방에 입장한 다른 유저가 보입니다.
✔️ 게임 설정 버튼을 방장이 누르면 세부 설정을 변경할 수 있습니다.
✔️ 준비 완료 버튼을 누르면 해당 플레이어는 준비 완료 상태가 됩니다.
✔️ 모든 유저가 준비를 완료한 후 게임 시작 버튼을 누르면 게임이 시작됩니다.
✔️ 준비가 되지 않은 상태에서 나가는 버튼을 누르면 게임 방에서 나갑니다.✔️ 게임이 시작되면 설정, 준비, 시작 버튼이 사라집니다.
✔️ 라이어에게는 왼쪽, 기타 플레이어에게는 오른쪽 버튼을 보여줍니다.✔️ 각 플레이어가 한 번씩 돌아가며 음성 발언권을 얻습니다.
✔️ 모든 플레이어는 게임 도중 채팅을 할 수 있습니다.✔️ 모든 플레이어의 발언이 끝나면 라이어를 추측하여 투표합니다.
✔️ 투표가 완료되면 투표 결과를 표시합니다.
✔️ 투표 결과 최고 투표자가 라이어가 아니면 라이어가 승리합니다.✔️ 투표 결과 라이어가 걸렸을 경우 15개의 단어 중 정답을 선택합니다.
✔️ 라이어가 정답을 맞춘 경우 라이어가 승리합니다.
✔️ 결과 발표 후 처음 방에 입장한 상태로 돌아갑니다.
- CRA 환경에서 개발합니다.
- 로그인, 로비, 게임하기 페이지는 SPA로 구현합니다.
- 서버에 데이터를 요청 시, 요청 횟수를 최소화합니다.
- UX 향상을 위해서 적절한 애니메이션을 사용합니다.
- react 함수형, Hooks API를 사용하여 상태 관리를 합니다.
- 채팅에 필요한 socket을 구현하여 제공합니다.
- 게임은 방 별로 진행되므로 socket 구현 시 채널링을 구현해야 합니다.
- NGINX를 활용하여 해킹에 대한 취약점을 보완합니다.
- db와 연동하여 랭킹 시스템을 구현해야 합니다.
- 깃허브 액션을 이용한 자동배포를 구현해야 합니다.
- 도커를 사용하여 배포합니다.
- 반드시 서버에서 제공하는 API 를 연동해서 구현해야 합니다. (웹)
- 외부 API 를 사용할 경우에도 개발하는 서버를 통해서 연동해야 합니다. (웹)
- API 로 가져오지 않은 별도 리소스(이미지, 영상 등)는 비동기로 처리합니다. (공통)