매일 한걸음씩 성장하기

 

4주라는 긴 시간이 지나갔지만 저에게는 그저 짧기만 했던 순간이었습니다.

Final Project를 마무리 하며 짧게나마 회고를 남겨보려 합니다.

 

 

프로젝트 LINK

프로젝트 배포 사이트

Github - Server

Github - Client

 

 

 

Reciper를 만들어보자!

Reciper는 팀원 모집 서비스와 프로젝트 협업 툴을 함께 제공하는 플랫폼입니다.

함께 하고 싶은 팀원을 모집해 팀을 꾸리고, 만들고 싶은 프로젝트를 함께 진행할 수 있도록 만들었습니다.

 

사실 Reciper는 처음에 팀이 만들어지고 다같이 아이디어 회의할 때 빠르게 결정된 아이템이었습니다.

 

프로젝트를 관리하고 협업할 수 있는 도구는 이미 많이 존재하고 있지만 마음에 드는 도구를 찾기는 어려웠습니다.

저희는 우리가 원하는 기능 만을 담은 도구을 직접 만들어보고 싶었습니다.

 

그리고 개발자가 되기 위해서는 이론적인 지식 습득도 중요하지만 실제로 코드를 작성해보고 프로그램을 만드는 경험을 쌓아야 합니다.

토이 프로젝트를 진행하기 위해 팀을 만들어야 하지만 주변에서 원하는 팀원을 찾기가 쉽지 않습니다.

이러한 문제를 해결하기 위해 자유롭게 팀원을 모집하고 팀에 합류할 수 있는 온라인 공간도 만들고 싶었습니다.

 

이 두가지 아이디어를 합쳐 우리 플랫폼에서 모든 것을 해결하도록 만들겠다, 라는 생각으로 Reciper를 기획하게 되었습니다.

 

 

 

어떻게 개발할 것인가?

Reciper는 Front-End 2명, Back-End 2명이 맡아 개발하였습니다.

 

저는 Back-End를 맡았습니다.

Reciper를 디자인하고 화면에 그려주는 Front-End에 관심이 있었지만 Reciper에 동적인 숨을 불어넣는 Back-End를 해보고 싶은 마음이 더 컸습니다.

수많은 데이터를 저장하고 관리하는 Database 구축에서부터 클라이언트에게 어떻게 데이터를 주고 받을 것인지 정하는 API 설계를 진행하는 과정이 즐거웠습니다.

제가 보내준 데이터가 화면에 실제로 그려지게 되는 모습을 보며 Front-End와 상호작용하는 방법에 대해 배웠습니다. 클라이언트 측에서 웹사이트가 매끄럽게 작동될수 있도록 서버에서 어떻게 해야하는 지에 대한 고민을 많이 했습니다.

 

Reciper를 개발할 때 다음과 같은 기술 스택을 사용했습니다.

이 중에서 제가 직접 사용해본 스택은 TypeScript, Socket.io, Axios, Node.js, Express.js, mySQL, typeORM, Nodemailer, AWS 입니다.

 

 

 

Reciper를 완성하기 위해 했던 작업들

제가 진행한 작업들을 표로 정리해보았습니다.

이렇게 정리해보니 많은 작업들을 했다는 것을 한눈에 볼 수 있었습니다.

(날짜를 클릭하면 해당 날에 했던 작업 기록을 볼 수 있습니다!)

SUN MON TUE WED THU FRI SAT
  5/10
 SR                    
 Bare Minimum 
 Database          
 Middleware      

 Login               
 Profile             
 Recruit             
 Test & Fix        
 Document        

5/11
 SR                    
 Bare Minimum 
 Database          
 Middleware      

 Login               
 Profile             
 Recruit             
 Test & Fix        
 Document        

5/12
 SR                    
 Bare Minimum 
 Database          
 Middleware      

 Login               
 Profile             
 Recruit             
 Test & Fix        
 Document        
5/13
 SR                    
 Bare Minimum 
 Database          
 Middleware      

 Login               
 Profile             
 Recruit             
 Test & Fix        
 Document        
5/14
 SR                    
 Bare Minimum 
 Database          
 Middleware      

 Login               
 Profile             
 Recruit             
 Test & Fix        
 Document        
