Next.js 프로젝트

Next.js 심화 프로젝트 SEEWHAT 1

notion0896 2024. 12. 23. 09:21

우리 팀은 뮤지컬 상영정보와 공연장에 대한 정보를 알려주는 웹 사이트를 만들기로 했다. 

 

페이지 구성은 다음과 같이 구성할 계획이다.

  • Main 페이지
    • down scroll
    • 뮤지컬을 섹션별로 나눠서 보여지게 하기
    • 슬라이드로 뮤지컬 페이지 보여지게 하기
    • 전체 보기 → 뮤지컬 리스트 전체 보기
  • 뮤지컬 리스트 전체 보기
    • 뮤지컬 카드를 누르면 상세 페이지로 이동
    • top scroll
  • 뮤지컬 상세페이지
    • 공연 정보 (공연명, 공연 기간, 공연 시간, 관람 연령)
    • 각 공연 예매처 사이트로 이동
    • 공연장 위치 (지도 api - 위도, 경도 데이터 사용)
    • 출연진 정보
    • 공연 후기
  • 공연장 리스트 페이지
    • 공연장 리스트(공연장 이름, 위치)
    • 리스트를 누르면 공연장 리뷰를 볼 수 있는 페이지로 이동
    • 공연장 검색 기능?
  • 공연장 리뷰 페이지
    • 공연장 정보, 공연장 위치(지도)
    • 공연장 리뷰(후기)
  • 로그인, 회원가입 페이지
    • 소셜 로그인(?) => 가능하면
  • 마이 페이지
    • 프로필 변경
    • 닉네임 변경

여기서 나는 한 팀원과 같이 공연장 리스트, 공연장 리뷰 페이지를 맡게 되었다.

 

 

내가 맡게 될 페이지는 이 두 부분인데 우선 와이어프레임은 이런식으로 구성되어있다.

 

여기서 아마 제일  어려운 부분은 댓글 crud와 편의시설은 api 정보로 받아와서 아이콘으로 변환해주는 작업이 될것같다. 

 

지도는 한번 해봤으니 두렵지 않아...! (아마도..?) 

 

또 새로운 프로젝트 가보자고!!!