[회고] SSAFY 공통 프로젝트 회고

기간

2022.07.11 ~ 2022.08.19

 

팀원

백엔드 3

프론트 2

 

서비스 개요

기본적으로 webRTC를 이용한 화상 미팅 서비스입니다.

여기에 회의록을 자동 생성해주는 서비스를 탑재하였습니다.

 

서비스 로직

1. webRTC를 이용해 화상 미팅을 합니다.
2. WEB Speech API를 이용해 사용자들의 대화를 데이터화 합니다.
3. 대화 내용 데이터를 KOMORAN을 통해 형태소를 분석합니다.
4. 정제된 데이터를 이용해 ASPOSE를 이용해 자동으로 워드 문서를 작성해, 메일로 보내줍니다.

 

주차별 활동

1주 차

1주 차는 주로 아이디어 회의, 프로젝트 기획을 주로 하였던 것 같습니다.

5일 중, 2일 정도는 주제 선정을 위한 아이디어 회의가 이어졌던 것 같고 3일 정도 아이디어 실현 가능성, 어떠한 기능이 필요한지에 대한 기획이 이루어졌습니다.

 

2주 차

기획한 것을 기준으로, 요구사항 정의서, 프로토타입, API 명세서, ERD 설계에 집중하였습니다.

 

3주 차

프로토타입을 바탕으로 기본적인 UI들을 구성하고, 회원과 관련된 API를 작성하는 시간이 이루어졌습니다.

 

4주 차

SSAFY에서 지급된 도메인과 Docker, aws를 이용해 서버를 배포하고 openvidu 관련 기능, 로직을 구현하였습니다.

 

5주 차

stt, komoran, aspose를 이용한 자동 문서화 작업 관련 구현을 하였습니다.

 

6주 차

5주 차에 못 끝낸 구현들을 마무리하고, README 작성, 발표 준비를 위주로 진행되었습니다.

---

나의 역할

주로 화면을 구성하고, 백엔드에서 만든 API들을 사용하여 프론트단 화면에 녹여내는 작업을 하였으며, 프론트 상태(회원, openvidu)들을 관리하였습니다.

 

기억에 남았던 작업들

1.

recoil은 리엑트의 클래스형 컴포넌트에서만 작동하는 단점이 있었는데,,

openvidu 리엑트 레퍼런스 예시들이 모두 클래스형 컴포넌트로 작성되어 있었습니다. 

openvidu와 recoil을 한 번에 녹여내기 위해서 openvidu 예시들을 모두 함수형 컴포넌트로 바꿨던 작업이 기억납니다.

처음에는 힘들고 굉장히 많은 작업량이 예상되었지만, 생각보다 금방 했던 것 같습니다.

 

2.

useState 안에 값이 배열일 때, 변경을 추적하지 못한다는 것.

이 것을 프로젝트하면서 알게 되었습니다. 

객체는 주소를 저장해서 추적하지 못하는 것이었는데, 이를 캐치하지 못해서 좀 오래 고민하여 기억에 남습니다.

 

3.

Material UI를 사용하여 프로젝트를 진행하였는데, 채팅창을 구현하고 있는데 채팅을 입력할 때마다 채팅 스크롤바가 초기화되는 에러가 있었습니다.

로직상 문제가 없어서 한참을 고민하였던 기억이 납니다.😢

이유는 material-ui에서 가져온 컴포넌트 안에 스크롤 관련 설정이 고정되어 있어서 내 마음대로 커스텀하기가 불가능하였던 것으로 보입니다.

이러한 에러들을 거치면서 역시 최고의 선택은 css프레임워크보단 직접 작성하는 게 좋다고 느꼈습니다.(시간이 허락한다면 ㅎ)

 

4.

입력 유효성 검사

유효성 검사를 하며 regex 이해도가 높았으면 좋겠다고 생각을 하였습니다.

매번 얕게만 공부하다 보니 regex 관련 지식이 휘발되는 점이 없지 않아 있었는데, 이번 기회에 regex를 좀 단단히 공부해야겠다고 생각했습니다.🤦‍♂️

 

프론트엔드 기술 스택

react

react-router

axios

recoil

typescript

material UI

 

번외 

Jira

git

Mattermost

---

프로젝트를 하며 좋았던 점

1.

컴퓨터 공학을 졸업하였지만, 2,3명이서 프로젝트를 해보기만 했을 뿐, 이렇게 많은 사람과 프로젝트를 해본 것은 처음이었습니다. 다수와 프로젝트를 하다 보니 자연스럽게 JIRA, GIT 같은 협업 필수 툴에 익숙해져 git flow, git branch 전략 같은 개념들이 이제는 내 것이 된 것 같은 느낌이 들었습니다.

 

2.

openvidu와 같은 새로운 라이브러리를 이용해 webRTC기술을 사용해본 것이 좋은 경험이 되었습니다.

 

3.

recoil, material Ui는 이번에 본격적으로 처음 써보았는데, redux보다 훨씬 편하다는 느낌을 받았습니다.

보일러 플레이트 부분을 최소화하여 이전에 써보았던 vuex보다 초기 세팅이 너무 편하다고 느꼈고 상태 관리도 편하다고 느꼈습니다.

 

 

프로젝트를 하며 아쉬운 점

1.

프로젝트를 시작할 땐, typescript를 쓰기로 마음먹고 공부하며 프로젝트를 진행하기로 하였습니다.

하지만 프로젝트 개발기간 동안 openvidu, stt, recoil, react 클래스형, materi UI 등등 공부할 개념들이 너무 많아서 any타입만 남발하게 되었습니다.😒😒

위에서 언급한 개념들이 어느 정도 익숙해졌기 때문에, 다음 프로젝트에서는 typescript도 공부하여 적용해보고 싶습니다.

 

2.

typescript와 마찬가지로 테스트 코드를 아예 작성하지 못하였습니다. 다음 프로젝트에서는 테스트 코드도 함께 작성해보고 싶습니다.

 

3.

프로젝트를 진행하다 보면 초기 기획과 다른 기능들이 많이 새로 생기기 마련인데, 이에 100% 대응하지는 못하였던 것 같습니다. 항상 코드를 짤 때 확장성을 생각하며 코딩해야겠다고 생각했습니다.

 

 

프로젝트가 끝난 후 느낀 점

1.

팀원들이 다들 성격이 좋아서 즐겁게 프로젝트를 할 수 있었고, 무언가 의견 충돌이 있어도 서로 배려하고 의견을 존중하여 유연하게 지나갔던 것 같습니다.😊

 

2.

처음 프로젝트를 시작할 때는 기획을 보며 WebRTC, recoil,... 뭐 이런 새로운 기술들에 겁먹고  프로젝트를 완료할 수 있을지 걱정이 되었습니다. 그러나 팀원들과 하나씩 공부하니 성공적으로 구현할 수 있었습니다. 새로운 기술들에 대한 자신감이 생겼고 뭐든지 시간을 투자하면 될 것 같은 느낌이 듭니다...😎😎😎😎

 

3.

순간순간에는 나의 성장이 느껴지지 않을지 모르지만, 몇 개월 전의 저와 비교하면 많은 성장을 한 것 같아서 뿌듯합니다.

 

4.

이러한 기회들을 제공해준 SSAFY에게 고마움을 느끼고 있고, 어떻게 갚아야 하나 종종 생각하곤 합니다.