🌫️

2024. 04. 02. 회의록

디자이너님 회의

•

태원님 부분 (메인페이지 / 리스트 페이지)

1. 메인 페이지 슬릭으로 슬라이드구성하는것

< 메인페이지 > : 슬라이드 형식으로 신규 클래스와 인기클래스 등을 보여준다. 메인 페이지에서 굳이 페이지네이션으로 페이지가 넘어갈 정도로 클래스를 보여줘야 하는가? 신규 클래스와 인기 클래스만 보여줘도 충분하지 않나.. 혹은 상단에 배너를 넣어서 우리 사이트를 홍보하는식으로 들어가던가…

◦

헤더 아래쪽으로 배너가 들어감!!
+ 배너 아랫쪽으로 슬라이더 기능 들어감!!
→ 카테고리 버튼은 사이드바 말고 그 우측으로 들어감 (지금 아랫쪽에 있는 카테고리 느낌 but 화면이 움직이지는 않음)

최종 메인페이지 이런 느낌!!!

(저 프로필 이미지 눌렀을 때 드롭다운 되는건 내일 다시 회의 해야할 듯..)

2.리스트 페이지네이션 쓰는게 맞는지

< 리스트 페이지 > : 카테고리을 선택하거나 검색을 했을 때, 해당 필터에 맞는 클래스들을 확인 할 수 있다. 이때 페이지가 넘어가도록 구현하는게 맞는지 : ㅇㅇ 맞음 → 페이지네이션 보다는 무한스크롤 → 아래쪽 내려갔을 때 상단으로 올라오는거 버튼

◦

검색하거나 카테고리 선택 시, 리스트 페이지로 넘어가기.

3. 카테고리 버튼 바 메인페이지,리스트페이지 둘다있는게맞는지 : yes

4. 로고에 홈 링크 넣어놨는데 사이드바에도 홈링크 따로 만들지 : 둘 다 링크 넣자.

데일리 스크럼 튜터님

•

메인페이지 / 리스트 페이지 클래스 보러가기 버튼은 필요없음 → 클래스 카드 자체를 누르면 디테일페이지로 넘어가게 할 수 있음!!

•

토스 페이먼츠 디자인 확인해보기 : 아마 결제하기 버튼만 필요할듯 / 그 외 커스터마이징은 불가능… 토스 페이먼츠에서 제공하는 결제 페이지 화면을 그대로 써야함

•

예약 페이지 : 이전/다음 버튼 너무 아랫쪽에 작게 들어가 있음 → 버튼 크기를 큼지막하게@@

•

왼쪽 네비게이션바 (마이페이지 / 수강생 전환 / 로그아웃 부분) → 헤더에 있는 프로필 이미지 눌렀을 때 드롭다운으로 내려오게 해서 보여주는게 더 낮지 않나
(약간 요런 느낌으로!!)

•

클래스 검색하기는 헤더에서 꽉차게 길쭉하게 만들기

튜터님 피드백

•

파란색은 약간 금융권 색 느낌같다… 포인트 컬러를 바꾸거나 좀 더 파스텔 느낌으로 가보자

•

마이페이지 및 디테일 페이지에 정보 등 정렬은 눈에 보기 좋게

→ 아래 페이지 보면서 말씀하셨습니다!! 저 클래스 설명 아래에 있는 정보 정렬 부분@

•

클래스보러가기 버튼 필요 없을 것 같음(카드눌렀을때 바로 들어갈 수있도록)

•

메뉴바에 아이콘(홈, 채팅, 클래스 등록 정도만 남겨두고 나머지는 헤더 프로필 이미지 눌렀을 때 보이도록 하는건?)

→ 약간 로그아웃은 숨겨두는게 좋을수도. 사람들이 쉽게 로그아웃 못 하도록 가둬버리기!!!

코드 리뷰

•

Carousel 라이브러리 추천

◦

Embla Carousel

A lightweight carousel library with fluid motion and great swipe precision

https://www.embla-carousel.com/

◦

eg-js

Plugins | Flicking

All plugins are available by installing @egjs/flicking-plugins

https://naver.github.io/egjs-flicking/Plugins#options

•

튜터님 추천 폰트 : pretendard → 폰트 적용하는 방법 따로 확인하기 (localfont 가져와서 tailwindcss에 적용? 나중에 알려주시겠쬬?!)

•

`prettier-plugin-tailwindcss` 사용해보자

•

supabase data 변수명 : camelCase(detailLocation) v.s. snake_case(user_id) 이렇게 작성 방법이 다른 부분 어떻게 통일 할 것인가???? 

◦

data snake_case로 통일

•

app/page.tsx(HomePage로 바꾸고) → app/(clrm) 폴더 밑으로 이동하기 

: 이렇게하면 MainPage 밑에 있는 page.tsx가 먼저 찾아서 보여지게 됨.

•

tailwindcss 단위 사용하기 : 주로 4 또는 8의 배수 단위 사용함. ex) 12px. 96px 등등… 

•

미주님/현진 ⇒ teacher → isTeacher로 변경하기 ! 

→ supabase에서도 isTeacher로 변경하기!!(supabase에서는 변경 완료했습니다. )

저녁 데일리 스크럼 얘기 나눠보기

저녁 데일리 스크럼