5/15
 SR                    
 Bare Minimum 
 Database          
 Middleware      

 Login               
 Profile             
 Recruit             
 Test & Fix        
 Document        
5/16
 Database          
 Middleware      

 Login               
 Profile             
 Project             

 Recruit             
 Test & Fix        
 Document        
5/17
 Database          
 Middleware      

 Login               
 Profile             
 Project             
 Recruit             
 Test & Fix        
 Document        
5/18
 Database          
 Middleware      

 Login               
 Profile           
 Project             

 Recruit             
 Test & Fix        
 Document        
5/19
 Database          
 Middleware      

 Login               
 Profile           
 Project             

 Recruit             
 Test & Fix        
 Document        
5/20
 Database          
 Middleware      

 Login               
 Profile           
 Project             

 Recruit             
 Test & Fix        
 Document        
5/21
 Database          
 Middleware      

 Login               
 Profile           
 Project             

 Recruit             
 Test & Fix        
 Document        
5/22
 Database          
 Middleware      

 Login               
 Profile           
 Project             

 Recruit             
 Test & Fix        
 Document        
5/23
 Database          
 Middleware      

 Login               
 Project             

 Workspace       
 Test & Fix        
 Document        
5/24
 Database          
 Middleware      

 Login               
 Project             

 Workspace       
 Test & Fix        
 Document        
5/25
 Database          
 Middleware      

 Login               
 Project             

 Workspace       
 Test & Fix        
 Document        
5/26
 Database          
 Middleware      

 Login               
 Project             

 Workspace       
 Test & Fix        
 Document        
5/27
 Database          
 Middleware      

 Login               
 Project             

 Workspace       
 Test & Fix        
 Document        
5/28
 Database          
 Middleware      

 Login               
 Project             

 Workspace       
 Test & Fix        
 Document        
5/29
 Database          
 Middleware      

 Login               
 Project             

 Workspace       
 Test & Fix        
 Document        
5/30
 Login               
 Workspace       
 Test & Fix        
 Document        
5/31
 Login               
 Workspace       
 Test & Fix        
 Document        
6/1
 Login               
 Workspace       
 Test & Fix        
 Document        
6/2
 Login               
 Workspace       
 Test & Fix        
 Document        
6/3
 Login               
 Workspace       
 Test & Fix        
 Document        
6/4
 Login               
 Workspace       
 Test & Fix        
 Document        
6/5
 Login               
 Workspace       
 Test & Fix        
 Document        
6/6
 Test & Fix        
 Document        
 Presentation    
6/7
 Test & Fix        
 Document        
 Presentation    
6/8
 Test & Fix        
 Document        
 Presentation    
       

 

 

 

다들 놀라는 Reciper의 크기

모든 팀원들이 열정이 대단하고 개발에 대한 욕심이 많았기에 매일 열심히 달렸습니다.

그 결과 우리가 처음에 기획했던 거의 모든 기능들을 구현할 수 있었습니다!

  • 로그인 (Email, Google, Github 로그인)
  • 팀원 모집 (게시글 CRUD, 댓글)
  • 프로젝트 관리 (프로젝트 CRUD)
  • 협업 툴(채팅, 칸반보드, 캘린더)

 

개발할 때는 몰랐는데 이렇게 flow chart로 정리해보니 Reciper의 볼륨이 생각보다 많이 크다는 것을 알았습니다.

commit이나 issue의 갯수도 꽤 높은데 우리가 그만큼 열심히 달린 증거로 보여 뿌듯했습니다.

 

저는 우리가 이만큼 만들었다! 이런 기능을 구현하였다! 를 어필하기 위해 READMEWIKI의 내용을 작성할 때 많은 고민을 했었고 flow chart, 이미지를 제작하는 데도 많은 공을 들였습니다.

그만큼 Reciper의 크기를 더 잘 보여줄 수 있어서 기쁩니다.

 

Client Side Flow Chart

Server Side Flow Chart

Database Schema

 

 

 

함께 성장했습니다

Final Project를 진행하며 가장 좋았던 점은 4주동안 함께 성장했다는 것입니다.

 

매일 아침에 오늘은 어떤 작업을 할지 서로 공유하고 어떻게 진행할 것인지 토론을 했습니다.

그리고 저녁에는 오늘 했던 작업들에 대해 코드리뷰를 진행하고 기록을 남겼습니다.

