[Ez to Play / Function] 23.06.30 1주차 멘토링

FE 1주차 멘토링 내용

추천 스택

• Next.js (리액트에서 SSR 하기 위해, 서버컴포넌트 이해하면 좋음 근데 어려움)
• Typescript
• zustand
• recoil
• vercel(배포)

추천 발표 주제

• react-hook-form
  • 이러한 라이브러리가 생긴 이유
  • 이 라이브러리를 선택한 이유
• Github Actions
• 서버컴포넌트
• 지도 마커 이쁘게 꾸며서 띄우기 (네이버 지도 맡은 사람이 하기)
• 지도 선택(의사결정과정 - 카카오, 구글, 네이버 중 왜 이걸 선택했는가)
• 스토리북 지금은 빠듯, font color input textarea 만들어놓아도 충분
• zustand 

모바일 퍼스트 (mobile first)

• PC 뷰포트보다 모바일을 우선으로 하여 구현
• 반응형으로 설계하여 태블릿, PC까지 커버하기
• Progressive Web Apps(PWA)

아티스트 검증

• 아티스트 프로필 받기 -> 검토중 -> 운영팀에서 직접 컨택 후 승인 -> 승인 후 공연 등록 가능

Admin

• 결산페이지 등 Ex) 수수료 떼고 2주 후 정산
  • 결제 정보를 추적 관리할 수 있는 페이지가 있어야 함

최소 기능

• 로그인, 카카오연동, 아티스트등록, 공연등록, 지도, 장르별 필터기능, 무한스크롤, 후기, 결제(후순위)

UX 우선순위

1. 각종 입력 양식
2. 지도로 편하게 확인할 수 있게 하기
3. 후기* → 현재 우선순위가 낮은데 빠지면 너무 아쉬움

권장사항

• 폰트, 색깔 테마 정하기
• 버튼(3~4개), input(1개) 공통 컴포넌트로 만들어놓고 시작할 것
• 필요하다면 textarea도 만들기
• Row Container, 체크박스 정도까지 만들면 더 좋음
  • Row Container: 기본 레이아웃 관련된 속성만 사전에 정의된 div

생각해 볼 점

• 무료 공연의 경우 예약 절차를 어떻게 처리할지 논의 필요
• 아티스트의 공연 정보에 이전 후기가 보이도록 할 것인가? (서비스에 있어서도 사용자에게 있어서도 후기가 중요)

 

---

멘토링 후 변경된 피그마 디자인

(전前) 

변경 전 디자인

(후後) 1차 수정

1차 수정을 거친 디자인

 

(후後)최종

최종 디자인