사이드 프로젝트 - forYourRecipe - 시작

www.no1recipe.com 

Recipe

 

 

 

동갑내기 사원 한 분이 있는데 학원에서 했던 결과물이 아쉽다고 비슷한 주제로 같이 만들어보자고 제안을 해주셔서 같이 해보기로 했다.

 

주제는 음식 레시피 관련된 반응형 웹 사이트 이다.

초기 버전의 경우 정말 간단한 CRUD 의 기능만 있는 게시판 형태의 사이트이다.

 

각자 맡은 업무도 있기도 하고, 처음부터 크게 잡으면 흐지부지될걸 알기에 빨리 할 수 있는 정도의 양으로만 정했다.

프론트 개발은 Vue cli 3, 백엔드 개발은 NestJs, DB는 MongoDB 를 사용한다.

스택은 현재의 회사 기술 스택에 맞춰서 진행하되 각자 추가하고 싶은게 있다면 언제든지 추가하는 방향으로 잡았다.

 

프론트와 백 초기 설정까지만 하고 나는 바로 디자인 작업에 들어갔다.

초기 컨셉은 귀엽게, 그리고 제안주신게 있는데 냉장고를 넣고 싶다고 하셔서 진짜 냉장고를 넣고 레이아웃 잡아나갔다.

 

 

 

피그마를 사용하여 디자인 작업을 처음 해보는데 생각 이상으로 재밌었다.

그리고 내가 생각한 이미지를 먼저 화면에 그린 후에 프론트 개발을 시작하니까 뭔가 정리도 잘 되는 느낌을 많이 받았다.

 

 

피그마 링크
https://www.figma.com/file/hu1xQru8mco6mdtEtzejEC/Cook?node-id=0%3A1&t=0Nx6WdcDlJBLGxFY-1 

Figma

 

 

* 그렸던 노랑노랑 디자인은 너무 귀엽다는 이유로... 변경되었다 .. 😭😭😭