3차 프로젝트 회고

피시본·2023년 1월 4일
0

프로젝트 기간

2022년 11월 14일 ~ 12월 16일 총 5주


기획

데이터 분석과 인공지능을 결합한 프로젝트를 기획하게 되었다.
이제껏 학원에서 배운 모든 걸 총집합한 주제를 기획하다 보니 확실히 나오는 주제 범위가 넓어지고 다양해졌다. 재밌는 주제가 많이 나왔는데 문제가 있었다. 우리가 원하는 대로 인공지능을 세세하게 다룰 만한 자본도, 실력도 없다는 것...
인공지능 쪽을 지망하는 팀원도 없다 보니 이 부분은 최소한으로 가져가는 게 좋겠다는 코치님의 의견이 있었다. 현실적으로 맞는 말이기에 인공지능 파트는 비교적 단순한 분류 작업에 초점을 맞추게 되었다.

그렇게 탄생한 AI 견종 분석 서비스! <나는뭐개🐶>
강아지 사진을 넣으면 종을 분석하고 분석 결과를 유저들과 공유할 수 있다. 더불어 랜선 견주끼리 커뮤니티도 형성할 수 있는 서비스를 기획하게 되었다.

기술 스택

프론트엔드
React typescript vite styled-components MUI

백엔드
Node express AWS S3 AWS RDS

AI
Flask Python

ETC
prettier ESLint Figma Whimsical Gitlab

역할

1차, 2차 프로젝트와 같이 프론트엔드 파트를 선택했다.
2차 때 회원가입, 로그인만 주야장천 하던 기억에 이번엔 욕심 내서 후기 게시판과 커뮤니티 게시판 파트를 맡겠다고 했다. CSS 만지는 게 너무 재밌어서 메인 페이지부터 자잘한 전체 디자인도 자진했다.

우여곡절

  1. 협업
    처음 겪는 우여곡절이 있었다.
    프로젝트 5주 중 2주 반 쯤 지났을 때 개인 사정으로 갑자기 팀장님(백엔드)이 팀을 나가게 되었다. 워낙 실력도 좋고 소통도 활발하던 분이어서 마른 하늘에 날벼락 같은 심정이었다. 진심으로 붙잡고 싶었지만 개인 사정이라 말하는 팀장님의 목소리가 무거워 선뜻 나서질 못했다. 게다가 제일 중요한 마지막 프로젝트인데 팀장까지 맡은 본인 속은 어련하겠는가... 받아들일 건 얼른 받아들이고 프로젝트를 잘 마치는 게 우선이라는 생각에 남은 팀원과 으쌰으쌰 하려고 엄청 노력했다.
    문제는 이 주에 백엔드가 기본 기능 API를 짜서 우리 쪽으로 넘기기로 했는데 이 부분이 늦어진 것...! 우리는... 우리는 개발 초보라고...! ㅠ ㅠ
    일단 추가 기능은 두고 기본 기능 구현을 완벽하게 하기로 목표를 다시 세웠다.

  2. 처음 써보는 타입스크립트
    플젝 시작 전까지 3주 정도 시간이 있어서 그동안 타입스크립트 공부를 했는데 이론만 공부하다 보니 전혀 감이 안 잡혔다. 알쏭달쏭한 상태로 프로젝트에 투입... 한 번 부딪쳐 보자는 마음이 컸다.
    실전은... 정말 어려웠다. '이걸 왜 쓰는 거지?' 코딩을 하는 나 자신에게 묻기를 수십 번...
    사람은 적응의 동물이라고 마구 부딪치다 보니 장점이 보이더라. 자바스크립트가 동그란 원이라면 타입스크립트는 각이 있어서 어느 모서리에도 쏙 들어가는 느낌이었다. 아직 코딩 초보라 코드를 치다 보면 내가 뭘 하고 있는 거였지? < 하면서 길을 잃기도 하는데 타입을 지정해 착착 맞추는 형태다 보니 길 잃을 일 없이 코드를 칠 수 있었다. 퍼즐 맞추는 것 같아서 재밌기도 하고...?
    앞으로도 쭉 타입스크립트를 애용할 예정이다.

  3. 실현 못한 추가 기능
    구현한 기능이 대부분 기본적인 crud라 너무너무 아쉬웠다... 그래서 팀원들이랑 프로젝트가 끝나도 함께 리팩토링하기로 했다! 😄😄😄
    글을 작성하는 지금(2023.01.04) 리팩토링 중이다. ㅎㅎ 해보고 싶은 거 다 해보자는 마음도 같아서 이것저것 추가 기능을 더 넓혀볼 예정이다. 기쁘다!

  4. 배포
    이제껏 프로젝트를 하면서 배포에 어떤 문제도 없었기에 안일했다. 안일하고 말았다 . . .
    시간에 쫓기기도 했고, 배포를 늘 발표 하루 이틀 전에 했기에 이번에도 하루 전에 다른 팀원분이 배포를 맡았다. 그러나... http <-> https 문제에 가로막혀 발표까지 배포가 되지 않았다. VM이 열려 있을 때까지 며칠 내내 팀원 전부 매달렸는데 도대체 뭐가 문제인 건지 결국 배포에 실패했다.
    그래서 리팩토링할 때 배포까지 끝마치는 것이 우리의 목표! 할 수 있어~~! 🔥🔥🔥
    이 과정은 낱낱이 벨로그에 기록할 예정이다.


