Skip to content

Commit

Permalink
docs: README 수정
Browse files Browse the repository at this point in the history
  • Loading branch information
@kimday0326
kimday0326 committed Apr 2, 2024
1 parent 5f584c5 commit 5085070
Showing 1 changed file with 106 additions and 21 deletions.
127 changes: 106 additions & 21 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,21 +1,106 @@
# Contributors

| 박영재 | 김대휘 |
|:-------------------------------------------------------:|:----------------------------------------------------------:|
| <center>[zerozae](https://github.com/park0jae)</center> | <center>[marooo326](https://github.com/marooo326)</center> |

### 커밋컨벤션

| 태그이름 | 내용 |
|------------|---------------------------------|
| `feat` | 새로운 기능 추가 |
| `fix ` | 버그를 수정하는 경우 |
| `!hotfix` | 급하게 치명적인 버그를 수정하는 경우 |
| `refactor` | 코드 리팩토링 |
| `comment` | 필요한 주석 추가 및 변경 |
| `docs` | 문서 수정 또는 Swagger 등의 API 문서 업데이트 |
| `test` | 테스트를 추가하거나 리팩토링하는 경우 |
| `chore` | 빌드 테스트 업데이트, 패키지 매니저 설정 |
| `rename` | 파일이나 폴더명을 수정하거나 이동하는 경우 |
| `remove` | 파일을 삭제하는 작업만 수행한 경우 |
| `ci` | 배포 방식을 수정하거나 새로 추가하는 경우 |
# Tiki Taza

![](https://i.imgur.com/2pnuCQb.png)

### 👉[티키타자 바로가기](https://www.tikitaza.com)

<br>

## ✨ 프로젝트 소개

### [티키타자]는 누구나 쉽게 즐길 수 있는 웹 기반 타이핑 게임입니다!

1. 문장 게임 <br>
영화 대사, 명언 등 다양한 문장이 주어집니다. <br>
주어진 문장을 누구보다 빠르고 정확하게 입력하여 게임에서 승리하세요!
2. 코드 게임 <br>
다양한 언어의 코드가 주어집니다. <br>
주어진 코드를 누구보다 빠르고 정확하게 입력하여 게임에서 승리하세요!
3. 단어 게임 <br>
화면의 단어들을 입력하여 점수를 획득하세요. <br>
가장 많은 단어를 입력한 사람이 승자가 됩니다!

### 프로젝트 멤버

| 박영재 | 김대휘 |
|:-----------------------------------------------------------------------------------------------------------------------------------------------:|:------------------------------------------------------------------------------------------------------------------------------------------:|
| <img width="100" alt="zero" src="https://github.com/Team-E2I4/Team-E2I4-TikiTaza-BE/assets/121790935/b2270459-a532-4dc8-96e2-69ecb7de2345"><br> | <img width="100" alt="hwi" src="https://github.com/Team-E2I4/Team-E2I4-TikiTaza-BE/assets/121790935/23456d3c-14a1-4874-9ddb-0d13ea730b44"> |
| <center>[zerozae](https://github.com/park0jae)</center> | <center>[marooo326](https://github.com/marooo326)</center> |

<br>

## 🔍 주요기능

- `실시간 게임` 상대방의 위치를 실시간으로 확인하며 긴장감 넘치는 게임을 즐겨보세요.
- `실시간 접속자` 누가 접속해있는지 확인하고 함께 게임을 즐겨보세요!
- `랭킹` 전체, 모드별 랭킹을 통해 순위를 확인해보세요!
- `초대 코드` 랜덤한 코드로 친구를 초대할 수 있어요!

## 📆 프로젝트 기간

**2024.02.02 ~ 진행중**
<br>

## 🛠️ 기술 스택

### 개발 환경

<p>
<img src="https://img.shields.io/badge/JAVA 17-007396?style=for-the-badge&logo=java&logoColor=white">
<img src="https://img.shields.io/badge/Spring-6DB33F?style=for-the-badge&logo=Spring&logoColor=white">
<img src="https://img.shields.io/badge/Spring Boot 3-6DB33F?style=for-the-badge&logo=Spring boot&logoColor=white">
<img src="https://img.shields.io/badge/Spring Security 6-6DB33F?style=for-the-badge&logo=Spring Security&logoColor=white">
<img src="https://img.shields.io/badge/Spring Data JPA-6DB33F?style=for-the-badge&logo=Spring&logoColor=white">
</p>

<p>
<img src="https://img.shields.io/badge/Mysql-4479A1?style=for-the-badge&logo=mysql&logoColor=white">
<img src="https://img.shields.io/badge/Redis-DC382D?style=for-the-badge&logo=redis&logoColor=white">
<img src="https://img.shields.io/badge/SockJS-231F20?style=for-the-badge&logo=SockJS&logoColor=white">
<img src="https://img.shields.io/badge/STOMP-231F20?style=for-the-badge&logo=STOMP&logoColor=white">
<img src="https://img.shields.io/badge/Kafka-231F20?style=for-the-badge&logo=Kafka&logoColor=white">
</p>

<p>
<img src="https://img.shields.io/badge/Gradle-02303A?style=for-the-badge&logo=gradle&logoColor=white">
<img src="https://img.shields.io/badge/Docker-2496ED?style=for-the-badge&logo=docker&logoColor=white">
</p>

<p>
<img src="https://img.shields.io/badge/EC2-FF9900?style=for-the-badge&logo=AMAZON EC2&logoColor=white">
<img src="https://img.shields.io/badge/ECS-FF9900?style=for-the-badge&logo=AMAZON ECS&logoColor=white">
<img src="https://img.shields.io/badge/RDS-527FFF?style=for-the-badge&logo=AMAZON RDS&logoColor=white">
<img src="https://img.shields.io/badge/Elasticache-C925D1?style=for-the-badge&logo=AMAZON Elasticache&logoColor=white">
<img src="https://img.shields.io/badge/ROUTE53-8C4FFF?style=for-the-badge&logo=AMAZON ROUTE53&logoColor=white">
</p>

### 협업 도구

<p>
<img src="https://img.shields.io/badge/Git-F05032?style=for-the-badge&logo=Git&logoColor=white">
<img src="https://img.shields.io/badge/Github-000000?style=for-the-badge&logo=github&logoColor=white">
<img src="https://img.shields.io/badge/Slack-4A154B?style=for-the-badge&logo=slack&logoColor=white">
<img src="https://img.shields.io/badge/Notion-000000?style=for-the-badge&logo=notion&logoColor=white">
<img src="https://img.shields.io/badge/Swagger-85EA2D?style=for-the-badge&logo=swagger&logoColor=white">
</p>

<br>

## 🏗️ 아키텍처

![](https://i.imgur.com/gcx91a8.png)
<br>

## ✏️ 기술적 선택

| **기능** | **기술 선택 이유 및 근거** |
|-----------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| **게임방 리스트 조회** | - Polling은 구현이 간단하지만, 실시간 반응을 위해 서버에 짧은 간격으로 요청을 반복해야 하며, 이로 인해 서버 부하가 증가할 수 있음<br>- Long Polling은 실시간성을 향상시킬 수 있으나, 구현 복잡성이 증가하며 서버 리소스 관리가 더 까다로워질 수 있음<br>- WebSocket의 경우 실시간성을 달성할 수 있으나, 게임방 리스트 조회 기능에서는 양방향 통신을 필요로 하지 않음<br>- **따라서 클라이언트와 서버 간의 단방향 통신을 위한 기술인 Server-Sent Events (SSE)를 채택하였음** |
| **게스트 관리** | - 일회성 게스트는 MySQL과 같은 RDB에 저장될 필요가 없다고 판단<br>- Redis의 경우, MySql에 비해 접근 속도가 빠르고 다양한 데이터 형식을 저장할 수 있음<br>- 또한, 자체적으로 만료시간을 설정할 수 있음<br>- **따라서 Redis(운영환경에서는 Elaticache)를 활용하여 게스트를 관리하기로 결정** |
| **실시간 게임 정보** | - 실시간 게임 정보는 짧은 주기로 많은 삽입&업데이트 연산이 발생함<br>- Redis는 key를 이용해 빠른 접근이 가능하고, 싱글 스레드 구조로 인해 동시성 문제에 있어서도 상대적으로 안전<br>- **따라서 Redis(운영환경에서는 Elaticache)를 활용하여 실시간 게임 정보를 관리하기로 결정** |
| **웹소켓 메세지 브로커** | - 여러 대의 동시에 운영 될 시, 인메모리 브로커를 사용하면 브로커 간의 메세지 동기화가 이루어지지 않음<br>- **따라서 Kafka를 외부 메세지 브로커로 도입하여 모든 메세지가 중앙에서 처리될 수 있도록 구성** |
| **랭킹** | - 작업 실행 시간이 고정되어 있고 해당 시간에 실행되는 로직이 단순함을 고려하여, 프로젝트의 규모에 맞는 **Spring Scheduler**를 사용 |




0 comments on commit 5085070

Please sign in to comment.