토이 프로젝트 - A - JAE GAG 1차 완성

특이사항 - 정신 차려보니 끝났다....

코로나로 정신이 반쯤 나간 상태에서, 내가 권유해서 합류해준 벡 친구한테 미안해서라도 억지로 하루 한 스크립트라도 짜내고 엎어지는 짓을 일주일 즈음 하고나서야 끝났다. 간단할 줄 알았던 프로젝트는 건강 이슈로 한 쪽이 삐걱거리니 급도로 상황이 악화되었고(전적으로 내 책임이다) 그로 인해 결국 구상했던 신고 기능은 제외한 채로 완성하게 되었다. 완성했다고 끝이 아니라, 반응형 웹 추가, 리팩토링, 코드 리뷰, 타입 스크립트 정리, 깃허브 리드미 작성 등 할 것이 많다. 벌써 확인된 버그도 3개가 넘는다.

 

작업 내용

우선 버셀로 배포한 기본 사이트부터
https://asd-kappa-flax.vercel.app/

React App

벡 친구한테도 보였으니깐 이 링크를 타고가면 볼 수 있을 것이다.

 

페이지 구성은

메인 페이지 - 랜딩 페이지 대용이며 다른 사이트 기능과의 접근이 용이하게 간단한 버튼들로만 구성됨.

개그 리스트 - 최신, 주간 인기, 전체 인기 3가지 기준을 두고 페이지 당 15개의 목록을 불러온다. 여기서는 정답률, 인정(추천), 아재(비추천) 숫자를 비교해볼 수 있다.

개그 풀어보기 - 개그 리스트에서 개그를 고르면 들어가지는 페이지로, 15초 안에 문제의 정답을 풀 수 있는지 없는지 체크한다. 푼다면 정답률이 반영되며 시간제한을 넘긴다면 정답을 보여주며 오답으로 처리된다. 여기서는 다음 개그, 이전 개그로 이동할 수 있으며 이 개그에 대한 평가로 인정 or 아재가 가능하다.

마이 개그 - 내가 써놓은 개그 리스트를 불러온다. 로그인 시 노출되는 헤더의 닉네임을 클릭해서 이동할 수 있으며, 여기서는 개그 리스트와 같은 방식으로 노출되지만 삭제가 가능하다.

 

이렇게 되어 있다. 모달은 총 2개가 있으며 하는 회원가입 / 로그인 모달이며 다른 하나는 개그 작성 모달이다.

보다 자세한 내용은 내일 페이지별 코드 리뷰를 적으며 진행할 예정이다.

 

추가된 기술

없음

현재 사용 기술

React, TypeScript, React-Cookie, Recoil, Styled-component, react-query, axios,