MenuMate 레시피 페이지(검색 결과 상세 페이지) 고민 사항들

 

검색 결과 카드는 음식의 이름, 이미지, 간단한 해시 태그 정도만 보여주고 있습니다.

본 프로젝트의 목적에 맞게 레시피 같은 상세 정보를 불러오기 위해서 검색 결과 카드에서 이어지는 검색 결과 상세 페이지, 레시피 페이지를 설계할 필요가 있습니다.

 

 

1.레시피 페이지의 역할 정의

사용자가 검색 시 나오는 검색 결과 카드를 통해 접근 가능한 상세 정보(기본정보, 재료, 조리 순서)를 확인하는 페이지

 

2. 라우팅 구조 정해보기

id를 기준으로 상세 데이터를 다시 조회하는 구조

리소스 중심 URL을 적용해볼지?

리소스 중심 URL: 동사(행동) 대신 명사(자원, Resource)를 사용해서 URL을 구조화 하는 방식

예시) /recipes/[id]

라우팅은 식별자 중심으로 하는 편이 단순

 

3. 데이터 전달 방식 결정하기

검색 결과에서 id만 넘기고, 레시피 페이지에서 재조회

 

4. 레시피 페이지 동작 순서

1. 사용자가 검색 
2. 검색 결과 카드 출력
3. 검색 결과 카드 클릭
4. /recieps/[id]로 이동
5. 페이지에서 id로 상세 데이터 요청
6. 레시피 페이지 화면 렌더링

5. 레시피 페이지에서 필요한 데이터 항목 정리

1차적으로 필요한 핵심 정보

• 요리 이름
• 대표 이미지
• 요리 종류?(검색 결과 카드에서 보이므로 고민)
• 재료
• 조리 순서(재료와 함께 레시피 역할)