본문 바로가기
Sesac 웹 풀스택[새싹X코딩온]/회고록 및 TIL

1차 프로젝트 회고록(새싹 냉장고)

by 이쟝 2023. 3. 2.

프로젝트 소개 

냉장고 식품 관리 및 식재료 기반 레시피 추천 서비스

프로젝트 목표 

보관 중인 식재료를 기반으로 레시피를 추천하고, 사용할 식재료 양을 확인할 수 있어 조리 중 낭비하는 식재료와 식사 후 남아서 버리는 음식을 줄인다. 

언제 어디서나 간편하게 냉장고 속 식재료를 확인할 수 있는 서비스를 제공해 중복 구매나 과소비를 방지한다.

유통기한, 구매 일자를 관리해 유통기한 임박 식재료와 경과 식재료의 알림을 띄워 버려지는 식재료를 줄이고 쾌적한 냉장고 환경을 조성한다. 

 

회고

이전에 팀 프로젝트를 진행했던 적이 있지만, 색다르게 Node.js 기반으로 팀프로젝트를 하면서 많은 것을 배우고, 느낄 수 있었던 시간이었습니다. 프로젝트를 진행하면서 어떤 어려움이 있었고 어떻게 해결했으며 무엇을 느꼈는지 정리해보겠습니다.

 

프로젝트 진행 과정

저희 팀은 총 4명으로 구성되어있고, 첫 프로젝트여서 백엔드 프론트엔드 구분없이 진행하였습니다. 

(저의 담당 부분: 레시피 페이지, DB 데이터 추가 및 DB 관리, 서버 배포)

저는 이미 전 교육과정에서 프로젝트 경험이 있었기에 공통 규칙 사항 및 프로젝트 폴더 구조를 잡으면서 팀을 이끌었습니다.

열정적인 팀원들 덕분에 특정 기능이나, 혼자 해결하기 힘든 오류를 맞닥뜨렸을 때 소통하며 서로 도와줄 수 있었습니다.

 

프로젝트 일정

12/10 - 12/13 와이어프레임 및 흐름도 작성, DB 모델링
프로젝트 진행 단계 및 일정 관리
필요 라이브러리 및 레퍼런스 파악
프로젝트 환경 셋팅(git hub)
12/14 - 12/25 개발 구현
레시피 웹 크롤링 및 DB 데이터 삽입 후 NCF로 서버 구축 및 공유 DB 연결
페이지 별 세부 콘텐츠 구현 및 로직 보완
부가 기능 확정에 따른 와이어프레임 및 DB 수정
기능 개발 시 생긴 오류 공유 및 해결 방안 도출
12/26 - 12/28 더미 데이터 수정 및 발표 준비
추가 데이터 크롤링 후 DB 데이터 삽입
팀 공유 정보 기반 PPT 생성
페이지 반응형 추가 구현
DB 데이터 정규화
서버 배포 후 오류 테스트
12/29 발표

프로젝트의 체계

이번 프로젝트를 진행하면서 예전 교육과정에서 했던 팀 프로젝트와는 달리 공통 규칙 사항을 가지고 매일 회의록을 작성하면서 그 날 있었던 일을 공유하며 진행하니 효과적인 개발 구현이 가능했었습니다.

프로젝트 공통 규칙 사항

github 규칙 사항

개발을 진행하는 브랜치는 develop 브랜치로 설정했고,  Pull Request를 해야지만 develop 브랜치에 merge 될 수 있도록 했으며, 자신의 로컬 브랜치에서 merge되면 리모트 브랜치가  자동으로 삭제되도록 했었습니다. 

이렇게 환경설정을 해놓으니까 충돌 나는 일이 훨씩 적었고, Confilct에 시간을 빼앗기는 일이 훨씬 적었고, 만약 충돌이 난다고 하더라도 로컬에서가 아닌 github 홈페이지(remote)에서 팀원들과 함께 수정해서 시간이 많이 단축되었습니다. 

 

프로젝트를 하며 느낀 점

이미 기존에 해봤던 기능들이나 새로운 기능들 다 쉬운 것이 없었습니다.

데이터 크롤링은 처음 해봤는데 크롤링을 해서 가져오는 데 성공했는데(물론 한 번에 성공하지는 않았습니다..) 그 다음에 이제 가져온 데이터를 정규화 하는 과정이 필요했기 때문에 밑에 사진처럼  DB 데이터를 정규화하는 틀을 만들어서 작업을 해서 원하는 데이터가 잘 나오게 수정했습니다.

이렇게 하니 DB 데이터가 한 눈에 보기 쉬웠고, 좀 더 정확하고 원하는 결과를 얻을 수 있었습니다.

또한 기능을 구현하기 위해서 로직을 생각할 때 흐름 시나리오를 생각해보며 먼저 메모장에 적으며 로직을 짜보았습니다.

예시로 레시피 페이지에서 요리하기 버튼을 눌렀을 때의 로직을 생각해서 구현해냈습니다. 생각해야 할 예외처리가 많이 생겨서 머리가 좀 아팠지만 로직을 구현해냈을 때의 기쁨은 말로 표현할 수 없었습니다.

 

레시피 페이지에서 요리하기 버튼을 눌렀을 때의 로직

더보기
- 레시피 페이지에서 요리하기 버튼을 누르는 액션(재료가 남는 다는 가정하에 비율은 0, 50, 100 이 세 개)

1. 레시피에 사용할 식재료 선택
if 재료의 비율이 100일 때, 체크 박스에 체크를 하고, 버튼을 누르게 되면, 무조건 비율이 50으로 줄어든다.
else if 재료의 비율이 50일 때, 체크 박스에 체크를 하고, 버튼을 누르게 되면 비율이 50으로 유지.
else 체크 박스에 체크를 하지 않을 시 validation 

2. 체크한 재료 중에서 남는 재료와 남지 않는 재료 선택
현재 체크한 재료는 모두 비율이 50.
if 체크한 재료가 남으면 비율이 50으로 유지.
else if 체크한 재료가 안남으면 비율이 0으로 되면서 DB에서 삭제

 

 

마무리

이번 프로젝트를 통해 Front, Backend, DB, 서버 배포에 대해 흐름을 더 자세히 알 수 있었습니다. 

다음 프로젝트는 React를 통해서 서버단과 프론트단을 아예 분리해서 할 텐데 이번에는 ejs로 해서 백에서 프론트 넘기고 그런 과정이 많이 어렵지는 않았던 것 같습니다.

지금 듣고 있는 이 과정 안에서 첫 프로젝트이다보니 열심히 하고자 하는 마음이 컸다보니 열심히 하게 되었던 것 같습니다. 배운 점도 많고, 같이 팀원들과 열심히 한 덕분에 1차 팀 프로젝트 대상을 받을 수 있었습니다. 

나만 열심히 하는 것이 아닌, 팀 프로젝트는 함께 열심히 하는 것이 매우 중요하다는 것을 느끼게 되었습니다. 그런 의미에서 이번 프로젝트는 결과를 떠나 성공적인 프로젝트 였던 것 같다고 느낍니다.