어느덧 엘리스 AI Track 3기의 마지막 프로젝트가 끝이 났다.
프로젝트 개요
2월 초 부터 시작한 마지막 프로젝트는 3/6까지 총 5주동안 열심히 달렸다.
이번에는 인공지능 웹 서비스를 만드는게 목표였다.
주제랑 데이터 등 처음부터 끝까지 모든게 자유였다.
이번에는 AI/백엔드/프론트엔드 세 파트로 나눠서 팀이 나왔는데 다행이도 우리팀은 각 파트별로 2명씩 구성됐다.
이번에도 현업 개발자 코치님과 프로젝트에 대해 이야기를 나눌 수 있는 오피스아워 시간이 있었고, 주에 1~2회 진행했다. 주로 현재까지 진행상황을 말하고, 이슈에 대해 질문하고 우리가 짠 코드를 리팩토링 해주시는 식으로 진행했다.
그리고 엘리스에서 제안한 팀 작업 시간은 화~토였지만 우리 팀은 월~금 진행하기로했다. 그리고 매일매일 13시에 스크럼을 진행해서 각 파트별 진행상황을 공유하고 질문하는 시간을 가졌다.
주제 선정 과정
프로젝트 시작 전 급하게 진행된 디너미팅에서 코치님께서 팀원 모두가 좋아하는 주제로 선정하라해서 다시 회의를 진행했다.
비대면으로 진행하고 아무래도 서로 잘 모르는 사이여서 서로를 잘 아는게 우선이여서 스몰토크가 빅토크가 될 정도로 이야기를 나누고 ㅋㅋㅋㅋ 공통 관심사를 찾으려고 정말 애썼다. ㅠㅠ
주제를 정하는 1주일 동안 팀원들과 매일 3~4시간씩 주제를 정하고 자료조사를 하니 주제가 추려졌다.
그 중에서 마지막에 남은게 여행VS 술 이였는데 투표 결과 하나 차이로 술로 정해졌다.
나는 원래 막걸리 라벨 인식을 주장했는데 와인은 낯선 언어라서 라벨 인식을 사람들이 많이 쓰지만 막걸리는 한글이기때문에 사람들이 안쓴다는 말을 듣고 양주 인식으로 마음을 돌렸다. ㅋㅋㅋㅋ (외국인을 위한 서비스여도 좋았을 텐데..... 흑흑)
아무튼 AI팀원 중 한 분이 양주 및 칵테일에 대해 잘 아셔서 프로젝트를 수월하게 진행할 수 있었다. 자료도 엄청 많이 구해오시고,,, 정말 하드캐리해주셨다.
위에 팀원분을 보고 개발자는 개발만 잘하면 된다. 라는 말들이 무색하게 도메인에 대한 지식이 왜 중요한지 알 수 있었다.
도메인에 대한 관심과 지식이 높을수록 대화하기도 쉽고, 디테일을 더 잘 살릴 수 있겠구나 라는 생각이 들었다.
프로젝트 진행 과정
기획
주제가 정해지고나서는 먼저 와이어프레임을 그렸다.
그러고 와이어프레임을 기준으로 역할을 나눴다.
처음으로 프론트엔드 협업 작업을 했는데 프론트 팀원(이하 토끼님)분과 나의 작업 스타일이 달라서 어떤 방식이 더 좋을지 이야기를 나눴다.
나는 기능과 디자인을 한번에 진행하는 편이고,
토끼님은 기능을 만드신 다음 디자인을 붙이는 식으로 작업하시는 편이라고 했다.
그치만 나는 API가 나오려면 멀었으니 디자인이라도 먼저 완성을 시키고 거기에 API를 붙이는게 더 좋을 것이라고 이야기했다. 그랬더니 토끼님께서도 흔쾌히 그렇게 하겠다고 말씀해주셔서 작업 과정을 통일할 수 있었다.
디자인
나는 기획단계 때 부터 야놀자 처럼 모바일 퍼스트로 진행하는게 어떻겠냐고 제안했는데, 기획 이후 첫번째 오피스아워에서 코치님이 똑같은 조언을 해주셔서 내가 잘 생각했구나 뿌듯했다.
API가 나오기 전까지 디자인 작업을 마무리하는 것을 목표로 작업을 시작했다.
디자인 또한 많은 변화가 있었는데, 기획단계에서는 테일윈드를 사용하기로 했지만 둘 다 tail wind를 처음 쓰고, 클레스 네임이 너무 길어지는 단점이 있어서 material design으로 갈아탔다.
그러나 코치님께서 디자인 라이브러리는 기본으로 정해진게 많아서 수정하기도 힘들고 이 기회에 CSS실력을 늘리는게 어떻겠냐는 조언을 해주셔서 styled-component를 사용하기로 정했다.
그러고 토끼님과 상의 끝에 input태그의 통일성을 위해 input태그에 한정해서 material을 사용하기로 정했다.
디자인이 막막했지만 비비노 라는 사이트를 벤치마킹 하기로했고, 코치님 또한 잘 만든 사이트를 보고 따라 만드는게 실력을 늘리는 방법 중 하나라고 조언해주셔서 그렇게 진행했다.
이 과정에서 컴포넌트들이 이쁘게 정렬되지 않는 이슈가 있었는데 padding과 margin 속성을 이용하니 정렬이 잘 되고, 눈이 편안해지는 마법이 일어났다. 그동안 padding은 잘 사용하지 않았는데 뭐가 문제인지 확실히 알 수 있었고, 사용법도 배웠다. 그리고 flex를 열심히 사용했다.. 정말 열심히..^^
기능 개발
API 개발이 늦어져서 디자인과 함께 기능 작업을 시작했다.
더미데이터를 만들어서 데이터를 넣어줬고, 동작이 잘 되는지 확인했다. 또한 라우터 관리도 해주고 global style을 정해주기도 했다. 이 과정에서는 디자인 코드 리팩토링 작업을 하고 오피스 아워에서도 리팩토링 작업을 도와주셔서 내가 짠 로직보다 더 효율적인 코드를 배울 수 있었다!
그리고 사진을 불러와서 보여주는 작업을 처음 했는데 갓오플을 보고하니 쉽게 할 수 있었다! 스무스~~
그리고 별점 분포를 만들면서 학교에서 열심히 했던 별찍기를 이렇게 쓰는구나 ㅋㅋㅋㅋ 생각했다.
알고리즘이란 참 어디쓸까 생각하지만 다 쓰이게 되어있는게 신기하다. 실제로 알고리즘 공부를 시작하고 나서 코드를 좀 더 간결하게 짤 수 있게 되었다. 개인 프로젝트 때 처음 사용해서 무서웠던 map도 자유자재로 사용할 수 있게 되었다!! 꺄
API 개발
예상일정보다 API 개발이 늦어져서 프로젝트 막바지가 돼서야 작업을 시작했다. 일단 변수명이 기획때와 달라져서,,,^-^...대부분 수정을 했고 데이터 구조 또한 달라진게 있어서 그부분들을 수정해주었다. 개발 이후 며칠 동안은 크고 작은 이슈가 있었으나 대게 백엔드 이슈였고 금방 해결해주셔서 작업을 수월하게 할 수 있었다.
그리고 라우팅 될 때 데이터가 불러와지지 않으면 에러가 나는 이슈와, rating 컴포넌트가 작동하지 않았던 이슈가 있었는데 두 가지 모두 데이터가 null 일 때 발생한 문제였다.
둘 다 데이터가 null일 때 circle process를 보여주도록 하니 해결할 수 있었다!
요 에러를 해결하기 위해 처음에는 디폴트 값을 넣어주니 데이터가 들어왔을 때 재랜더링 되지 않는 이슈가 발생했고, 그렇다고 요 데이터들을 각각 state로 관리하자니 많아져서 전체 데이터를 state로 바꿔주고 위의 방법으로 해결할 수 있었다.
마무리 및 배포
배포는 백엔드 파트에서 도와주셨다.
도커를 이용하셔서 우리는 depoly 브랜치에 푸시만 하면 자동으로 재배포가 됐다. 이래서 다 도커를 쓰는구나 감탄했다 ㅋㅋㅋ 자동화 최고!!!!
마무리는 주로 디자인과 자잘한 이슈를 고치는데 시간을 많이 썼고, 마감일이 다가올 수록 작업시간이 늘어났다.
마감 전날에는 거의 11시간 작업했는데 진짜 너무 힘들었다 ㅋㅋㅋㅋ 시간가는줄 모르고 작업했지만 끝나고 몰려오는 피로감이 넘 힘들었다.
중간중간 취업준비를 하다보니 코테 및 면접이 있어서 작업을 못한 날도 있었지만 주말에 보충했다!
느낀점
- 협업하는게 재밌었다.
- 그동안 프로젝트를 하면서 혼자서 고민했던것들을 같이 나누니 금방 해결할 수 있었고, 마음적으로 의지가 되었다. 그리고 무엇보다 적극적이고 열심히하는 팀원들을 만나서 기뻤다.
- 같이 작업 할 때 주의해야할 점들을 배울 수 있었다.
- 폴더명부터 파일명, 변수명의 규칙을 통일해줬어야했다.
- 특히 나는 더이상 쓰지 않는 파일을 지울 때 다른데서는 사용 안하는지 확인하는 작업이 필요했다.
앞으로,,,,
첫번째로 프로젝트를 핑계로 블로그에 좀 소홀했는데, 앞으로 쌓아둔... TIL 목록들을 차례대로 올리며 블로그를 다시 열심히 써야겠고,
두번째로 타입 스크립트 공부를 해야겠다고 생각했다. 포트폴리오 페이지를 만들까 생각했지만 지금 노션 페이지가 마음에 들기도 하고 새로운걸 만들기 보단 내가 만든 jsx 프로젝트를 tsx로 바꾸는게 뭐가 다른지 명확하게 느껴질 것 같아서 개인 프로젝트를 리팩토링하는 작업을 하기로 했다.
세번째로 알고리즘 공부! 엘리스의 남은 수강 기간 동안 미뤄놨던 알고리즘 강의를 전부 수강하는게 목표다. 또한 프로그래머스에서 진행하는 코딩테스트 과정도 신청해서 그걸 열심히 해볼 생각이다.
마지막으로 취업준비! 웹 프론트엔드 개발자로 일하기 위해 인턴/신입 가리지 않고 열심히 지원해볼 생각이다. 이제 진짜 사회에 몸통박치기 할 차례,,,,,!
그리고 엘리스 리쿠르팅 기간이 끝나면 솔직한 엘리스 AI Track 후기를 작성해보려한다.😉
아무튼 구구절절 길었던 팀프로젝트 후기 끗!
🔥고생했다 나 자신🔥
그리고 나와 함께 작업한 토끼님께도 넘넘 감사함을 전하며,,,,
진짜 끗!
