💻 프로젝트
개발인원 | 프론트 4명
개발기간 | 22.07 - 22.08 (2주) + 리팩토링 진행 중
🔗 Links
배포 주소 | 👉🏻 CheQuiz
FE Git | ‣
팀 노션 | 기동팀(CheQuiz)
프로젝트 & 서비스 소개
<aside>
⭐ CHEQUIZ는 **[ 퀴즈 ]**라는 간단하지만 수치화할 수 있는 시스템을 통해
현재 나의 개발 지식을 측정할 수 있는 서비스입니다.
</aside>
[CheQuiz 핵심기능]
- 랜덤 퀴즈 기능으로, 빠르게 나의 지식을 점검할 수 있습니다.
- 주제별 퀴즈 세트 풀이를 통해, 필요한 주제를 집중적으로 점검할 수 있습니다.
- 게임요소가 결합되어, 문제를 풀며 경험치를 획득하고 나만의 뱃지와 캐릭터를 키워나갈 수 있습니다.
- 좋아요 및 댓글을 통해, 퀴즈에 대한 피드백을 남기고 다른 사용자와 소통할 수 있습니다.
- [서비스 기획 배경 및 타겟층 확인하기]
🛠 기술 스택
- React | Typescript | ContextAPI | Strapi
🧑🏽💻 담당 역할 및 기능
- 메인페이지 및 퀴즈 생성페이지 구현
- strapi를 통한 서버 교체 리팩토링 진행
🖥 세부 개발 내용
퀴즈 Form 구현
1. 제어컴포넌트를 통한 quizForm 구현
- Input, Select, TextFiled, CheckBox 등 Form에 필요한 공통 컴포넌트 개발
- QuizSet와 QuizList 정보를 local state로 저장하고, Form컴포넌트들과 연동
2. CustomHook을 통한 퀴즈 Validation 진행
- Yup에서 정의 된 QuizForm의 schema와 현재 Form의 quizList data를 입력 받음
- validation에 맞지 않는 경우, 해당 Quiz의 index, key값, errorMessage를 리턴하는 CustomHook 개발