1차 프로젝트 회고

 

드디어 첫 프로젝트 시작☺️
많은 것을 경험했던 프로젝트 회고

 

    목차 

1. 프로젝트 정의
2. 프로젝트 목표
3. 프로젝트 과정
4. 느낀 점 

 

 

1.  프로젝트 정의

• Foundation 기간에 배운 React와 Express를 활용하여 팀원과 공동의 목표를 이루는 경험을 배우기 위해 일주일 동안 SNS 가운데 하나인 Threads와 같은 서비스를 구축
• Threads의 가장 핵심적인 기능만을 추려낸 MVP를 선정하고, 기능 단위로 개발 범위를 나누어 개발 진행

 

2.  프로젝트 목표

• Threads의 회원가입 기능, 로그인 기능, 게시글 기능을 파악하고 개발
• 프론트엔드는 회원가입 페이지, 로그인 페이지, 게시글 페이지를 개발
• 백엔드는 회원가입 API, 로그인 API, 게시글 CRUD API를 개발
• 프론트엔드에서 개발한 페이지와 백엔드 API를 통신하여 프로젝트를 완성
• 프로젝트 회고 미팅을 진행하여 프로젝트 기간에 느꼈던 점을 기록

 

3. 프로젝트 과정

 

우리 팀은 프론트엔드 2명 & 백엔드 3명으로 한 팀이 구성되었다. 백엔드는 3명이 함께 코드 작성과 dbmate 생성 등을 함께하였고 , 프론트엔드는 개발 범위를 2가지로 나누었으며, 매일 Stand-up Meeting(참석자들이 서서 진행할 수 있을 만큼의 간단한 미팅)을 통하여 진행 상황을 공유하였다.

 

3-1. 프로젝트 1일 차(첫단추 잘 꿰기)

 

첫날 Stand-up Meeting은 Planning meeting(프로젝트의 목적, 일의 분배, 일의 진행 일정 등의 큰 틀)로 진행되었으며, 프로젝트가 처음인 우리를 위해 멘토님들이 참석하여 나아갈 방향을 간단히 알려주셨다. 이 과정에서 PM을 정하고 팀끼리의 큰 계획들(미팅 시간,진행범위,진행 소요 시간 등)도 이루어졌다.

 

이후 바로 초기세팅에 들어가 크게 3가지를 세팅하였는데 root 폴더의 초기세팅 / dbmate 설정 / Runserver 구동 을 진행하며 초기세팅이라 얼마 안 걸리겠지 했었던 나의 짧은 생각을 반성하게 되었다. mac환경과 window 환경에 따라 초기세팅을 하는 과정에서 각종 오류 및 파일 설치 오류가 발생하였고(특히 파일 설치 후 package.json에 설치 파일이 뜨지 않는다던지, 실행하려고 했을 때 패키지가 설치되어있지 않다거나 실행이 불가하다는 오류가 많았다) 또한 .env파일에 각종 환경변수를 넣으면서 .env sample 파일을 추가하며 보안에 대해 중요함도 느끼게 되었고 첫 단추를 잘 꿰어야 한다는 말이 있듯이, 역시 뼈대를 이루는 과정의 첫 번째인 만큼 가장 중요하구나 하는 깨달음을 얻은 순간이었다.

 

추가로 dbmate의 생성 과정에서 ERD파일을 다시금 생각하고 직접 그려보며 어떤 테이블이 서로 연관되어있는지 팀원들과 함께 공유하며dbmate 데이터 테이블을 작성해보았다.

 

그림 1. dbmate를 생성하기 위한 ERD

 

 

3-2. 프로젝트 2, 3일 차(소통과 역할의 중요성)

2일 차 초기 세팅을 마친 우리들의 앞에 또 한 번의 문제가 생기게 되었다. 우리의 짧았던 4주간의 시간(사전 스터디 2주 + 파운데이션 2주)동안 우리는 코드에 대한 이해정도가 달랐기 때문에 각 코드를 이해하는 방법이나 소통하는 과정에서 여러 가지 문제들이 쏟아져나왔다.

 

특히 백엔드에서 필수 과제만 구현하자는 의견과 더 나아가 심화 과제를 구현하자는 의견이 나뉘게 되면서 어떤 방향으로 나아가야 할지 소통이 필요한 상황에 직면했다. 미팅을 통하여 각자의 생각을 얘기해보고 난 뒤 첫 번째 프로젝트인 만큼 필수 과제인 회원가입, 로그인, 글 작성,글 목록조회에 대한 코드에 대한 개념과 사용 방법을 확실히 하자는 결론이 나왔다.

 

