팀 최종 프로젝트[booker] - 3일차(기획 마무리 & 코드 구현)

규갓 God Gyu·2024년 1월 8일
0

프로젝트

목록 보기
37/81

오전 회의 내용

컨셉

-> 깔끔하고 모던한 느낌
관련 자료 : 롱블랙

디자인 적으로 트랜디한 느낌이 있음
팀원 의견 모두 긍정적

==========================================================================

로그인 페이지

레퍼런스 2번째 사진 참고(사진 + 로그인)

감성적인 사진 찾아서 다음날 회의해서 결정할 예정

==========================================================================

회원등급

읽은 책 권수 등 누적됐을 때 등급 상승
배달의 민족 등급 참고해서 형태를 비슷하게 가져가는 방향

1단계 : 닫힌 책 한 권
2단계 : 펼쳐진 책
3단계 : 펼쳐진 책 + 만년필 / 연필
4단계 : 3단계에서 반짝이는 효과나 무언가 추가

※ 디자이너분께서 몇개 제작 후 제안해주실 예정

==========================================================================

마이페이지

  • 프로필
    - 닉네임(수정 가능)
    - 이메일
    - 사진(수정 가능)
    - 닉네임(수정 가능)
    ( 추가 ) 비밀번호 수정
  • 게시글 보기
    - 커뮤니티 / 중고책
  • 팔로우 내역
    - 유저 이름
  • 좋아요 내역
    - 좋아요 한 게시글 (커뮤니티 / 중고책)
  • 내가 쓴 글
    - 커뮤니티 / 중고책
  • 마이페이지 커뮤니티/ 중고책 UI 구성에 대한 후보
    1) 가로 슬라이드 형식으로 중고책 판매 / 커뮤니티 따로 정해진 공간 안에서 보여주게 (Ex. 롱블랙 )
    2) 페이지네이션
    3) 4개 정도 미리보기로 보여주고 더보기를 눌러야만 관련 컨텐츠 보여줄 수 있게
    4) 더보기 형식인데 우측에 스크롤바 있는 구조
    투표결과 : 4번
    : 일단 형식은 4번으로 가되, 나중에 수정사항 있으면 다시 회의 진행

==========================================================================

북커톡

페이지를 따로 나눠서 게시글 작성(기존엔 게시글 위에서 게시물 작성하는게 초안이였음)
카테고리 - 추후에 다시 회의(카테고리로 다룰 내용이 너무 많아서 정리해야함)

==========================================================================

중고책 판매

페이지를 따로 나눠서 게시글 작성(북커톡과 동일)
서치 바 - 따로 빼서 만들기

==========================================================================

도서소개 / 고객센터

나중에 회의

저녁 회의 내용

1. Ts 따로 빼서 정리(파일 만들 예정)

————————————————————————————————————————————————

2. PR 규칙

PR 관련된 부분 Booker 팀 채널에서 따로 말씀 드리기
최초 올린 사람이 변경사항이나 다른 설명하기
PR이나 push하게 되면 먼저 본 다른 팀원이 2차 책임자 역할을 가지고 확인해주고 머지해주는 방향으로
————————————————————————————————————————————————

3. 커밋 키워드 통일

type 키워드 사용 시점
feat: 새로운 기능 추가
fix: 버그 수정
docs: 문서 수정
style: 코드 스타일 변경 (코드 포매팅, 세미콜론 누락 등) 기능 수정이 없는 경우
design: 사용자 UI 디자인 변경 (CSS 등)
test: 테스트 코드, 리팩토링 테스트 코드 추가
refactor: 코드 리팩토링
build: 빌드 파일 수정
ci: CI 설정 파일 수정
perf: 성능 개선
chore: 빌드 업무 수정, 패키지 매니저 수정 (gitignore 수정 등)
rename: 파일 혹은 폴더명을 수정만 한 경우
remove: 파일을 삭제만 한 경우
Ex) ) rename: bookerTalk -> booker

4. Styled-components

같은 폴더 안에 스타일 컴포넌트 파일 넣기 !!!!!!!!1
따로 CSS적용을 위한 파일 생성 ex) bookertalkStyle.ts

Ts 파일 안에서 스타일 컴포넌트 import 후
Export const ButtonWrapper = styled.div``

꼭 Export를 작성해주셔야 해요 !
CSS를 적용시키고 싶은 파일에서 ex) Bookertalk.tsx
Import * as St from “./bookertalkStyle.ts” 불러와주고
기존에 있던 div 태그 대신 <St.ButtonWrapper>로 바꿔주면 스타일 적용 끝!!
————————————————————————————————————————————————

5. 리엑트 쿼리 + RTK or Recoil ?

