서론
드디어 코드스테이츠 프론트앤드 부트캠프의 마지막 메인 프로젝트가 끝이 났다. 약 한 달 정도의 프로젝트 기간동안 팀원 6명 중 누구 하나 고생하지 않은 분이 없었다. 프로젝트의 결과물이 너무 소중하다..
사용자 경험을 해치는 무엇 하나라도 남겨두고 싶지 않아서 개발 기간이 끝나고 타시스템 분석 일정을 지나는 동안 피드백 내용들을 보며 팀원들과 여전히 일일 스크럼 하며 업데이트 중이다.
IT Prometheus - IT 교육 오픈 플랫폼
👉🏻 IT Prometheus 바로가기
👉🏻 Github Repository 바로가기
프로젝트의 컨셉은 '누구든지 학생이 될 수 있고, 누구든지 선생님이 될 수 있다' 이다.
강의는 누구나 등록할 수 있고, 누구나 원하는 강의를 무료, 유료로 수강할 수 있는 강의 오픈 플랫폼을 기획했다.
강의 등록 시 강의 영상 관련 정보와 문제를 등록할 수 있다.
강의 가격을 강사 마음대로 책정할 수 있고, 무료로 등록하는 경우에는 포인트가 적립된다.
수강생은 강의를 구매했을 때 지불한 금액만큼 포인트를 적립받고, 문제를 풀면 포인트가 적립된다.
포인트는 강의를 구매할 때 사용할 수 있고, 포인트를 모으면 회원의 티어가 높아진다.
프로젝트 기획
Daily Scrum & Project Kanban
매일 오전 9시~10시, 오후 5시~6시에 Daily Scrum을 진행하기로 했고, Github Project를 이용해서 칸반 보드를 작성했다. 또 기획 주간이 끝난 다음 주부터 매주 금요일 오후 4시에 개발자 테스트를 진행했다.
FrontEnd 프로젝트에서 사용할 기술 스텍
개발은 3명의 팀원이 모두 익숙한 React.js로 진행하였으며, persist로 쉽게 로컬스토리지에 원하는 전역 정보를 저장할 수 있는 Redux Toolkit을 이용해서 상태관리를 하기로 했다. 이번 프로젝트는 이커머스 플랫폼이므로, 꽤 많은 기능과 페이지를 개발해야 했기에 Storybook과 Figma Token을 적용해서 디자인 시스템을 관리해보기로 했다.
프로젝트 진행
좋았던 점
팀원간 원활했던 의사소통
우리 팀은 9시부터 6시까지 모두가 디스코드 방에 상주하면서 개발을 진행했고, 칸반 보드를 이용해 개발중인 기능을 상세하게 작성하면서 프로젝트를 진행했다. 매일 오전 스크럼 시간에는 오늘 할 일을 공유했고, 오후 스크럼 시간에는 오늘 한 일을 공유했다. 전체 스크럼이 시작되기 30분 전에는 프론트앤드 개발자들 끼리 스크럼을 했다. 이 시간에는 각자 개발한 부분까지 feDev branch에 PR을 올리고, Conflict가 있는 코드는 회의를 통해 수정했다. 모든 코드를 merge한 이후에는 간단한 테스트를 진행하면서 오늘 추가한 기능들에 오류사항이 없는지 확인했다.
styled component, design system을 이용했기 때문에 Design의 재활용과 통일이 쉬웠다.
React-Hook-Form으로 오류사항 없이 빠르게 입력폼 기능을 구현했다.
아쉬웠던 점
API 데이터를 저장할 때 상태 관리로 React-Query를 썼으면 좋았을 것 같다.
API 데이터를 불러와서 전역 상태로 저장할 때 우리 팀은 Redux-toolkit과 persist를 사용했다.
TypeScript로 개발했다면 더 좋았을 것 같다.
프로젝트는 규모가 상당히 컸다. 사용자 인증 / 강의 영상 CRUD / 문제 CRUD / 리뷰 CRUD / 기타 관리자용 기능을 구현하기 위해 매우 많은 페이지를 구현해야 했고, 수십개의 API의 응답을 state로 저장해야 했다.
List Item은 display:grid를 활용했다면 더 좋았을 것 같다.
