MANNALGA 코드 오픈
안녕하세요 에릭입니다.
오늘은 8개월간 진행한 사이드 프로젝트를 여러분께 소개하러 왔습니다!
MANNALGA는 사람들과 모임을 밀접하게 연결해주는 서비스입니다.
이 프로젝트는 학습을 목표로 제작한 프로젝트입니다.그만큼 학습을 목표로 진행하는 사이드프로젝트를 어떻게 시작하고, 어떻게 진행하면 좋을지 참고할 수 있도록 저희가 진행한 모든 과정을 오픈하고자 합니다
개발 팀원
| Eric | Project leader & Backend developer |
| Sight | Backend developer |
| Pompitzz | Frontend developer |
| 030ii | Designer & Frontend developer |
우리가 보여주고싶은 것들
Frontend가 궁금하신가요?
기술 스택
Typescript, Vue, Vuex, Vuetify, Axios
Quick Link!
Architecture
Backend가 궁금하신가요?
기술 스택
Kotlin, Spring boot, JPA, QueryDsl, Github Action, Docker, AWS RDS, JWT
Quick Link!
Security 구조
Spring Security + JWT + Kakao OAuth를 모두 합쳐 구성하고 있습니다.
모든 요청에 대해 Stateless하게 작동하는 서비스를 제작하기 위하여 세션 및 상태를 전혀 사용하고있지 않습니다.
이를 위해 MANNALGA에서는 다음과 같은 인증 프로세스를 따르고 있습니다.
[Authentication 획득 과정] 1. FRONTEND에서 카카오 로그인을 통한 KAKAO TOKEN 생성 2. 생성한 KAKAO TOKEN을 API서버로 전달 3. API서버에서 자체적인 APP TOKEN을 생성하여 반환. 이후 요청값에 APP TOKEN을 포함시켜 요청하면 인가.
우리가 협업한 방법
비대면 협업을 위한 Open Working
우리는 주 1회 스크럼을 제외한 작업은 모두 각자의 남는 시간에 진행하기 때문에, 현재 어떤 작업이 완료되었고 어떤 작업을 진행중인지 서로 확인할 수 있는 방법에 대해 고민하였습니다.
이를 가시적으로 보여줄 수 있는것은 스프린트 보드였고, Github Project 기능으로 이를 사용하였습니다.
이를 통해 Front/Back 의 협업의 효율을 높일 수 있었고 서로가 하는 작업에 대해 진행중, 리뷰중, 반영 완료중 어디까지 완료가 되었는지도 알 수 있었습니다.
문서화
Frontend와 Backend를 개발하는 개발자가 각각 있다보니 비대면/비동기 개발작업이 쉽지만은 않았습니다. 화면을 구현하고 서버와 연동하기 위해서는 특정 API가 개발되었는지 물어본 후 API가 요구하는 파라미터, URI Path, 권한, 응답값 등을 알아야 하지만 이를 확인하려면 직접 물어보고 대답하는 불편한 과정이 필요했습니다.
우리는 이를 해결하기 위해 개발하는 모든 API에 대한 실시간 문서화를 진행하였습니다. Frontend 개발자는 이 API Document를 보고 필요한 요구사항과 응답값을 알 수 있었고, 불필요한 커뮤니케이션 리소스를 효과적으로 줄일 수 있었습니다
코드리뷰
학습 프로젝트인만큼 개발에 급급하지 않고 코드 품질을 높이기 위하여 노력하였습니다. 모든 요청에 대한 인터페이스 테스트가 존재하고 비즈니스로직에 대해서는 테스트코드와 함께 코드리뷰를 진행한 후 머지를 원칙으로 삼았습니다.
당장 버그가 없더라도 지속적으로 유지하기 어려운 코드라면(나쁜 냄새가 나는 코드) 가차없는 반려를 통해 코드 품질을 관리하였습니다.
팀원들의 생생한 프로젝트 후기!
Eric
한번도 사용해보지 못한 Kotlin과 여러가지 기술 셋을 익히기 위해 시작한 프로젝트였습니다.
JPA와 Kotlin을 잘 합쳐서 쓰기가 어렵다는점도 알 수 있었고, 항상 쓰던 Java를 벗어나 (비록 같은 JVM이지만) 새로운 언어로 프로젝트를 진행해서 정말 재밌었습니다.
문서화를 위한 코드가 300줄이 넘어가고, 만들어놓은 서버는 OOM이 나서 터지는등 여러가지 난관이 있었지만 이를 해결하는 과정에서 스킬을 한층 끌어올릴 수 있었습니다.
팀원 모집부터 프로젝트 진행 및 완료까지 잘 따라와주신 팀원분들 모두 고생 많으셨습니다.
Sight
막연히 이런걸 만들면 어떨까? 라는 생각으로 시작했던게 점점 규모가 커지고 이를 위한 서버까지 사게 되면서
많은 공부를 하게 되었습니다. 익숙치않은 Kotlin과 JPA 그리고 테스트코드를 도입하게 되면서 서버개발자로써
한걸음 더 성장한거같은 느낌이 들었습니다. 모두 직장인이라 퇴근하고 나서 힘들었을텐테 짬짬히 프로젝트 하느라 고생많으셨습니다! 👍
Pompitzz
백엔드 개발자로 일을 하고 있지만 프론트 경험을 위해 프로젝트에 참여하였습니다.
프론트 관점에서 많은 부분을 생각할 수 있었고 현업에서 네이티브 개발자분들과 소통할 때 많은 도움이 되는 걸 느꼈습니다.
프로젝트 내내 IDE의 자동완성기능을 제공받기 위해 했던 여러 가지 시도들과 막바지에 TypeScript 도입으로 많은 부분을 개선할 수 있었던 것이 가장 기억에 남네요.
다들 고생 많으셨습니다🙂
030ii
이번 프로젝트에서는 주로 디자인 작업을 담당하였습니다.
Figma도 처음 써봤는데 기존에 사용해본 Sketch보다 훨씬 더 쉽고 직관적인 툴인 것 같습니다.
API 문서를 보며 어떤 요소들을 어떻게 표현할 수 있을지 고민하고,
컴포넌트 구조를 파악한 후 화면을 어떻게 구성할지를 결정하면서,
왜 디자이너도 엔지니어적 사고를 해야 더 편하고 수월한지 바로 느껴졌습니다.
이번 프로젝트로 끝이 아닌, 이어서 제 디자인으로 React 버전의 MANNALGA(만날까)도 만들어보려합니다.
계속해서 스터디를 위한 프로젝트를 해보겠습니다! ㅎㅎ! 😆
마지막으로, 기술적인 도전을 끊임없이 시도하시는 팀원분들과 함께하게 되어 영광이었습니다.
덕분에 저도 좋은 영향을 받았습니다. ㅎㅎ 다들 감사하고 고생많으셨습니다! 👍🏻👍🏻
궁금하신점이 있으신가요?
프로젝트에 대해 궁금하신점이 있으시다면 언제든지 Issue를 통해 남겨주세요.
감사합니다
'Project > Mannalga' 카테고리의 다른 글
| Java Version 변경 후 Gradle Build가 되지 않을 때 (5) | 2021.03.15 |
|---|---|
| Super Invention 프로젝트 소개 (5) | 2020.09.29 |
댓글