3일 차 멘토님이 직접 참여한 우리의 미팅에서 문제점이 발견되었다. 우리 팀은 보통 팀원들끼리 모여 서로 진행 상황을 공유하고 앞으로 나아가야 할 방향에 대하여 간단히 이야기를 나누고 Trello에 각자 업무의 진행, 완료 상황을 확인하고 끝내곤 했었다. 이런 의사소통 방식에서 PM의 역할이 충분히 발휘되지 못하였고(누가 먼저 이야기할지 순서 체계가 없는 점, 어느 정도까지 진행되었는지 자세하게 공유하지 못한 점 등) 서기를 따로 지정하지 않은 탓에 말로만 전달하여 정확한 내용을 서로 몰랐다는 문제점이 발견되었다. 각자 진행하고 있는 분야가 다른 만큼 서로 자세하게 설명하기 어려웠지만 어느 정도 기간 동안 최선을 다해서 진행해보겠다던지 맞춰가야 할 방향에 대하여 구체적으로 얘기하는 팀원들의 모습에서는 나름(?) 인정을 받았다.😁  첫 번째 프로젝트인 만큼 멘토님의 조언에 대하여 주의 깊게 듣고 고쳐나가야 할 점들을 깨닫고 수정하려고 노력했다.

 

3-3. 프로젝트 4일 차(맞춰 나가기)

4일 차에는 이때까지 작성한 코드를 프론트,백엔드가 함께 모여 맞춰보고 코드리뷰를 하는 시간을 가졌다. 백엔드는 필수 과제인 회원가입, 로그인, 글 작성, 글 목록조회 의 기능에 대한 코드 작성을 거의 완료한 상태였지만 프론트쪽에서 사전에 조율했던 예상 시간보다 조금 지체되는 점이 있어 함께 연결해보며 맞춰 나갈 수 있는 시간이 지연되었다. 그 과정에서도 누구 하나 재촉하는 사람 없이 잘 할수 있다고 서로 다독이였고, 프론트쪽에서 지연이 되고 있는 만큼 백엔드도 그에 맞추어 기존에 작성한 코드를 한번 더 점검하고 함께 맞추어보자는 결론이 나왔다.

 

추가로 백엔드 레이어드 패턴(2차 프로젝트에 적용될 사항)강의를 듣고 어떤 파일이 어디로 들어갈지에 대한 그림을 그리면서 간단히 정리해보는 시간을 가졌다.

 

 

3-4. 프로젝트 5일 차(짜릿한 프로젝트)

대망의 마지막 날에는 프론트,백엔드가 한자리에 모여 팀끼리의 결과물을 공유하고 연결해보는 시간을 가지게 되었다. 마지막 날까지 프론트의 코드가 완성되지 않아 아쉽지만 당일이 프로젝트의 마지막 날이었기에 백엔드는 다른 팀의 프론트엔드 동기들, 프론트엔드 멘토님에게 가서 코드를 연결해볼 수밖에 없었다. 

 

열심히 작성한 우리의 코드들이 연결되는 순간이 너무 짜릿하게 느껴졌다. 하지만 그 웃음도 잠시 3번 정도의 오류가 나게 되면서 우리의 표정은 점점 심각해져 갔다😂 (쿼리문을 불러오는데 코드 내에 JOIN이 잘못된 경우 , 비밀번호의 해쉬화가 적용되지 않아 오류가 난 경우, 조건의 쿼리문 내에 쉼표가 빠져서 오류가 난 경우) 이렇게 작성한 코드를 하나하나씩 찾아보며 오류를 찾아 수정을 시작했고, 마침내 회원가입, 로그인, 게시물 작성, 게시물목록조회에 대한 결과물을 녹화까지 할 수 있었다.

 

 

4.  프로젝트 회고(느낀 점)

함께하는 첫 프로젝트였던 만큼 서로 소통에 대하여 고쳐야 할 부분들도 꽤 많았고 PM의 역할이 얼마나 중요한지, 나 혼자가 아닌 팀으로 함께한다는 것이 무엇인지에 대한 경험과 사용하는 기술(React, Node.js)들이 다른 만큼 서로의 코드를 이해하는 부분에 대한 서로에 대한 배려심(코드에 대한 설명)과 소통하는 부분에서 서로 맞춰나가려는 노력, 포기하지 않는 열정들이 샘솟아 났던 프로젝트였다.

 

4-1. 코드 문제 & 해결

 

• 초기세팅 문제(MacOS,Window)

