📌기업 소개
- 기업명 : 스톡폴리오(Stockfolio)
- 기업소개
공정성을 추구하는 크리에이터에게 편리한 환경을 조성 및 제공해주는 스타트업이다.
누구나 손쉽게 크리에이팅할 수있는 세상을 꿈꾸며, 현재는 ‘영상 콘텐츠 제작의 간소화’라는 미션을 실행하고 있다.
스톡폴리오는 영상 클라우드, 스톡 영상 제공, 편집자 매칭, 영상인의 뉴스레터 등 다양한 서비스를 통해 공정하고 건강한 콘텐츠의 선순환 생태계 조성을 만들어 나가는 것을 목표로 한다.
📌기업협업 프로젝트 소개
영상 컨텐츠 검수용 사내 모니터링 툴 개발
- 각 영상을 대기중, 반려, 승인 총 3가지 상태로 분류하고, 대기중인 영상을 클릭하여 반려 사유를 작성하여 제출하거나 혹은 승인을 하면 해당 영상이 대기중 탭에서 반려 혹은 승인 탭으로 이동하게된다.
- 프로젝트 기간 : 22.05.09 ~ 22.06.02 ( 4주 )
- 프로젝트 참여 인원 : 5명 ( 프론트 3명 , 백 2명 )
- 깃헙 링크
🎥모니터링 툴 시연 영상
📜기술 스택
Front-End
- 개발언어 :
Typescript- UI 라이브러리 (웹 프레임워크) :
React- CSS in JS 라이브러리 :
styled-componets- 상태관리 :
MobX
Back-End
- 개발언어 :
go- 웹 프레임워크 :
echo- DB :
MySQL- ORM :
gorm
📌4주간의 과정
⭐Daily
- 스탠드업 미팅 (15분)
- 오늘 할 일 공유
- 코드 리뷰
🌒1주차
- 깃헙 이슈 에픽 , 스토리 , 테스크 분류
- 컨벤션 설정
- 피그마 바탕으로 아토믹 디자인 패턴 분석
🌓2주차
- atoms , molecules , organisms 개발 시작
- styled components theme, global style 구현
🌔3주차
- templates , pages 개발 시작
- 이벤트 처리
- API 연결
- MobX 전역 상태관리 스토어 구현
🌕4주차
- 디자이너 QA
- 리팩토링
📌기업협업 회고
🧐프론트는 아무도 믿어서는 안된다
기업협업을 하면서 한번은 프론트 담당자분께서 우스갯소리로 "프론트는 아무도 믿어서는 안된다~" 라는 말을 했다.
실제로 그 말의 의미는 정말로 아무도 믿지 말아라 라는 의미보단, 그만큼 프론트에서 클라이언트 , 디자인 , 기획 , 백엔드 와 같은 여러 다양한 변수들에 대응할 수 있게끔 준비하고 유동적인 코드를 짜는 것이 좋다 라는 말이였다.
그래서 실제로 매일 코드 리뷰를 할 때도 분기 처리 , 에러 처리에 대해서 자주 이야기를 했다.
이전에 2차 프로젝트까지 진행하면서는 내가 짠 코드들이 구현이 되는지에만 집중을하여 코드를 짰고, 항상 데이터를 받아오는 것이나 여러 다른 기능 구현이 잘 된다는 것을 기정 사실화 하여 바탕에 깔아두고 코드를 짰다.
그런데 실제로는 가장 기본적이게 백엔드로부터 데이터를 받아오는게 느리다거나, 받아오는데 실패를 한다거나 혹은 더 나아가 내가 생각하거나 상상할 수 없는 다양한 에러나 이슈들이 발생할 수도 있다.
위의 사실들은 어찌보면 당연한 것이라 지금에서야 새삼 다시 느끼게 된것이 아쉽지만 지금부터라도 늘 인지하고, 분기처리나 에러처리가 잘 되어있는 코드를 짜는 노력이 필요하다.
🤗코드 짜서 남준다
기업협업을 시작한 첫 주에 컨벤션을 정하고, 아토믹 디자인 패턴에 맞게 컴포넌츠를 어떻게 분리할지를 같은 팀원들과 이야기 하였다.
이전에 1,2차 프로젝트를 팀원들과 진행하면서 정하던 컨벤션 보다 훨씬 더 디테일하고, 엄격한 기준으로 컨벤션을 정하는 것이 쉽지 않았다.
아토믹 디자인 패턴 또한, 처음 접하는 디자인 패턴이다보니 그 기준에 맞게 컴포넌츠를 분리하는 것에 많은 어려움을 겪었고, 이틀 넘게 시간을 들이고 나서야 컨벤션과 아토믹 디자인 패턴을 마무리 할 수 있었다.
그러나, 컨벤션과 아토믹 디자인 패턴 덕분에 이후에 작업에 속도가 붙어 컴포넌츠 작업, 이벤트 처리 및 API 연결등의 작업을 할 때 훨씬 더 수훨하게 작업을 할 수 있었다.
코드 리뷰를 하면서 분기,에러처리 다음으로 프론트 담당자님으로부터 가장 많이 들었던 말이, "누가 봐도 알아볼 수 있는 코드여야 한다" 라는 말이였다.
부트캠프를 하는 동안 멘토님으로부터도 "가독성이 좋은 코드"에 대해서 많은 이야기를 들었었는데, 이번 기업협업을 하면서 한번 더 "남을 위한 코드" , "가독성 좋은 코드" 에 대해서 생각해 볼 수 있었다.
코드 짜서 남준다 ( 그러니까 코드 잘 짜자 )
🤯멘탈은 깨지라고 있는것이다
이번 기업협업에서 개발언어로 JS가 아닌 TS를 사용하였고, MobX 라이브러리를 통해 전역 상태관리를 하였다.
이전에 React를 처음 배울 때에도 배움의 과정에서 멘탈이 부숴지고 깨지면서 어려움을 겪었던것처럼, 이번에 TS 와 MobX를 배우면서도 똑같은 과정을 겪었다.
몇번 부숴지고 깨져보면서 느낀건 근력 운동을 통해 근육에 손상을 일으키고 휴식을 통해 근성장을 이루는 것 처럼,
멘탈이 깨지고 나서야 비로소 내가 무엇을 배우고 어떻게 사용해야하는지를 깨닫기 시작하면서 성장해 나가고 있구나 라고 느낄 수 있었다는 것이다.
이전에는 무언가를 배울 때 어려움을 겪고 멘탈이 깨지면, "나는 여기 까지구나" , "이렇게 어려운걸 내가 어떻게 하냐" 라는 생각과 함꼐 좌절감과 같은 부정적인 감정만을 느끼곤 했는데,
지금은 "아 드디어 성장을 하겠구나" , "잠시 휴식을 가질때가 되었구나" 라는 등의 나를 한번 더 돌아보고 제대로 된 성장을 위해 휴식을 가질 수 있는 여유가 생겼다.