배운 점

  1. 이미지 업로드 구현
    form-data로 이미지를 넘기고 받는 부분이 유난히 어려웠다. 한 장을 보내는 건 어찌저찌 알겠으나 여러 장을 DB로 보내고 받아와 띄우는 과정에서 삽질을 많이 했다. 이 부분은 벨로그에 따로 작성하고 링크를 달아둘 예정이다. 여전히 수정할 부분이 산더미지만... 지금으로서는 과정을 이해하고 잘 보내고 잘 받으면 됐다!

  2. 프롭스 연결
    이 부분을 꼭 담당해보고 싶었는데 이번에 원없이 했다.
    프롭스로 데이터를 보내기만 하면 되는 줄 알았더니 그 와중에 더 깔끔하고 간소하게 보내야 하는 거더라. id 값만 넘겨주는 것과 딱 부모에서 자식으로만 넘기고 받는 것을 신경 써야 한다. (리팩토링할 때 제대로 다루어볼 것!)

  3. 제대로 질문하기
    코치님이 문제에 부딪칠 때마다 이슈를 올리라며 질문을 제대로 할 줄 알아야 한다고 몇 번이나 강조하셨다. 무엇을 모르는지 정리할 줄 아는 것과 모르는 것을 명확하고 구체적으로 설명할 줄 아는 게 중요하다고 하셨다. 실무에서도 '잘' 질문할 줄 알아야 한다며 이슈 올리기를 과제로 내주셔서 하루에도 몇 번씩 질문을 정리해볼 수 있었다.

  4. 성장
    불꽃 같이 성장했다.
    코치님들이 열과 성을 다해 도와 주셨고 팀원분들도 저력을 다해 서로 묻고 도왔다. 성장하지 않을 수 없던 환경이고 배경이었다. 어려웠던 것도 계속 하다 보면 익숙해지고 익숙해지다 보면 점차 응용할 수 있게 된다. 코딩에서도 이걸 느끼다니... 성장이 느껴져서 신나고 즐거웠다.

리팩토링 때 신경 쓸 것

  1. 프롭스 드릴링 정리
  2. 재사용성 고려해서 기존 기능 hook으로 정리
  3. 추가 기능
    • 웹소켓을 활용한 실시간 채팅
    • 간편 로그인 / 메일 인증
    • 결과 공유하기
    • 지도 API
    • AWS EC2를 이용한 웹 페이지 배포

🔥🔥🔥아자아자 파이팅🔥🔥🔥
profile
Hello, World!

0개의 댓글