## 2020 08 21 codestates 2주프로젝트 종료
* 2주프로젝트 시작
- 아직 배울것이 한참 남았다고 생각했다. 하지만 다음 스프린트는 없었고, 정신을 차려보니 2주프로젝트가 시작됐었다.
내가 배운것들이 있긴 하지만 이것들을 어떻게 실제 웹,앱에 적용해야 할지 그냥 깜깜했다.
다른 사람들은 어떤 스택을 써야겠다, 어떤 웹을 만들어야겠다 계획이 많았지만, 나는 무엇을 시작할 수 있을지도 몰랐다.
아무것도 할 수 없는 상태로 다른 팀에 들어가면 로직자체를 이해할 수 없을 것 같았다.
그래서 차라리 내가 아이디어를 생각해보고, 구현하는 것으로 방향을 잡았다.
어떤 새로운 것을 시도하기보다는 우선 프리코스와 이머시브코스를 거치면서 내가 배웠던 부분들을 복습하는 것에 초점을 맞췄고,
새로운 서비스를 기획하기보다는 내가 필요한 것을 만들고 싶었다.
이머시브 코스를 수강하면서 아무리 공부해도 따라잡을 수 없는 페어들을 많이 만나봤다. 먼저 프로그래밍을 경험하고 오셨다지만,
그분들께도 분명히 새로 배우는 부분들이 있었을텐데 나는 그 부분에서도 따라가지를 못했다.
그분들은 도대체 어떻게 공부하는지, 혹은 내 자신이 비효율적으로 시간을 쓰는 것은 아닌지 고민했고,
나는 이 사람들이 얼마나 공부하는지, 내가 비효율적으로 공부를 하는 것은 아닌지 측정하기 위한
'스톱워치 공부 웹'을 기획했다.
약간의 말을 구겨 넣고 대충 ppt 1페이지를 만들어 줌 마이크를 켰다.
다른 분들의 아이디어 사이에서 대충 만든 피피티가 시작됐고 동시에
처음으로 내가 생각한 것을 프로그래밍 하는 2주 프로젝트도 시작됐다.
* 팀편성 및 기본 개요
- 주말이 지나는 동안 팀이 꾸려졌고, 페어를 한 번 (3인으로) 진행했던 분과 모각코에서 종종 뵀었던 2분으로 팀이 구성 됐다.
말씀을 들어보니 다들 1지망으로 내 아이디어를 정하진 않았다고 하셨다.
나야 내가 낸 아이디어를 구현하는 것이라 맘 놓고 망해도 됐었지만, 이분들께 괜한 민폐는 아닐까 고민했다.
기능이라고는 딸랑 스톱워치에 랭킹 뿐인데, 나 혼자 편하자고 복습을 말씀드리는것이 과연 이분들에게 도움이 되는 일일까 고민을 했지만
다행히 모든 팀원들이 더 관심을 가져주셨고 서비스 이름은 코드스테이츠와 타임을 합해서 COTATS로 정해졌다.
너무 대충 정한 기획안이라(기획안이라고 하기도 좀 민망한) 정말 저 한 페이지 뿐이었는데, 저 한 페이지를 보면서 세부적인 내용은 어떻게 할 지 정했다. 나는 그냥 아무 생각 없이 아 시간랭킹만 넣으면 되겠구나~ 했지만, 햄버거 메뉴를 눌렀을 때 마이데이터에 실시간 타임을 넣을것인지, 중간에 껐다가 다시 시작할 경우는 어떻게 해야 할 것인지.. 경우의 수가 너무 많았다. 계속되는 회의 끝에
1. bare minimum : 로그인 기능 구현(세션)
/ advanced: 토큰 및 oauth 기능 구현
2. bare minimum : 랭킹 기능 구현
/ advanced : 실시간 랭킹 기능 구현 (소켓)
으로 방향을 잡고 킥오프 미팅을 진행했다.
킥오프 미팅 결과 랭킹테이블의 랭킹까지 소켓으로 진행하면 서버가 너무 과부하가 걸릴 위험이 있어 마이데이터에서만 실시간 랭킹을 구현하기로 했고 앱에서는 세션이 이용 되지 않기 때문에 토큰으로 하는 것으로 변경되었다.
* 기능 및 서비스 구현
- 앞서 있던 미팅에서 서로의 포지션을 정했고, 나는 팀장이자 프론트엔드포지션으로 이 프로젝트를 진행하게 되었다.
프로젝트 전, 어차피 둘 다 잘하지 못하기 때문에 그냥 남는 포지션을 하려고 했던 나는 앞서 선택하신 두 분이 다 백엔드를 선택하셔서
프론트엔드 포지션을 맡게 되었다.
본격적으로 코드를 찍기 전에 그동안 혼자 혹은 페어에서만 진행하던 깃을 여럿이서, 브랜치를 딴 후에 진행하는 깃 플로우를 익혔고,
약 이틀간의 삽질 끝에 겨우 깃협업이 어떤식으로 진행되는지 알 수 있었다. (엄청난 오류들과 충돌들로 인해서 사실 아직까지도 처음에 어떻게 진행이 되었는지는 잘 모르겠다. 그냥.. 됐다ㅋㅋ)
내가 처음 맡은 기능은 스톱워치 구현이었다. 리액트 훅스를 이용해 스톱워치를 구현했고,
나중에 안 사실이지만, 모듈로 충분히 구현할 수 있었다.
그것을 몰랐던 나는 그냥 유튜브 보면서 어떤식으로 스톱워치 기능을 구현하는지 배웠고, 그대로 코드를 쳤다.
(이 부분이 나중에 리팩토링 할 때 큰 도움이 되었다.)
<b className="DisplayTimer">
<Timenumber>
{props.time.h >= 10 ? props.time.h : "0" + props.time.h}
<Blinktime> : </Blinktime>
</Timenumber>
<Timenumber>
{props.time.m >= 10 ? props.time.m : "0" + props.time.m}
<Blinktime> : </Blinktime>
</Timenumber>
<Timenumber>
{props.time.s >= 10 ? props.time.s : "0" + props.time.s}
</Timenumber>
<Ms>{props.time.ms >= 10 ? props.time.ms : "0" + props.time.ms}</Ms>
</b>처음 써보는 리액트 훅스였지만, 대략적인 의미를 이해하고 나니 클래스형 리액트보다 더 편하게 느껴졌다.
내가 스톱워치를 만드는 동안 다른 프론트분께서 로그인 구현을 이미 완료 하셨고,
2주 프로젝트의 절반쯤 지났을 때는 배포를 할 수 있지 않을까 하는 멍청한 생각을 잠깐 했었다.
"hello world"라도 찍고 배포를 하라고 하셨던 엔지니어분의 말을 듣고 1일차에 바로 배포를 시도했었지만, 어찌된 일인지 뜻대로 되지 않았다. 그대로는 시간만 갈 것 같아 우선 코드를 찍고 진행하려 했지만, 이번에는 세션이 문제였다.
지금 생각해보면, 코드 구현보다는 깃,세션,배포 등 기능 외적인 문제들로 인해 많은 시간을 보냈던 것 같다.
깃은 팀원분께서 녹화해주셨던 영상을 보면서 해결했고, 배포는 기존의 강의자료들이 있었지만 세션같은 경우는
왜 세션 아이디가 넘어오지를 않는지 이해할 수가 없었다. 줌에서의 온갖 질문과, 다른 수강생분들의 도움 그리고 구글링으로 해결했다.
원인은 db에서 세션아이디를 받아 유저의 아이디 값으로 값을 넣어주고 있었지만 우리가 다른 곳을 뒤지고 있었다는 다소 어이없는 이유였다.
세션이 해결되고 나니 로그인 후 새로고침 문제, 스톱워치를 눌렀을 때 누가 눌렀는지 아이디를 받아올 수 없는 문제, 랭킹테이블을 어떻게 가져와야 할지에 대한 문제가 차례대로 해결되었다.
* 프로젝트 리뷰
잘했던 부분
1. 제한된 시간 안에 배포까지 마무리를 했다는 것
2. bare minimum으로 설정한 부분을 실서비스에 문제가 없을 정도로 구현을 했다는 것
3. 이머시브 때 학습한 내용을 거의 대부분 복습 했다는 것
4. 리액트 훅스, 스타일 컴포넌트 등 새로운 것에 도전을 했다는 것
5. 여러가지 문제가 있었지만, 그래도 어떻게든 해결은 했다는 것
부족했던 부분
1. 소켓으로 마이데이터를 구현하기로 했었지만, 이런 어드밴스드한 부분을 도전하지 못했다.
배운 것을 복습은 했고, 어느정도 틀이 있는 부분은 도전했지만 아예 새로운 것을 도전하지는 못했다.
2. 여러가지 오류를 적절히 핸들링 하지 못했던 것 // 세션으로 고생 할 때, 질질 끌지 말고 토큰으로 빠른 전환을 했으면 어땠을까?
3. 팀원간 코드 작성에 바빠 정작 코드 리뷰시간은 없었던 것 // 팀장으로서, 가장 부족했던 부분 같다.
4. 너무 내 의견을 내지 못했던 것 // 내가 생각했던 부분이 맞는지 자신할 수 없어, 의사결정이 느렸다.
5. 스택오버플로우, 헬프데스크등 도움을 받을 수 있는 곳이 분명 많았지만, 적절한 질문을 하지 못했던 것
6. 내가 정했던 시간 계획을 지키지 못할 정도로 무리 한 것 // 10시까지 자는 일은 없어야 한다. 내가 정한 bareminimum.
7. 6으로 인해 토이를 건드리지도 못한 것
8. 백엔드쪽을 공부하지 않은 것 // 결국 4주때 내 선택권은 없어졌다.
9. 시간관리를 적절히 하지 못한 것
10. 발표 준비를 그지같이 한 것 // 더 퀄리티 있는 발표를 했어야 서비스가 살아날 수 있었다.
2주라는 시간동안 정말 열심히 했다고 말 할 수 있었고, 팀원분들도 새벽 3~4시까지 공부하는 모습에 더 일찍 잘 수 없었다.
낮밤이 바뀌고, 집에만 박혀있느라 거의 짐승 몰골이었던 2주간이었다.
처음 하는 깃 플로우, 맘대로 되지 않는 코드, 엄청난 에러와 함께 한 2주였지만, 좋은 팀원들 덕분에 열심히 복습 할 수 있었다.
나의 필요에 의해서 내가 생각했던 부분을 컴퓨터로 구현하는 것이 얼마나 어려운 일인지 알 수 있었고,
에러가 더 이상 없을 때 느꼈던 기분은 정말 좋았다.
이제 조금 있으면 코드스테이츠 과정을 마무리 하고, 정리 할 수 있는 4주 프로젝트 시간이 된다.
아직 개발자 타이틀을 붙이기는 나부터가 너무 민망하지만,
저 프로젝트를 끝나고 났을 때는 개발자라는 타이틀이 어색하지 않았으면 좋겠다.
부족한 점을 4주동안 열심히 채우자