2024. 3. 13. 19:18ㆍ카테고리 없음
아키텍쳐
코드스쿼드에서 팀 프로젝트를 진행하면서 처음 사용했던 리액트. 팀 프로젝트 당시엔 데모도 해야하고 백엔드가 제공해준 API를 화면에 그리지 못하면 민폐라 생각해 마구잡이로 컴포넌트를 짜고 어떻게든 화면만 그렸었다. 하지만 항상 마음 속에 무언가 찜찜함이 있었다.
이렇게 지저분한 코드로 어떻게든 화면만 그려내는건 내가 원했던 개발자로서의 모습이 아니었다. 리액트를 처음 배운다는, 팀원들에게 화면을 보여줘야 한다는 핑계 뒤에 숨어 마구잡이로 컴포넌트를 짜고 있다가 문득 이런 생각이 들었다.
지금 내가 하는 프로젝트가 그렇게 큰 프로젝트도 아닌 것 같은데, 만약 회사에서 더 큰 프로젝트를 만들 때 내가 수많은 수정사항들을 다 처리할 수 있을까?
주어진 피그마대로 화면을 그리는건 쉽다. 하지만 내가 걱정했던 건 수정에 대한 두려움이었던 것 같다. API에서 뭐 하나만 바뀌었다고 백엔드 팀원이 말해주고 나면 스트레스가 몰려왔다. ctrl + f를 해서 기존걸 일일히 찾고, 하나하나 수정하고.. 하지만 이렇게 수정해도 결국 오류는 터졌다. 다시 코드를 하나하나 봐보면 놓친 부분들이 있었다. 그리고 하나의 수정사항에 여러 로직이 얽히고 섥힌 여러 파일들을 모두 봤어야 했다.
그러던 중, 다른 팀의 코드리뷰를 보게됐다.
만약 지금 fetch 들을 모두 axios로 바꾸려면 어떻게 해야할까요?
내가 원하던게 뭔지 스스로 모르던 상태에서 내가 어떤 부분을 공부하고 싶어하는지 알 수 있었다. 어떻게 하면 코드 수정을 최소화하고 무언가를 변경할 수 있을까? 코드 수정을 최소화 한다는 것은 기능 수정에 있어서 내가 신경 써야 하는 부분이 적어지고, 내가 겪었던 휴먼 에러를 최소화 하는 것이지 않을까?
개발을 공부하면서 정말 많이 들었던 말이 있다. 중복을 제거하세요, 작게 나누세요, 관심사를 분리하세요. 이 말들을 지겹다고 느낄 만큼 많이 들었는데도 내 코드에 적용시키기 어려웠던 이유가 뭘까? 관심사를 분리하기 위해선 어떤 관심사가 있는지 알아야 한다. 하지만 난 어떤 관심사들이 있는지 몰랐다. 아키텍처를 공부하면 프로그래밍 세계에서 보통 어떤 관심사들을 가지는지 알 수 있을거라고 생각했다.
단순히 리액트 컴포넌트를 짜는걸 넘어 프로그램 다운 프로그램을 만들어보고 싶다는 욕심이 있었던 것 같다.
타입스크립트
사실 코드스쿼드 세컨드핸드에서 타입스크립트를 사용하긴 했는데 안사용한거나 마찬가지였다. 대부분 any를 사용하거나 primitive 타입 정도만 타입을 사용했던 것 같다.
그래서 이 프로젝트를 기반으로 타입스크립트가 장애물이 아닌 날 도와주는 도구로 변모(?)시키기 위해 처음부터 타입을 내 나름대로 체계적으로 사용하며 부족한 부분들을 학습했고, 결과적으로 프로젝트를 마무리한 지금 앞으로 프로젝트에서 타입스크립트를 사용하지 않는 일은 없을 것 같다. 코딩을 더 편하게 해주는 도구로 만드는데 성공했다.
부가적으로 클린 아키텍쳐 레퍼런스가 대부분 OO 기반으로 되어있어서 뜻하지 않은 수확도 있었다. 학교에서 java를 배울 때 인터페이스가 뭔가 엄청난 힘이 있는것 같다라는 느낌을 받았었는데, 리액트에서 타입스크립트를 사용하는 경우 사실상 type과 유사한 용도로만 사용되고 있었다. 하지만 클린 아키텍쳐에서는 인터페이스를 굉장히 적극적으로, 어쩌면 핵심적인 아이디어로 사용하기 때문에 OOP에서 중요하게 생각하는 인터페이스에 대한 지식을 얻을 수 있었던 것 같다.
웹팩
한번씩 어떤 환경 위에서 내가 일하고 있는지 모른다는 느낌이 들었다. CRA는 무슨 마법을 부렸기에 jsx를 사용할 수 있을까? 왜 CRA가 아닌 다른 곳에서 jsx 구문을 사용 못할까? 한 명의 프론트엔드 개발자로서 내가 어떤 환경이기에 이런 jsx를 사용할 수 있는지 이해하지 못하고 있다는게 스스로 답답했다.
그래서 CRA나 vite를 사용하지 않고 직접 웹팩으로 개발 환경을 구성해보게 됐다. 결론만 적어보자면 dev mode에 대해선 적어도 내가 편하게 개발을 할 수 있는 dev server를 구축할 수 있었다. production mode에 대해선 여러가지 최적화 테크닉을 찾아보고 적용해보았지만, 어느정도는 정형화된 테크닉들이지 않을까 싶었다. 물론 프로젝트 환경에 맞게 미묘하게 최적화가 달라지겠지만.. 이런 생각 때문에 빨리 회사에 가서 실제 프로덕트를 만져보고 싶다는 생각이 든다. 내가 만든 사이드 프로젝트에선 정형화된 최적화를 적용해야 하지만 현업에 쓰이는 프로덕트의 특성을 이해하고 그에 따른, 프로덕트에 딱 맞는 최적화에 도전해보고 싶다.