프론트엔드 + 백엔드 함께 협업한 미니프로젝트 | 패스트캠퍼스 부트캠프

현미·2023년 6월 2일
0

패스트캠퍼스의 프론트엔드 부트캠프는 6개월 과정으로 진행되는데요. 프로젝트만 3~4개를 진행할 정도로 빡센(!) 커리큘럼으로 구성되어 있습니다. 그중 미니프로젝트는 처음으로 백엔드 과정 수강생들과 함께 협업한 시간이었습니다. 이번 글에서는 미니프로젝트가 어떻게 진행되었는지 소개해 드릴게요.

요약

  • 싱크업 미팅 : 2023년 4월 25일(화) - 4월 28일(금)
  • 개발 기간 : 2023년 5월 2일(화) - 5월 19일(금)
  • 결과물 제출 : 2023년 5월 16일(화) ~15:00까지
  • 발표회/공유회 : 2023년 5월 17일(수) - 2023년 5월 19일(금)
  • 진행장소 : 온라인(줌) / 오프라인 강의장

미니 프로젝트의 개발 기간은 5월 부터인데 그전인 4월 말에 싱크업 미팅을 하는 시간을 가졌어요. 다른 과정을 듣는 수강생들과 한 팀을 이루어 진행하는 프로젝트여서 소통을 좀 더 할 수 있도록 운영진이 일정을 신경써 준 덕분이었습니다.

싱크업 미팅에서는 미니프로젝트 팀별로 노션페이지를 생성하고, 팀장 선출 및 역할 분담을 하였습니다. 그리고 프로젝트에 대한 구체적인 기획하는 시간을 가졌어요. 서로 어떤 걸 생각하는지 의견 교환을 하며 조율하는 시간이었습니다. 기능 정의와 화면을 설계하면서 어떤 Data와 API가 필요할 지 파악도 했고요.

주제

프로젝트를 진행할 때 가장 중요한 항목은 아무래도 '주제'겠죠? 이번 미니 프로젝트의 주제는 '연차/당직'이었습니다. 기본적으로 구현할 기능으로 주어진 것은 아래와 같고요.

  • 로그인/회원가입 페이지
  • 개인정보 수정 페이지
  • 월별 캘린더 제공
  • 연차와 당직 등록
  • 비밀번호 단방향 암호화

추가적으로는,

  • 월별 캘린더를 주간/일간 등 다양하게 표현
  • 캘린더에서 액셀 다운로드
  • 리액트의 컴포넌트 렌더링 최적화
  • Refresh Toekn 생성&활용
  • API 문서화 (스웨거 이용)

진행

프론트엔드에서는 설계한 화면을 기준으로 UI/UX를 먼저 만들기 시작했고, 백엔드에서는 인증 기능과 테이블/필드 설계를 했습니다. 모든 프로젝트는 항상 일정이 쫓기게 되는데 원활한 진행을 위해 초반에 소통하는 데 많은 시간을 썼습니다.

결과

2주라는 짧은 구현기간이 믿기지 않을 정도로 좋은 결과물을 낸 팀이 많았습니다. 그중에서 가장 인상적이었던 팀은 LUPIN 일정관리 프로그램을 만든 5조였어요.

회원가입과 로그인, 개인연차와 당직신청 및 취소와 같은 기본 기능을 모두 구현하였고, 그밖에 실시간 알람과 어드민 페이지 기능을 추가해 프로젝트의 완성도를 높였습니다.

알람 기능에 대해 비교적 기획을 세세히 해서, 사원은 자신이 신청한 연차나 당직이 승인 또는 거절될 때 알람을 받을 수 있게 했습니다. 관리자도 사원이 연차나 당직을 신청하면 알림이 가도록 했고요. 알림에 대한 읽음/안읽음 처리도 구현했습니다.

어드민 페이지에서는 연차/당직 목록을 관리자에게 보여주고 이에 대한 처리를 할 수 있게 했으며, 사원을 검색해 사원의 직급을 변경하거나 연차 일수를 조정하는 기능도 넣었습니다.

profile
프론트엔드 공부 중

0개의 댓글