마루 퀴즈

메인 화면

---

퀴즈 화면

---

결과 화면

---

설명

1. 저의 귀여운 반려동물 마루를 자랑하기 위해 제작하였습니다.
2. Vite를 이용한 Vue3 및 Tailwind CSS로 제작되었습니다.
3. Tailwind CSS의 Component Vue 소스 코드를 참고하여 화면을 구성하였습니다.
4. Tailwind CSS의 반응형 웹 지원을 통해 모바일 화면에서도 원활한 이용이 가능합니다.
5. Pinia 상태 저장/관리 라이브러리로 동일 컴포넌트에서 퀴즈 문제 10개가 보여지도록 구성하였고, 진행 상황 및 정답 개수를 관리하였습니다.
6. 마루의 힌트를 누를 경우 총 10개의 힌트 중 랜덤으로 2개의 힌트를 뽑을 수 있습니다.
7. DB를 사용하지 않은 토이 프로젝트(단순히 목적 없이 심심해서 만든... )로 backend service는 존재하지 않습니다.