오늘 뭐먹지?

공공 데이터 활용 레시피 조회 웹 어플리케이션

• 외부 프레임워크, 데이터베이스를 사용하지 않고 바닐라 자바스크립트로만 개발한 프로젝트

프로젝트 진행 기간

• 2023년 8월 21일 ~ 9월 22일

팀원 구성 및 역할

이름	담당 업무
윤보영	팀장, 메인페이지, 헤더, 푸터
이선우	오늘의 추천요리, 최근 본 레시피, 필터링 기능
장보근	스플래시 스크린, 레시피 인쇄 기능, 페이지네이션 기능
최정윤	레시피 조회 페이지, 레시피 상세 페이지, 북마크 기능 및 페이지

프로젝트 개발 환경

활용 API

식품 의약품 안전처 제공 - 조리식품의 레시피 DB : https://www.foodsafetykorea.go.kr/api/openApiInfo.do?menu_grp=MENU_GRP31&menu_no=661&show_cnt=10&start_idx=1&svc_no=COOKRCP01

프로젝트 배포 링크

https://cookcook.netlify.app/

프로젝트 실행 화면

스플래시 스크린 / 메인페이지 공공 DB로부터 데이터를 받아와서 로컬스토리지에 저장 후 메인페이지로 이동 상단- 검색창 & 북마크 페이지 버튼 카테고리 선택 섹션 / 오늘의 추천요리 (랜덤) / 최근 본 레시피

레시피 리스트 페이지 상단 탭의 카테고리 별 레시피 확인 / 특정 재료가 들어간 레시피 확인 / 특정 메뉴 레시피 확인

레시피 상세 페이지 음식칼로리, 북마크 저장 버튼, 음식의 사진, 저감조리법 tip, 준비물, 레시피, 인쇄버튼/이미지 가리기 버튼, 추천레시피, SNS 공유섹션

레시피 상세 페이지 추가 기능 인쇄 버튼 클릭 시 / 이미지 가리기 버튼 클릭 시 / SNS 공유 기능 중 카카오톡 공유 시

북마크 페이지 북마크 버튼으로 추가한 레시피들은 북마크리스트에 저장