전체 글

2024년 새해가 밝았다. 2023년 개발자로서의 나는 얼마나 성장했고 어떤 것이 부족하며 앞으로 어떻게 할지 글을 쓰며 정리해보려 한다. 얼마나 성장했을까? 2023년 1월의 나와 지금의 나를 비교해봤을때 얼마나 성장했을지를 생각해봤다. 상태 관리와 컴포넌트를 설계하는 역량 컴포넌트 설계의 경우 함수형 프로그래밍을 학습한게 영향이 있었다. 순수한 부분과 순순하지 않은 부분을 구분 짓고 사고를 확장시켜 이를 컴포넌트 설계에도 적용하려고 했던 것이 도움이 됐다. 상태 관리는 Redux, Tanstack Query와 같이 여러 상태 관리 라이브러리를 써보면서 공통되는 원칙을 기반으로 한게 도움이 됐다. 최소한의 데이터를 상태로 정의하며 이를 가져오도록 selector를 사용하되 컴포넌트에서는 최대한 작은 데..

네트워크로 데이터를 가져오는건 느립니다. 데이터가 지구 반대편에 위치한다면 더욱 느려지겠죠. 우리는 데이터를 더 빠르게 가져올 방법이 필요합니다. 그 중에 하나가 HTTP cache를 활용하는 것입니다. 프런트엔드 개발자로서 어떤 사이트든 개발자 도구로 분석해보면 보이지 않는 곳에서 HTTP cache가 유용하게 사용되고 있는 것을 확인할 수 있습니다. HTML을 가져올때, 이미지나 비디오를 가져올때, Javascript,CSS 등 critical resources에도 HTTP cache는 사용됩니다. 그럼 왜 HTTP cache가 필요한 걸까요? HTTP cache가 필요한 이유 HTTP cache를 사용하면 느린 네트워크를 통해 데이터를 가져오는 것이 아니라 사용자와 가까운 브라우저, 웹 서버 등으로..

웹 성능서비스가 커지고 기능이 많아질수록 프런트엔드에서 많은 데이터를 관리하게 됩니다. 제가 현재 개발하는 AI SaaS에서는 one page에서 수백, 수천개 이상의 블럭 데이터, 미디어 파일들에 대한 상태관리를 하고 있습니다. 사용자 경험을 개선하여 KPI를 향상시키기 위해서 성능 최적화의 필요성을 많이 느꼈습니다. web.dev의 웹 성능에 관한 글이 있어서 이를 소화하고 팀원들에게 공유해보려 합니다.웹 성능이 왜 문제일까?시간이 지날수록 콘텐츠를 소비하기 위해 더 많은 유저들이 웹을 사용합니다. 유저들의 눈높이가 높아지면서 여러 서비스들을 비교해보며 느리거나 반응이 좋지 않은 서비스는 자연스레 사용하지 않게 됩니다. 저만 하더라도 어떤 서비스를 사용할때 유튜브나 인스타그램처럼 최적화가 잘 되어있는..

팀 기능 (2023.10.15 ~ 2023.11.14) 한달동안 팀 기능 개발을 완료하여 운영환경에 배포했습니다. 기존의 스프린트 방식의 프로세스에서 shape up 방식의 프로세스를 처음 경험하다보니 시행착오를 겪었지만 운영환경에서 유저들이 잘 사용하고 있는 것을 보니 나름 잘 해낸 것 같네요. 잘한점 할당된 작업과 추가적인 작업들을 빠른 속도로 개발 및 수정하여 다른 팀원들의 부담을 줄이고 더 빠르게 테스트를 하도록 했다. 기존의 UI, 비지니스 로직을 따로 개발하는 것이 아닌 MSW를 사용해 함께 개발하도록 프로세스를 개선하여 연동할때 이슈가 발생하지 않도록 했다. 못한점 디테일한 디자인을 놓치는 경우가 많았다. 개발 상황에 대해 팀원들에게 자주 공유하지 않았다. 개발하면서 테스트를 작성하지 않았다..