코드리뷰를 통해 자신이 했던 작업 부분뿐만 아니라 다른 팀원이 어떻게 코드를 작성했는지 흐름을 알 수 있었습니다.

 

스스로 주도적으로 일을 하는 분위기였지만 서로에게 도움을 주기도 했습니다.

만약 작업 중 막히는 부분이 있다면 함께 모여서 고민하고 해결하는 시간을 가졌습니다.

내가 생각하지 못했던 참신한 방법을 알 때도 있었고 부족했던 이론적 개념을 다시 배우기도 했습니다.

 

혼자 앞서서 달려나가는 것이 아닌 서로 도와주고 으쌰으쌰하면서 함께 만들었기에 Reciper를 완성할 수 있었습니다.

 

 

 

시간이 조금만 더 있었더라면

한정된 시간 내에 Project를 완성해야했기에 개발과 공부를 동시에 진행해야 했습니다.

TypeScript는 First Project때 사용해보았기에 괜찮았지만 나머지 다른 기술들은 공부를 해야 했습니다.

공부가 깊게 되지 않은 상태에서 바로 코드를 작성하다보니 나중에 발견한 문제나 에러가 많습니다.

 

저희는 협업 툴을 개발할 때 실시간 협업을 고려하여 구현하였습니다.

클라이언트와 서버 간에 양방향으로 데이터를 실시간으로 주고받는 통신을 하기 위해 socket.io를 사용했습니다.

협업 툴에 채팅, 칸반보드, 캘린더 기능에 모두 socket.io를 사용했는데 채팅 메시지를 보내거나 마우스로 클릭하는 등의 사소한 동작에서도 이벤트 함수가 실행됩니다.

이 방법은 트래픽이 조금만 증가하더라도 바로 서버에 과부화가 걸린다는 문제점이 있습니다.

프로젝트 막바지에 이 문제를 발견하였지만 시간이 부족해 해결하지는 못했습니다.

시간 부족으로 단일 서버로 socket.io를 구현했지만, 시간이 조금만 더 있었더라면 cluster를 사용하여 다수의 프로세스에서 서버를 동작시켰을 것 입니다. 그리고 cluster 간에서 데이터 공유를 할 수 없는 문제를 해결하기 위해 redis를 사용했을 것 입니다.

 

이외에도 그당시 개발할 때는 몰랐던 코드의 문제점이나 보완해야하는 부분들이 많습니다.

코드를 어떻게 해야 더 효율적으로 짤 수 있는지도 보여서 아직 많이 부족하다는 것을 느꼈습니다.

 

 

 

앞으로도 계속 Reciper와 함께,

우리 기수에서 최고의 결과물을 만들어보자, 라는 마음으로 Final Project에 집중했고 그만큼 Reciper에 대한 애정도 큽니다.

단순히 구현을 했다는 것에 만족하지 않고 계속 Reciper를 업그레이드 시키고 싶습니다.

4주 기간동안은 구현에 최우선을 두었기에 우리가 생각하지 못한 에러, 이슈들이 많을 것 같습니다.

이러한 에러들을 고치거나 코드를 최적화/리펙토링을 진행해볼 예정입니다.

그리고 실제로 서비스 운영을 해보면서 거기서 발생하는 trouble issue를 찾아보고 해결해보고 싶습니다.

우리 구현해보고 싶었던 추가 기능들도 Reciper에 넣어보고 싶습니다.

 

 

회고를 쓰면서 제가 Reciper로 인해 정말 많이 성장했다는 것을 느꼈습니다.

좋은 팀원들을 만나서 좋았고 이런 플랫폼을 만든 제가 참 기특하기도 합니다.

앞으로도 Reciper와 같은 프로젝트를 만들어보며 계속 성장하는 개발자가 되고 싶습니다.

'Code States > Project Record' 카테고리의 다른 글

[기록] Final Project_2021.06.08  (0) 2021.06.08
[기록] Final Project_2021.06.07  (0) 2021.06.07
[기록] Final Project_2021.06.06  (0) 2021.06.07
[기록] Final Project_2021.06.05  (0) 2021.06.05
[기록] Final Project_2021.06.04  (0) 2021.06.04

공유하기

facebook twitter kakaoTalk kakaostory naver band