리엑트 쿼리: 서버로부터 가져와서 동기화 or 서버와의 싱크를 맞춰줄 때의 데이터
RTK : 서버에 바로바로 상태를 통신하진 않음
Client state manager / server state manager
리엑트 쿼리일 때는 서버 상태
리덕스/ 리코일 : 클라이언트 상태
브라우저에서만 필요한 데이터는 클라이언트 상태
서버에서 불러와야하는 데이터는 서버 상태
리엑트 쿼리는 서버상태를 관리하는데에 너무 편해서 사용
usequery하나만 써놓으면 자동으로 refetch 됨
리엑트쿼리는 필수로 가져가고 그래서 리코일이냐 툴킷이냐?
내일까지 둘의 장단점 가져오기
현업에서도 자주 사용하는 게 무엇인지도 근거로 가져오면 좋을듯

오늘 한 일

  • 설문조사 페이지 컴포넌트 생성 - Survey.tsx
  • 세부 컴포넌트 생성 - components/layout - survey -> ,,,
  • package.json - nodeserver 명령어 생성

고민한 부분

책을 추천해주기 위한 설문조사 페이지를 만들어야 하는데 밸런스게임, 아키네이터처럼 여러 질문을 통해 그 유저에게 맞는 책을 추천해주고 싶었는데, 어떻게 접근해야할지 감이 잡히지 않았다. 설문조사 api를 찾아보았는데

구글폼 - 부트캠프 다면평가 같은 폼 - 별로
surveyMonkey - 구글폼이랑 크게 다르지 않음
typeform - 비슷비슷
waveon - 돈주고 mbti 에 맞는 여행지 추천해주는것처럼??? 책추천?

내가 원하는 형식이 아니였고, 튜터님과 상의하고 고민한 결과 책 api로 가져온 책들을 필터를 통해 한 두권의 책만 추천해줄 수 있게 만들자가 결론이였다. 결국 그러면 설문api를 사용하는게 아니기 때문에 질문지가 중요했는데, 처음 가져온 api가 베스트셀러 관련한 api이기 때문에 총 책 권수가 50권밖에 안되어 여러 질문지를 통해서 필터하기가 쉽지가 않아 베스트셀러 한정으로는 질문을 1개만 해서 끝마치는걸로 하였다. 그리고 필터로 거를 수 있는 종류들은 꽤 많았지만 분류를 위한 카테고리 자체도 너무 부족하여서 질문 1,2개로 책을 추천하는게 어쩔 수 없는 default 값이라 판단하였다.

○ 🔥Best Seller🔥 요즘 핫한 원하는 장르의 책 추천받기!!
어떤 장르의 책을 읽고 싶나요??

  • 소설 / 자기계발 / 에세이 / 인문학 / 경제경영 / 만화 / 건강 / 어린이 / 역사
    (categoryName 소설 자기계발 외국어 에세이 인문학 자격증 경제경영 만화 건강 어린이 역사)
    [선택 옵션에서 빼야할 장르 - 외국어 자격증 ]

🔥Best Seller🔥 요즘 핫한 국내도서 vs 외국도서 추천받기!!
어떤 책을 추천받고 싶나요??(author 옮긴이 있으면 외국작가 / 없으면 국내작가)

  • 국내작가도서 / 외국작가도서
    [선택 옵션에서 빼야할 장르 - 외국어 자격증 ]

🔥Best Seller🔥 본인이 추구하는 가치에 걸맞는 책 추천받기!!
살아감에 있어 꼭 하나를 챙겨야한다면??(author 엮은이 포함 title 지혜 / 성공)

  • 성공과 행복 / 지혜

🔥Best Seller🔥 신작, 어디까지 읽어봤니??
어떤 장르의 책을 읽고 싶나요??(pubDate 2023-12 포함 / categoryName 장르 선택)

  • 경제경영 / 에세이 / 건강 / 자기계발 / 소설
    [선택 옵션에서 빼야할 장르 - 외국어 자격증 어린이]

🔥Best Seller🔥 텅장러들을 위한 추천 도서!!
어떤 장르의 책을 읽고 싶나요??(priceStandard 17000 이하 categoryName 선택)

  • 인문학 / 자기계발 / 소설 / 만화 / 경제경영 / 한국시
    (소설) 어떤 국가의 소설을 읽고 싶나요??
  • 아일랜드소설 / 한국소설 / 영미소설 / 판타지소설 / 미스터리소설

이렇게 질문지를 만들고 버튼을 클릭하여 필터할 수 있게 구현하면 되지 않을까? 까진 기획하게 되었고, 실제 코드 구현이 어떻게 잘 될지 안될지는 기대 반 걱정 반 인 것 같다

profile
웹 개발자 되고 시포용

0개의 댓글