들어가며

4주 간의 프로젝트도 끝나면서, 프론트엔드 부트캠프가 마무리되었다. 그동안은 프로젝트에 집중하느라 블로그를 운영하지 못했다. 그래서 이제는 전체적인 프로젝트 후기를 남기고, 좀 더 세부적인 기술과 같은 세부사항은 포스팅을 하면서 이해하고 짚고 넘어가려 한다.

gitHub : https://github.com/sniperfactory-official/sfac-lms-team-b
베포 : https://lms-b.sniperfactory.com/

위의 페이지가 만든 홈페이지다. 혹시나 이용해보고 싶으신 분이 계신다면, 댓글을 남겨주시면 됩니다.

프로젝트 전체사항

이번 프로젝트는 7팀이 하나의 학습관리시스템을 만드는 프로젝트였다. 태스크는 총 5개로

1. 디자인 시스템 제작/베포
2. 자체 비디오 플레이어 제작
3. 과제방(과제 제출/수정/삭제 등)
4. 강의실 (강의 제작, 강의 수강 등)
5. 마이페이지 및 커뮤니티 제작

이렇게 나누었다. 그 중에서 3번과 4번 태스크를 a팀 b팀으로 나눠서 제작했다. 그래서 1, 2, 5번 태스크는 한 팀씩 맡아 진행하고, 3, 4번 태스크를 두 팀씩 진행하여 총 7개의 팀이 하나의 프로젝트를 진행했다.

협업 툴(Tool)

많은 인원이 한 프로젝트를 진행하다보니, 하나로 통일되어 프로젝트를 진행하는 것이 굉장히 중요했다. 그래서 크게 2가지로 나눠서 협업 툴을 사용했다. 전체적인 흐름을 다루는 부분, 팀적으로 흐름을 다루는 부분 이렇게 두 가지 방식으로 나눴다.

전체적인 흐름

전체적인 흐름이란 팀의 소통 방식이나, git에 commit을 하는 방식이라던가, code의 습관이라던가 하는 부분이 있었다. 그래서 이 부분을 통일한 방법으로는

1. husky
2. prettier
3. slack

이렇게가 있다. 우선 husky란 commit 컨벤션(약속)을 할 수 있도록 하는 도구다.

이와 같이 commit 컨벤션을 설정했다. 위와 같은 방식으로 커밋을 하지 않으면 오류가 나면서 커밋을 할 수 없게 된다.

prettier는 작성한 코드를 깔끔하게 정리해줘 코드의 가독성을 높여주는 vsCode의 익스텐션이다. 이를 통해 코드를 commit하고 정리가 안되어 있으면 자동으로 문서를 정리해줘 다시 commit을 해야 했다.

마지막으로 slack은 팀 소통을 하는 애플리케이션이다.

사진과 같이 대화방을 만들어서 계속 소통하며 하나의 프로젝트를 만들어갔다.

팀적으로 사용한 툴

나의 팀과 팀이 속한 b팀은 협업을 위해 오프라인 미팅과 gitHub와 Notion을 적극 활용했다.

Notion은 팀적으로 활용했다. 매 주 목요일마다 그 다음 주 목요일까지의 해야 할 목표를 칸반보드로 정리하고 서로의 진행상황을 파악했다.

또한 전체적인 팀 b로는 gitHub의 issue와 projects를 활용하여 팀 간의 소통을 진행했다.

사진과 같이 많은 이슈를 정리하고 확인하며 전체 프로젝트의 흐름 파악이 가능하고, 어떤 사람이 어떤 역할을 맡아 어떤 기능을 만들고 있는지 파악이 가능하여 서로 간의 협업이 가능했다.

사용한 기술 스택

1. Typescript
2. React
3. Nextjs
4. TailwindCSS
5. Firebase / eraser.io

크게 봤을 때, 사용한 기술 스택은 위와 같다. Typescript 언어를 활용함으로써 명확하게 어떤 에러가 나올 지 파악이 가능했다. Tailwind는 처음 사용할 때, 왜 이걸 사용하는지에 대한 의문이 가득했지만, 사용하면 할수록 의문이 이해로 바뀌었다. eraser로 ERD를 제작하고, Firebase로는 물리적인 DB를 제작하여 실제 데이터를 넣어보는 작업을 진행했다.

이렇게까지가 프로젝트의 전체사항이다. 꽤 다양하고 복잡하고 많지만 하나하나 살펴보면 크게 어렵지는 않았고, 재밌게 프로젝트를 진행했던 거 같다.

나의 역할

이번 프로젝트에서 나의 역할은 DB설계 및 강의장 페이지 개설이었다. DB설계는 각 팀의 DB설계자를 한 명씩 뽑아서 함께 전체적인 프로젝트의 DB설계를 진행했다. 강의장은 강의를 수강하는 장소다.

강의장은 이렇게 되어 있는데 그게 강의부분과 강의 커뮤니티로 나눠서 차차 설명을 해보려 한다. 나는 이 페이지 전부를 담당해서 만들었고, 주로 이를 중점으로 포스팅을 할 예정이다.

앞으로

앞으로는 내가 이번 LMS 프로젝트를 진행하면서 사용했던 모든 것들을 다시 한 번 되새김하면서 포스팅을 하려 한다.

포스팅은 큰 기능에서 부터 세부적인 기능으로 파고들며 기록할 것이다. 또한 주로 기능별로 나눠서 작성하려 한다.

마무리

4주간의 프로젝트, 10주간의 부트캠프가 끝이났다. 처음으로 진행해 본 대외적인 프로젝트이고, 프론트엔드 부트캠프였다. 프로젝트에 대한 기본적인 이해가 있었기 때문에 너무 어렵지는 않게 진행할 수 있었다.

가장 좋았던 점은 다른 사람들과 함께 프로젝트를 진행했다는 점이었다. 정확하게는 협업을 했다는 점이다. 지금까지 협업을 진행했다고 할 수 없을 정도의 프로젝트만 진행을 했었는데, 이번에 다양한 사람들과 이야기를 하면서 프로젝트를 진행할 수 있었던 점이 최고의 이점이었다.

뜻이 맞는 사람들과 함께 진행했기 때문에 더욱 시너지를 발휘했다. 내가 부족한 점도 계속해서 피드백을 받을 수 있었고, 지속적인 대화를 통해 서로가 프로젝트를 이해하고 있는 점을 공유하고 좋은 결과를 만들어 낼 수 있었다는 점이 매우 뿌듯했다.