DevCamp | 패스트캠퍼스 프론트엔드 부트캠프 첫번째 토이 프로젝트 후기

JOY·2024년 11월 16일

DevCamp

목록 보기
8/17
post-thumbnail

부트캠트 수강 후 정식으로 한 첫번째 코딩 프로젝트에 대해 후기를 적어보겠습니다. 부트캠프 수강에 관심이 있는 분들께 도움이 됐으면 좋겠다는 마음에서 느낀점을 솔직히 적어보겠습니다!!


📂 프로젝트 요구사항

UI 라이브러리 또는 CSS 전처리기를 사용하지 않고 HTML, CSS, JavaScript로 인트라넷 서비스를 관리자용, 사용자용으로 나눠 개발하는 미션을 받았습니다.
10월 16일(수) ~ 11월 07일(금) (약 3주) 동안 진행했습니다.
CRUD가 가능한 프로필 수정 페이지, 페이지네이션, JavaScript DOM event 조작 등 필수 요구사항과, 회원 시스템 기능(회원 가입, 로그인, 로그아웃), ESLint 설정, Commit Convention, 문서화 작업 등 선택 요구사항이 있었습니다. 거의 모든 팀이 선택요구사항까지 진행하는 분위기였습니다 🔥


🚀 프로젝트 진행 과정

1. 팀 결성 (2024.10.16)

팀은 랜덤으로 4~5명씩 지정했습니다. 프로젝트 첫날 피어세션을 진행하며 아이스브레이킹을 했습니다. 저희 팀은 대부분이 전공자로 구성돼있고 현업을 경험하셨던 분도 있어서 굉장히 든든했습니다. 더 열심히 도움이 되고 싶은 마음이 커졌습니다 💪

매주 월,수,금 오전 10시 데일리 스크럼을 진행하자고 정했으나 사실 프로젝트 기간동안 매일 회의를 진행할 수 밖에 없었습니다ㅎㅎ 부트캠프 시간인 10~19시까지는 모두 자리를 비우지 않고 궁금한 게 생기면 바로 질문하고 답하는 식으로 진행했습니다.

2. 기획 (2024.10.16 ~ 2024.10.18)

전체적인 서비스를 구상하고, 컨셉 기획을 했습니다.

3. 피그마 작성 (2024.10.20~2024.10.22)

피그마로 디자인 작업을 하며 서비스의 구체적인 기능과 필요한 데이터를 정립했습니다.

4. 퍼블리싱 (2024.10.23~2024.10.28)

역할을 분담해 페이지별 퍼블리싱 작업 위주로 개발했습니다.

5. 기능 구현 (2024.10.29~2024.11.1)

역할을 분담해 전체적인 기능을 보완하고 서버를 연동했습니다.


💫 우리 팀의 프로젝트

1. 프로젝트 소개

저희 팀은 먼저 어떤 회사의 인트라넷 서비스를 개발할지 컨셉을 잡고 시작했습니다. 부트캠프를 수정하며 출결관리에 대한 불편함을 느꼈다는 점에 팀원 모두 공감했습니다. 그래서 효율적인 수강생 관리와 소통을 위한 가상의 학습 플랫폼 회사 도파밍의 인트라넷 서비스를 개발했습니다.

2. 우리의 컨벤션

짧은 기간동안 크게 페이지 단위로 나눠 개발하기로 해 컨벤션을 설정하지 않으면 가독성과 유지보수성이 크게 저하될 것이라 예상했습니다. 그래서 이슈 템플릿, pr 템플릿, project같은 깃허브 설정을 해두고, 코드 컨벤션을 정했습니다. 코드 컨벤션을 열심히 정해 두고 그냥 안 지키면 의미가 없기 때문에 설정한 정책을 강제적으로 지키도록 하기 위해 husky를 사용했습니다.
파일 컨벤션, 코드 컨벤션, 커밋 컨벤션, 브랜치 전략, CSS 스타일 가이드를 정립했습니다.

그 외 자세한 사항은 아래 링크를 참고해주세요
https://github.com/duwlsssss/DOPAMING/blob/main/README.md


✨ 솔직 후기

국비지원 부트캠프를 하면 공장에서 찍어 낸 것 같은 프로젝트만 해 메리트가 없다는 말을 종종 들었습니다. 이번 프로젝트를 하며 무슨 뜻인지 조금은 이해가 갔습니다. 다른 분들 후기를 찾아보니 매 기수마다 공통 주제로 프로젝트를 하는 것 같더라고요. 그래서 더 탐구하고자 하는 욕심이 없다면 다 똑같은 포트폴리오가 될 것입니다.

저희 팀은 최선을 다했다고 생각했으나 현업을 경험해본 분이 있는 다른 팀의 결과물을 보고 부족함을 많이 느꼈습니다. 이번에 배운 걸 자양분으로 다음에 적용하며 더 발전해나가면 되겠죠!!

짧은 기간내에 동시로 개발하는 프로젝트라 컨벤션과 문서화가 중요하다고 생각했습니다. esLint prettier의 도움을 받아 코드를 일관성있게 포맷팅했으나
DOM 조작을 다양하게 하고, 중복되는 코드가 많이 보이는 문제가 있습니다.
각자 페이지를 개발하면서 필요하면 컴포넌트를 만들고 공유하자 했으나 이 부분이 잘 공유되지 않았고 마음이 급해서 그런지 남의 코드를 그대로 갔다 쓰면서 컴포넌트화 제안은 안하는... 사태가 발생했습니다.

또 팀원이 5명이면 수월하겠지 생각했는데 피그마 작성 때부터 한 분이 아무것도 참여하지 않아서 ㅎㅎ
언젠가 이런 일도 생길 것이라 예상은 했지만 한 명 빠진 게 타격이 좀 있었습니다 ㅜㅠㅜ

PR을 올리고 다른 사람의 허락을 받고 코드를 머지하는 습관은 좋았습니다.
하지만 이 과정에서 마음이 약한 저는 리팩토링을 더 적극적으로 제안하지 못했습니다... 이 점도 아쉬움으로 남네요

또한 따로 방법론에 대한 이야기를 나누지 않았고 폭포수 모델로 진행했는데
너무 큰 범위로 작업을 나눠 PR 내용도 명시적이지 않고, 파악이 어렵다는 아쉬움이 있었습니다. 멘토님께서도 PR 제목이 너무 모호하다는 지적을 하셨습니다.

프로젝트를 작은 부분으로 나눠 각 스프린트에서 구현 과정에 따라 설계를 조금씩 수정하고 싶다고 생각했습니다.
특히 프로젝트가 얼마나 망했는지 아는 게 중요하다고 생각하는데 이걸 다들 쉬쉬하는 분위기였습니다.
항상 느끼는데 사람들은 자신을 객관적으로 표현하는 데 큰 거부감을 느낍니다. 하지만 이를 넘어서야 더 적은 노력으로도 최상의 결과를 얻을 수 있다고 생각합니다. 앞으로 나아가는 것도 중요하지만 프로젝트가 잘못됨이 보일 때 그걸 빨리 알아차려야 더 나은 결과로 이어질 것입니다,
프로젝트가 다 끝나고 KPT회고를 했는데 이것도 더 짧은 주기로 반복했으면 좋았을 것이라 생각했습니다.

다음 프로젝트에선 개발 방법론에 대해 이야기를 해보는 시간을 꼭꼭!! 가질 것입니다.

profile
모든 일에 진심을 담아서

0개의 댓글