FE 신입 개발자 6개월차 회고록

KoJaem·2023년 10월 29일

회사에 입사하고 내가 처음 맡게 된 업무는
legacy 한 기존 코드들을 최신 트렌드에 맞게(?) 수정하는 작업이였다.

체계적인 온보딩 과정이나 그런거없이,
코드 한번 쭉 봐보고 공부해보라는 식으로 시작을 하게 되어서 많이 아쉬웠지만
나름대로 잘 적응해서 냈던 성과에 대해 적어보려고 한다.

처음 맡게 된 업무 (레거시 코드 마이그레이션)

내가 처음 입사했을때의 회사 상황은
자사 프로젝트를 몇개 운영중에 있는데
그 중 근본이 되는 Admin 프로젝트에서
Redux, typesafe-actions 등의 라이브러리를 사용하고 있었는데
이걸 SWR 로 마이그레이션 하는 중이였다고 한다.

처음 내가 legacy 한 코드를 봤을때는... 너무 충격이였다.

네이밍 컨벤션도 뒤죽박죽에, 한 컴포넌트마다 대부분 코드줄이 최소 600줄이고,
확인해보니 컴포넌트를 분리해서 재사용하는게 아닌 복붙으로 사용하고 있고...
많이 심각해보였다. (이게 현업인건가..?)

(나중에 알게 된 사실인데, 해당 프로젝트는 여러 사람들이 조금씩 거쳐갔던 프로젝트였다고 한다..
내가 오기 바로 전 Admin 을 담당하던 퇴사자도 있었다고..)

진짜 사용하는 코드 (문제가 될 수 있으니 모자이크 처리 했다)

아무튼 SWR 마이그레이션은 기존 코드들이 너무 복잡해서
코드를 이해하면서 수정하려다보니 굉장히 오래 걸렸고,

마이그레이션을 하면서 First Load JS 번들사이즈를 줄이면서
빌드 성능에도 굉장히 도움이 많이 되었었다.
(학생때 따로 번들사이즈를 줄이려고 노력해본적은 없어서 이 내용은 꽤나 도움이 되었다.)

First Load Js 를 줄이는 방법을 사용하지않는 자바스크립트 코드를 줄이고,
빌드타임에 필요한 모듈이 아닌경우, 런타임에서 모듈을 불러오게 하면 된다 정도 였다.

이해하기 쉽게 말하자면
라이브러리를 사용할때 import 를 할때 Tree Shaking 을 잘 해서 import 하고,
dynamic import 를 잘 활용해라. 정도로 말할 수 있을것 같다.
(물론 더 심화된 내용도 있기야한데, 당시에 내가 적용한건 이 정도 선이였다.)

결과물

Before	After

First Load Js Shared by all 값도 많이 줄이고, 평균적으로도 많이 줄인것 같아서 기분이 좋았다. (아직도 빨간색인것이 대부분이지만, 첫 시도치고는 성공적이라고 생각해야지)

또, 우리회사 전체적으로 Formik 을 사용하고 있었는데,
이 코드 또한 SWR 마이그레이션을 하는 겸 React-Hook-Form 으로 수정하는것은 어떠냐는
의견을 2주마다 진행하는 스프린트 미팅에서 내가 제시했는데,
이런 의견 내는거 너무 좋다고 좋아하시면서 바로 도입하자고 하셨다. (뿌듯 😎)

Formik Github	React-Hook-Form 깃허브

설득을 할 수 있었던 내용을 짧게 설명하자면
Formik 은 제어 컴포넌트기반,
React-Hook-Form 은 비제어 컴포넌트 기반 (제어컴포넌트 기반으로 수정 가능)
이기 때문에, 성능 상 React-Hook-Form 이 우세한 점이 있고,
핵심적으로 Formik 2021년 이후로 개발이 거의 중단됐고,
React-Hook-Form 은 계속해서 개발이 진행되고 있다는 점을 이야기 했더니,
그럼 React-Hook-Form 을 책임지고 마이그레이션 해보라고 하셨다.

Admin 프로젝트는 사실 상 우리 DB에 있는 데이터들을
CRUD 하기위해 만들어진 프로젝트이기 때문에 만들어진 폼을 수정한다는것은 대 공사였지만,
책임지고 해보라는 말에 도전정신이 불타올라서 해보겠다고 했다.
(결론은 성공적이였다 👍)

SaaS 프로젝트요? 제가요? (갑자기요?)

3개월정도 이 ~~지긋지긋한~~ 마이그레이션이 끝나고나서
회사 코드와 도메인에 익숙해질 무렵..

퇴사자가 발생했다..!

퇴사하시는분은 약 1년3개월정도 이 회사에 근무하셨던 분이셨고,
이분이 하고 계시던 SaaS 프로젝트를 내가 인수인계 받게 되었다.

소비자와 가장 밀접하게 연관되어 있는 중요해보이는 SaaS 프로젝트를
입사한지 3개월밖에 안된 내가 받게 되리라고는 상상도 못해봤는데 아무튼 그렇게 되었다.

일주일이라는 짧은 기간동안 인수인계를 끝으로, SaaS 프로젝트의 담당자는 내가 되었고,
지금까지 SaaS 를 개발 및 유지보수를 하고 있다.

이 SaaS 의 대한 내용은.. 진짜 많기 때문에 추 후 SaaS 프로젝트 관련해서 글을 한번 더 써야겠다..ㅎㅎ

그래서 요즘 근황은?

요즘은 회사에서는 SaaS 프로젝트와 Admin 프로젝트를 병행하면서 열심히 신규개발 및 유지보수를 하고 있다.. ㅎㅎ
(Admin 이든, SaaS 든 하나의 프로젝트에만 집중적으로 하고싶다고 요청을 한번 드렸지만,
계획에 없던 퇴사자 발생으로 인해 인력이 부족하니 조금만 힘내달라고 해서 버티는 중인 상황)

또, 마음이 맞는 동료분과 Flutter 를 사이드 프로젝트로 진행중이다.

갑자기 뜬금없이 Flutter 를 왜 하나 싶으실수도 있는데, 이 이야기도 추 후 간단하게 한번 적어볼 계획이다. (취업하고 꼭 도전 해보고 싶었던게 있었기 때문에 슬슬 시동거는중)

아무튼 공부목적으로 간단한 주제로 첫 프로젝트를 진행하고,
내가 하고싶은 주제로 제대로 프로젝트를 진행해보려고 했는데,

CTO님과 대화도중, 어플 관련해서는 관심이 없느냐는 질문에
안그래도 퇴근하고 나서나, 주말에 Flutter 를 따로 조금씩 공부하고 있다는 내용이 나오면서
퇴근하고 이런거를 또 한다는게 대단하다고 칭찬 해주시면서 재미있어 보인다면서
CTO님도 참여할테니, 회사에서도 사용할 수 있는 프로젝트로 같이 하자고 하셔서
주제를 변경하여 진행하고 있다.

(공부목적으로 시작한 프로젝트 치고는 갑자기 너무 커진거 같긴한데,
성장에 도움이 많이 될것같기도하고, 실력을 어느정도 인정받은것 같아서제안해주셨을때 솔직히 기분 좋았다.)