프로젝트 소개

​

• 프로젝트 명 : Kurmmunity
• 마켓컬리 KURLY HACK FESTA 2022 참여 프로젝트
• 기간 : 22.07.25 ~ 22.08.24(개발 기간 : 22.08.19 ~ 22.08.24)
• 개발 인원 : 3 Front-end, 1 Back-end

Kurmmunity는 마켓컬리 회원들이 각자의 레시피와 생활 팁 등을 공유할 수 있는 커뮤니티 사이트를 개발하고자 했다. 하지만 개발 기간이 짧아 레시피만을 위한 커뮤니티 사이트를 필수 구현으로 진행했다.

Kurmmunity는 마켓 컬리에서 판매하는 원재료나 제품들을 통해,고객들이 직접 요리를 제작하고 본인들의 레시피를 공유 하면서 고객들끼리 본인들이 원하는 정보와 제품을 추천할 수 있다는 순기능이 있다. 또한, 베스트 게시글이나 레벨제 와 같이 지속적인 커뮤니티 활동을 하는 사용자의 경우에는 적립금, 경품과 같은 혜택들을 부여하여 고객 유치의 지속성 역시 기대해볼 수 있다.

작업 기간

​ 2022.08.19 ~ 2022. 08. 24 ​

팀명

​ 보리꼬리 (BoriKKori) ​

팀원 소개

​

개발 분야	팀원 명
프론트엔드	김형겸, 김형석, 손가영
백엔드	임한구

​ 백엔드 github - ​ https://github.com/nicholas019/maketkurly-borikkori-backend ​

기술 스택 및 핵심 기능

​ ​

데모 영상

https://www.youtube.com/watch?v=Bk5nmkSkW0U&t=2

​

프론트 엔드 업무 파트

	Main
설명	- 베스트 레시피, new 레시피 카드 형식으로 react-slick 라이브러리 사용한 캐러셀 기능 구현 - 관심사의 분리(view, 비즈니스 로직 분리)와 추상화 생각하며 코드 작성

	레시피 작성페이지
설명	- 음식 종류, 요리 순서, 구성 재료, 요리 과정 등을 누구나 쉽게 작성할 수 있는 템플릿 기능 구현 - 각각의 데이터 state에 저장 후 form-data를 사용하여 한 번에 서버로 전송 - 각 객체를 추가할 수 있으며, 각각의 input에 값 저장 기능

	레시피 상세 페이지
설명	- 사용자가 작성한 레시피 내용을 불러와 상세페이지에 나타나도록 구현 - 댓글기능에 질문/일반 댓글 라벨링으로 작성시 구분해서 표시 - 질문에 대한 답변이나 일반 댓글에 대한 반응으로 대댓글 기능 구현

	회원상세페이지
설명	-정보를 알고 싶은 유저를 클릭하면 해당하는 회원 상세페이지가 보여지도록 구현 -회원 고유의 아이디 값을 받아와서 각각 회원에 따라 다른 회원정보를 나타냄 -작성한 레시피와 작성한 후기 두가지의 탭으로 나눠 엔드포인트에 따라 적정 데이터를 받아올 수 있도록함

	BEST
설명	- 회원 레시피에서 특정 조건 충족시에 베스트 게시판으로 이동 - Infinite Scroll을 통한 데이터 호출

	회원레시피
설명	- 각 음식 종류별, 상황별 필터링 적용 - 제목, 내용, 제목 + 내용별 검색 기능 구현 - path parameter를 통해 해당 레시피의 디테일 페이지로 routing 구현

	컬리의 레시피
설명	- 각 음식 종류별, 상황별 필터링 적용 - 제목, 내용, 제목 + 내용별 검색 기능 구현 - path parameter를 통해 해당 레시피의 디테일 페이지로 routing 구현

​

협업 도구

​ Trello

​

Coding Convention

​

1. 들여쓰기는 tab, 혹은 공백 문자 2개를 사용한다.
2. 변수와 함수, className 명명 규칙은 Camel Case를 사용한다.
3. 값이 변하지 않는 변수는 const를, 값이 변하는 변수는 let을 사용하여 선언하고 var는 절대로 사용하지 않는다.
4. 함수 선언시 arrow function(() => {}) 위주로 사용한다.
5. 주석은 코드 설명보다는 수정 사항이나 미구현 사항을 기재할 때 사용하기로 한다.
6. 함수 네이밍 규칙은 해당 함수의 동작을 앞에, 동작이 적용될 태그를 뒤에 위치하게 작명한다. (ex) handleInput)
7. component의 전체를 감싸는 최상단 태그의 className은 컴포넌트 이름으로 명명한다. (ex) product, productlist)
8. 인라인 스타일링은 지양한다.