[반려견 미용 견적 서비스] PEAUTY 회고 및 리팩토링 방향성

프로젝트 소개

2024년 6월부터 12월까지  LG 유플러스에서 진행하는 유레카 SW 교육 과정에 참여했습니다.저는 유레카 교육 과정에서 프론트반을 수강하였습니다. 교육 과정 중 총 4번의 프로젝트를 진행하였는데 , 그 중 백엔드 반 수강생분들과 함께 협업을 진행하였던 최종 융합 프로젝트(2024.11.11-2024.12.19 총 6주 진행)에 대해 소개하려고합니다. 이번 경험은 기획부터 디자인, 개발, 그리고 서비스 배포까지 전 과정을 아우르며 실제 현업에서의 사이클을 그대로 체험해볼 수 있는 소중한 기회였습니다. 총 4가지 주제 중에서 팀별로 하나를 선택할 수 있었고 저희 팀은 ‘견적서를 이용한 반려동물 미용 중개 플랫폼’을 주제로 삼아 작업을 진행했습니다.

 

최종 융합 프로젝트의 경우, 선택한 주제에 따라 반드시 구현해야 하는 세부 과업이 주어졌습니다. 이 과업들은 LG유플러스의 현직 개발자분들께서 직접 제시해주셨습니다. 저희 팀에게 주어진 필수 기능은 크게 5가지로, 주요 항목은 다음과 같습니다.

   

   [세부 과업 상세 내용]

   1. 회원시스템: 소셜로그인을 통해 로그인 회원가입 할 수 있다.

   2.반려견 정보 및 미용사 프로필 관리 시스템: 반려견과 미용사 프로필을 등록하고 수정, 삭제할수 있다.

   3.결제 시스템: 미용 비용 결제에 PG결제 시스템을 적용하여 간편 결제를 지원한다.

   4.미용 후기 작성 및 관리기능: 반려견 미용 후 미용사에게 별점과 후기를 남길 수 있고 수정,삭제할 수 있다.

   5.미용 견적 입찰 시스템

   -고객은 반려견 정보와 요청 날짜, 지역을 선택하여 견적서를 요청 할 수 있다.

   -전달받은 견적서를 토대로 가격비교를 진행할 수 있고 견적서를 보낸 미용사들의 프로필을 확인할 수 있다.

   -고객은 원하는 미용사 견적서를 선택하고 비용 결제를 진행 할 수 있다.

   -미용사로 등록한 회원은 고객들로 견적 요청이 들어온 항목들에서 원하는 요청에 견적서를 보낼 수 있다.

 

세부 과업으로 주어진 것들이 많았기에 하나라도 놓치지 않고 꼼꼼하게 확인하기 위해 한 팀원이 정리해준 요구사항 명세서를 통해 기능의 중요도와 해야할 기능들을 명확히 파악할 수 있었습니다.

 

기능은 크게 5가지였지만 사실 상 저희가 개발해야할 서비스는 총 2개였습니다.

• 강아지를 키우는 분들이 이용하는 사용자 서비스 (메인)
• 애견 미용사분들이 이용해야하는 서비스 

볼륨이 큰 2개의 서비스를 구현하는 동시에 , 6주라는 기간동안 세부 과업도 빠짐없이 다 구현해야했습니다. 디자인도 진행해야하는 상황이였어서 최대한 스프린트 단위로 mvp 기능 위주로 진행하였습니다.

---

프로젝트  관리

아무래도 백엔드와 협업하는 프로젝트였기 때문에, 각자의 작업 진행 상황을 수시로 확인하고 공유하는 것이 무엇보다 중요했습니다. 모든 팀원이 어떤 작업을 진행 중인지 가시화할 필요가 있었고, 이를 위해 저희 팀은 스프린트 단위로 Jira 이슈를 생성하여 작업을 할당하고 체계적으로 관리했습니다.

또한 아래 사진처럼 Jira에서 할당된 이슈와 담당자, 진행 상황이 슬랙 채널에 실시간으로 연동되도록 설정하여 모든 팀원이 작업 현황을 즉시 파악할 수 있도록 했습니다. 이외에도 GitHub와 슬랙을 연결하여 팀원이 PR을 생성하면 슬랙을 통해  확인할 수 있게 하여 협업의 효율을 높였습니다.

 

 

 

 

---

프론트엔드 협업 방식

프로젝트의 개발 기간은 6주로 넉넉하지 않았기에 효율적인 협업 방식이 중요했습니다. 팀장 언니가 공통 컴포넌트와 디자인 시스템을 적용해보자고 제안해주었고, 저는 이번 프로젝트에서 처음으로 Storybook을 경험하게 되었습니다. 미리 공통 컴포넌트를 정의해두자 개발 속도가 빨라졌고, 팀원 간의 협업도 더 수월해졌습니다. 특히 Storybook을 활용하여 공통 컴포넌트를 문서화하고 시각적으로 확인할 수 있었기 때문에 컴포넌트 재사용에도 도움이 되었습니다.

 

 

        스토리북 배포 링크: https://674ed57ea9f6bd66479b5aba-tcxkpxiiqd.chromatic.com/?path=/docs/components-custombutton--docs

 

---

리팩토링 방향성

해당 프로젝트는 프론트엔드 4명, 백엔드 3명으로 구성된 팀으로 진행되었습니다. 하지만 프로젝트 진행 당시 프론트엔드 팀원 중 몇 명이 개인 사정으로 인해 제대로 참여하지 못했고, 결국 프론트엔드 인원 2명이 대부분의 기능을 구현해야 했습니다. 다른 팀에 비해 인원이 부족한 상황에서, 비교적 볼륨이 큰 프로젝트를 단기간 내에 완성해야했습니다.실제로 프론트엔드 구현 과정에서 디테일을 충분히 챙기지 못한 부분이 많았고 이에 대한 아쉬움이 컸습니다.프로젝트 종료 이후, 저와 팀장 언니는 이러한 아쉬움을 바탕으로 리팩토링을 진행하기로 결정하였습니다.

 

리팩토링의 방향성을 설정하기 위해 먼저 기존 프로젝트에서 아쉬웠던 점과 문제점을 정의하고 프론트엔드에 적용해보고 싶었던 개선 사항들을 함께 공유했습니다. 이후 각자가 정의한 문제점을 바탕으로 개선 방향을 고민하고 이를 실제 코드에 적용한 뒤 결과를 노션에 정리하고 발표하는 방식으로 리팩토링을 진행했습니다. 또한, 주제별로 최소 일주일 이상 충분히 고민한 후 직접 코드에 반영하는 과정을 거쳤습니다.

 

💡리팩토링 관련해서는 상세하게 작성할 내용이 많아 별도의 블로그 글로 작성할 예정입니다. 

리팩토링을 위한 문제점 정의