각각 다른 운영체제에 대한 문제점들(설치 후 package.json에 확인이 안 되는 점, 실행 시 데이터를 불러올 수 없는점 등) package.json에서 확인이 안 되는 문제에 대해서는 npm install과 version 확인을 통하여 재설치를 하였고, 데이터를 불러오지 못하는 문제에서는 .env파일의 환경변수(포트번호,DB명 오류)수정을 통하여 해결할 수 있었다.

 

 

• 환경변수 설정하기

그림 2. 직접 작성한 .env sample

환경변수를 설정하면서 DB 오류와 PORT 번호에 대하여 사소한 오류가 있었는데 .env 파일에 들어가는 내용이 다른 팀도 볼 수 있는 github 상에 노출되면 안 된다는 보안이슈로 .env sample(코드를 보는 사람들에게 보여주는 파일)에 샘플을 작성했다. .env파일의 중요성과 쓰임에 대하여 한 번 더 상기시킬 수 있었다.

 

 

• 레이어드 패턴(Layered Architecture)

해당 프로젝트에서는 직접 적용하지는 못하였지만 배운 내용을 토대로 2차 프로젝트를 위하여 어떤 식으로 데이터를 나누어야 할지에 대한 절차를 생각해보고 직접 그림을 그려보며 한 번 더 이해하는 과정을 가졌다.

 

그림 3. 직접 그려본 레이어드 패턴

 

Presentation Layer(Controller) : API를 구현하며 엔드포인트의 정의 및 전송된 http 요청 등을 읽어 들이는 로직을 구현한다.userController라는 폴더로 구성되어 있으며, http 요청에 대한 구현과 API의 구현 내용이 들어간다.

Business Layer(Service) : 비밀번호의 최소길이, 특수기호 조건 등의 회사의 서비스적인 기획이 들어간다. userService라는 폴더로 구성되어 있으며 특수문자 오류 및 비밀번호 길이(10자 이상) 조건 등에 대한 내용이 들어간다.

Persistence Layer(Dao) : DB(mysql, RDBMS)와 맞닿아있으며 로직을 구현하는 부분이다. CRUD로 데이터를 주고받는다. user Data Dao의 폴더로 구성되어 있으며 CRUD에 해당하는 SQL을 직접 처리하는 내용이 들어간다.

 

특징 : 단방향 의존성 - 꼭 순서대로 진행될 수 있으며 서로는 서로에 의하여 독립적으로 구성되어 있다.

          관심사 분리(SOC) - 레이어별 역할이 정확히 구분되어 명확하다.

 

 

4-2. 혼자 할 때 & 팀으로 진행할 때

수업을 듣고 혼자 코드를 작성할 때에는 누구와 소통할 일 없이 오롯이 집중하며 코드를 작성하고 수정하는 부분에서도 구글링과 멘토님께 조언을 얻으며 진행하곤 했었는데, 생에 처음 프로젝트를 경험해보면서 코드를 작성하는 것 뿐만 아니라 팀원들과의 소통과 협업에 있어서 '나'가 아닌 '우리'로 초점을 바꾸고 서로 의견이 다를 때에는 돌아가면서 각자 생각하는 바를 나누었고, 코드가 잘못된 부분에 대해서는 다 같이 골똘히 보기도 하고 서로 비교해보며 어떤 식으로 개선해야 할지에 대한 방향성을 나누는 프로젝트 내에서의 작은 단체생활을 경험한 것 같아 뿌듯했다.

 

4-3. 개발자에게 중요한 것

개발 공부를 시작하기 전, 나의 직업은 이커머스회사에서 광고 운영&광고관리를 하는 광고팀에 소속되어있었다. 광고를 게시하기도 하고 직접 데이터수집을 하곤 했었는데, 그 안에서 개발팀과 소통해야 하는 업무가 자주 있었다. 그때부터 나는 '소통' 이라는 것에 대해서 다시금 생각해보게 된 것 같다. 메일을 써서 보낼 때 서로 못 알아듣는 부분이 가끔 있었는데, 그 일들을 계기로 정리해보자면 내가 무엇을 말하는지에 대하여 확신이 있어야 하고 나만 아는 단어가 아닌 공유하고 이해할 수 있는 용어를 사용해야 한다. 문제가 생겼을 시에 구체적으로(언제, 어디서, 무엇이, 어떻게, 왜)정확하게 전달하는 것 또한 중요하다는 것을 이번 프로젝트를 통하여 다시금 깨달았다. 개발이라는 업무 자체가 회사 내의 거의 모든 부서와 연결되어있다고 할 수 있을 만큼 긴밀하므로 소통에 대하여 더욱 중요하게 생각하게 되었다.