내가 정말 잘 할 수 있을까?
너 프론트엔드 잘 할 수 있겠어?
사실 나에게 2022년은 새로운 도전의 해였다.
게임 개발자의 꿈을 가졌지만 적성에 맞지 않는다고 판단하여 과감히 걸어온 길을 포기하고, 새로운 분야를 찾기 위해 이것저것 많이 시도도 해보았다. 3월에 처음으로 Python 이라는 언어를 배우고, 코딩 원격 교육 강사 일을 시작하면서 여덟 명의 아이들을 지금까지 가르쳐오고, 4월에는 처음으로 HTML과 CSS라는 것을 다뤄보았다. 난생 처음 맛보는 Javascript의 지나친 자유로움 (?) 에 어이가 털리기도 했었고, 어찌저찌 Flask 백엔드를 구축하여 인생 처음으로 풀스택 개발이라는 것을 해보았을때는 정말 재밌기도 하면서도 내 스스로가 많이 부족하다는 생각이 들었다.
그러던 중 올해 6월에 처음으로 React라는 놈을 접하고, 간단한 사이드 프로젝트를 하나 개발하면서 "아, 나도 한번 다른 사람들이랑 개발하면서 좀 배워보자" 는 마음이 팍 들었다. 솔직히 이 마음을 이십대 초반에 먹었으면 얼마나 좋았을까, 우물 안 개구리가 밖으로 나왔을 때는, 이미 날고 기는 사람이 저 하늘 위에서 찬란한 위용을 뽐내고 있어 꽤나 주눅이 들었다. 사실 이 글을 쓰는 지금도 많이 걱정이 된다. 내가 정말 이 정글 같은 개발자 시장에서 살아남을 수 있을지, 내가 아직 부족한 지식을 더 보강해야 하는 건 아닌지 말이다.
그러던 중, 에브리타임 에서 여러 공모전 목록을 보여주고, 팀을 구할 수 있는 공간을 마련해준다는 소식을 들었다. 지난 상반기 때 호기롭게 신청한 2022 한이음 프로젝트가 시원하게 엎어진 후였던지라... 솔직히 걱정도 많이 되었다. 하지만 지금이 아니면 언제 또 이런 대외활동을 할 수 있겠나 싶어 여러 군데 지원을 하였고, 그 중 KB국민은행 에서 진행하는 소프트웨어 경진대회에서 팀원을 구하던 분들과 협업을 하게 되었다.
나에게 너무 어려운 협업
팀원은 총 5명으로 구성되었다. 기획자 한 분과 서버 개발자 두 분, 마지막으로 내가 소속된 프론트엔드 개발이 두 명이었다. 처음 프로젝트 결성 이후 회의를 진행하면서 내가 가장 놀랐던 것은, 서버 개발자 두 분이 너무나 익숙하게 협업 프로세스를 구축하셨다는 점이다. 여럿이 모여 하는 개발은 정말 이렇구나라는 생각이 들 정도로, 초기 세팅은 무척이나 빠르게 진행되었다.
무엇보다 이번 협업에서 처음으로 Figma 를 사용했는데, 부끄럽지만 나는 아직도 이 피그마가 어렵기만 하다. Photoshop은 잘만 다루겠는데 이놈의 피그마는 뭐 이리 적응이 안되는지.. 그래도 최근 사이드 프로젝트에서는 이를 적극적으로 사용 중에 있다.
프론트엔드 개발은 솔직히 조금 막막했다. 같이 개발을 진행한 분은 나보다 React를 더 오래 다루시기는 했지만, 협업과 관련된 프로세스를 많이 알지는 못하시는 듯 하였다. 따라서 협업이 처음이었던 우리는 첫 2주 간은 거의 매일 디스코드에 상주하면서 서로 화면 공유를 통해 작성된 코드를 보여주고... 또 서로 피드백을 하고.. 진짜 지금 생각하면 참 어렵게 협업을 했었다.
게다가 husky를 활용한 git convention도 사용하지 않았고, 프로젝트 폴더 구조도 매끄럽지 못하게 설계하였고.. 여러모로 처음이니 아쉬운 부분이 많았다. 하지만 그때는 정말 누가 알려주는 사람이 없었으니까. 무지했던 과거를 아쉬워 하는 것으로 마무리 지으려 한다.
내가 새롭게 배운 것은 무엇인가.
1. gitkraken
이번 공모전에서 내가 가장 잘 배웠다고 생각했던 것 중 하나는 바로 gitkraken 이다. git의 히스토리를 시각화하고 관련 기능을 지원해주는 프로그램인데, 지금까지 git bash 를 통해 일일히 작업을 진행했던 나에게는 정말로 신세계였다.
또한 git branch 전략을 어설프게나마 배워 사용하였는데, 기존에는 master 브랜치에 모든 내용을 전부 올렸다면 이제는 브랜치를 나눠서 각 역할에 맞게 기능하도록 구조를 세워 설계하였다. 실제로 이렇게 개발을 하니 충돌이 날 확률도 줄었고, 두 명이 동시에 하나의 브랜치를 건드릴 일도 없어 협업 과정에서 생긴 문제도 줄었다.
2. Notion / Slack
부끄럽지만 나는 KB 공모전을 진행하기 이전까지 Notion이나 Slack의 존재를 정말 모르고 살았다. 하지만 공모전을 시작하자마자 팀장님께서 Notion 과 Slack 설정을 막힘없이 척척 진행하시는 모습을 보니 정말 대단하다는 생각과 함께, 나도 앞으로는 저렇게 프로젝트 초기 설정을 진행해야겠구나 라는 결심이 팍 들었다.
Notion과 Slack은 내 생각보다 훨씬 유용했다. Rest API 개발에 필요한 Swagger Docs, 백엔드에게 요청을 보낼 url 등과 같은 개발에 필요한 정보와 협업에 필요한 규칙과 화면 설계서, 기능 명세서 같은 서류를 모두 Notion에서 관리하니 훨씬 협업이 편리하였다. 괜히 많은 사람들이 노션 슬랙에 열광하는 게 아니구나라는 걸 이때 비로소 느꼈다.
가장 어려웠던 것은 무엇인가
1. 서로 다른 코드 스타일을 획일화 하지 않음
앞서 말했지만, 이때의 나는 협업이라고는 1도 모르는 그야말로 햇병아리나 다름없는 상태였다. 그리고 같이 협업을 진행했던 프론트 팀원 분 또한 이러한 프로세스를 잘 알지 못했기 때문에 예견된 문제였다고 생각한다. 처음 팀원 분이 작업해주신 내용물을 pull 하여 인계 받았을 때는 이게 대체 무엇인가... 어떤 의도를 가지고 코드를 설계하신 건지 파악하는데만 기본 30분이 소요되었다.
게다가 변수명이나 함수명 같은 기본적인 컨벤션? 없었다. 지금 생각하면 정말 슬픈 현실이지만 그때의 나는 정말 무지했기에 몸으로 맞아가며 배워나갔다고 생각한다. 이후 팀원 분과의 회의를 통해 기본적인 변수명과 폴더 구조에 대한 컨벤션을 정하고, commit 과 PR에 대한 컨벤션도 세우고 나서야 개발에 소요되는 시간이 많이 줄 수 있었다.
2. 재사용성을 고려하지 않았던 무지성 개발
말하지 않았는가. 이제 고작 리액트를 배운지 2주밖에 되지 않았다고. 지금이야 "이 컴포넌트는 다른 곳에서도 자주 쓰니까 공용으로 사용이 가능하도록 별도로 분리를 해둘까?" 라고 생각할 수 있지만.. 그때는 정말 구현해야 하는 기능도 많았고, 만들어야하는 로직도 많았고, 무엇보다 와이어 프레임에 기반한 디자인 고도화를 내가 진행해야 했다. 따라서 눈 앞의 구현에만 집중한 결과물이라고 생각한다.
하지만 이때의 경험을 기반으로 Atomic Pattern. Compound Pattern 같은 디자인 패턴에 더욱 큰 관심을 가지고 이를 집중적으로 공부한 것이 지금 성장의 밑거름이 되지 않았나 싶다. 개인적으로는 정말 뼈가 되고 살이 되는 지식이라고 생각한다.
내가 얻은 것은 무엇인가
1. 개발부터 배포까지 경험해보았다.
초기 프로젝트 세팅부터 라이브러리 설치, 프로젝트 폴더 구조 설계, 전역 상태 관리와 같은 프론트엔드 개발의 기본 토대를 이번 기회에 정말 제대로 탐구할 수 있었다. 내가 프로젝트를 리드하는 입장이다 보니 주도적으로 개발을 이끌어갔고, 팀원 분도 나의 제안에 긍정적으로 반응해주셨기에 나온 결과라고 생각한다. 특히나 폴더 구조를 중반에 한번 뒤엎고 자문을 구하여 새롭게 리뉴얼한 과정은 그야말로 드라마틱하며 눈물겨운 성공의 결과라고 볼 수밖에 없었다.
2. 구현해야 할 기능이 많았기에 미친듯한 성장이 가능했다.
카카오페이 모의 결제, 모달 창 전역 관리, 검색 필터 기능, FormData로 이미지 및 기타 정보 보내기, 캐러셀 슬라이드, 캘린더 기능, 어드민 페이지, 실시간 채팅 (!) 등등.. 이번 프로젝트는 기획 규모가 컸던 만큼 프론트 단에서도 구현해야 할 기능이 한 두가지가 아니었다. 솔직히 40장이 넘는 화면 명세서를 보고 "끼에엑" 소리를 내며 뒤로 넘어가지 않은 나와 우리 팀원 분을 칭찬하고 싶었다. 이걸 정말 한 달 반만에 모두 개발할 수 있을까? 라는 소리가 절로 나올 정도의 분량이었다.
하지만 짜잔, 불가능이란 없군요. 우리는 기획 단계에서 명시된 기능을 모두 구현하는데 성공했다. 물론 시간의 문제, 그리고 지식의 문제로 테스트 코드를 작성하고 이를 기반으로 개발을 주도하는 TDD 방식의 개발 프로세스는 (절대) 도입하지 못했지만, 여러 레이아웃과 기능을 실제로 구현하면서 개인의 실력은 정말 빠르게 늘었다고 생각한다.
가장 기억에 남는 기능 구현은 카카오페이 모의 결제 구현과 Stomp.js를 활용한 실시간 채팅 기능이라고 생각한다. WebSocket이 뭔지도 모르는 상태에서 무턱대고 구현을 시도하려다 천사 백엔드 개발자 분과 7시간 동안 디스코드를 하며 열띤 개발을 진행했던 추억을 되짚으니 그때의 나, 참 열심히 달려왔구나라는 걸 느낀다.
개인적으로 아쉬웠던 점은 무엇인가
1. 깔끔한 협업 프로세스를 갖추지 못했다.
지금도 아쉬움이 크게 남는 점은 팀원 분과 매끄러운 협업 과정을 거치지 못했다는 점이다. 물론 첫 술에 배부르겠냐만은 그래도 아쉬움이 남는 것은 사실이다. 백엔드 개발자 분들이야 워낙 실력이 좋고 (거의 캐리해주셨다고 봐야 한다) 협업 경험도 많으신 터라 문제가 없었지만 프론트 파트는 그렇지 못했기 때문이다. 특히 후반부에는 시간에 쫓기듯이 개발을 했던 터라 2주 간 새벽 3~4시까지 개발을 하기 일쑤였고, 이러한 임무를 분담하지 않은 채 오로지 내가 짊어진 것은 나의 실책이라고 봐야 한다.
따라서 이후의 협업에서는 반드시 기획 단계에서 팀원 분들과 역할에 대한 분담 및 협업 과정에서 생길 수 있는 문제를 토의하여 안전 장치를 마련해놓고 있다. 이것도 내가 수확한 성과이니만큼 기쁘지만 한편으로는 아쉬운 마음이 든 것도 사실이다.
2. Typescript 미도입
진짜 왜 타입스크립트를 안 쓰고 자바스크립트로만 깡 구현을 했나 과거의 내 자신. 정말 미치듯이 후회되고 또 후회되는 포인트라고 생각한다. 실제로 모의 테스트 과정에서 ~~~ is undefined 에러를 얼마나 많이 봤는가. 타입스크립트의 엄격한 타입 지정과 strictNullCheck 기능은 박수를 받아도 모자랄 정도로 프론트엔드 개발자의 스트레스를 완벽히 줄여준다.
그래서 성과는?
결론부터 말하자면, 우리 팀 (옥상풀빛) 은 2022년 KB 국민은행 소프트웨어 경진대회에서 대상 을 차지했다.
아니 이게 진짜 말이 되나. 대상이란다 대상. 대상이 뉘 집 개 이름도 아니고 자그마치 대상 이란다.
사실 본선 진출 이메일을 받았을 때까지만 해도 나는 그저 감사한 마음이었다. 평소에 믿지도 않는 하느님 부처님에게 감사 인사까지 올려가면서 본선 진출이면 되었다고, 전혀 기대하지도 않은 성과에 팔짝 뛰고 집 안을 쏘다니며 기뻐하기 바빴다.
하지만 KB 측에서 팀 소개 영상과 프로젝트 소개 영상 (5분) 을 열흘 남짓한 시간 내에 준비해오라는 말에는 웃지 못했다. 정말 빡빡한 일정 속에서 힘겹게 강남의 오픈스페이스를 빌리고... 3시간을 풀로 촬영에 허비하고, 물론 영상 편집은 내가 맡았다. 오랜만에 어도비 프리미어와 씨름하느라고 아주 진땀을 다 뺐다.
수상식은 일산 킨텍스에서 진행하였는데, 충주에서 일산으로 가는 길이 워낙에 멀었던 탓에 우리 팀이 발표하는 모습을 보지 못하고 늦게 도착하고 말았다. 진짜 이때 발표하는 모습을 보지 못한 것이 천추의 한이었다. 왜 늦은 거냐 내 자신...
이후 시상식에서 대상 팀에 옥상풀빛이 호명되는 순간, 나는 두 팔을 번쩍 들고 환호성을 질렀다. 솔직히 참가상만 받아도 정말 감사하다고 생각했고 큰 상에 대한 욕심이 1도 없었기에 더더욱 값진 상이었다고 생각한다.
