이번 포스팅에서는 Webpack 기반의 프로젝트를 Vite로 전환한 이유와 그로 인해 얼마나 개선되었는지를 다뤄보겠습니다. 제가 담당하는 관리자 프로젝트는 MUI 템플릿을 기반으로 하고 있어, 파일 수가 많아 프로젝트가 무겁습니다. 현재 이 프로젝트는 CRA 환경인 Webpack을 사용 중인데, Webpack은 개발 서버의 구동 속도가 너무 느려 Cold Start Time이 10초나 걸리고, HMR(Hot Module Replacement)도 저장할 때마다 오래 걸립니다. 심지어 가끔은 저장이 되지 않아 VSCode를 껐다 켜야 하는 상황도 발생했습니다. 그러던 중 눈에 뛴것이 바로 Vite라는 빌드 툴입니다. Vite는 프랑스어로 "빠르다"라는 의미라고 합니다. 본인들이 차세대 빌드 툴이라고 소개한 ..

이번 포스팅에서는 React Hook Form 라이브러리를 활용해 폼(Form)을 효율적으로 개선하는 방법에 대해 다뤄보려고 합니다. 제가 회사에 입사하고 처음 맡았던 업무는 관리자 페이지를 만드는 것이었습니다. 관리자 페이지는 다양한 폼 기능을 포함하고 있어, 로직을 구현하는 과정에서 여러 가지 고민을 하게 되었습니다. 그러던 중 눈에 띈 라이브러리가 바로 React Hook Form이었습니다. 이 라이브러리를 실제 프로젝트에 적용해 보니, 이전에 제가 겪었던 문제들을 해결하는 데 큰 도움이 되었습니다. 이 글을 통해 React Hook Form을 어떻게 활용해 폼을 개선하고, 상태 관리를 효율적으로 할 수 있는지 알아보겠습니다. 일반적으로 React에서 폼을 사용한다면 어떤 형태로 구현하는지부터 시작..

외주 작업을 마무리하고 취업 준비에 박차를 가한 결과, 얼마 지나지 않아 서울 마포지역에 위치한 회사에 입사하게 되었습니다. 이곳까지의 왕복 거리가 4시간이나 되지만, 탄력 근무제 덕분에 출근 시간이 자유로워 큰 부담이 없습니다. 입사 첫 날부터 약 2주간은 사수님의 지도하에 작은 업무를 수행하며 회사에 적응했습니다. 이어진 3주 차부터는 ERP 프로젝트에 본격적으로 참여하며 Axios를 사용한 RESTful API 호출, 에러 처리, 그리고 다중 필터와 페이지네이션 기능에 대해 배웠습니다. 또한, 파트너 및 기업 사용자를 위한 시스템을 개발하면서 UI/UX 디자인의 중요성을 깨달았습니다. 이번 프로젝트를 통해 이미지 최적화, 다중 이미지 처리, Form Data 활용 방법 등을 배웠습니다. 또한 사용자..

저번 2탄 외주 게시글을 올리고 외주를 마무리하면서 마무리 게시글을 올립니다. 느낀 점과 소감으로 이번 게시글을 올리면 어떨까 하는 느낌으로 작성하려고 합니다! 저는 개발공부를 진행하면서 처음으로 6월에 개인외주를 맡게 되는 행운을 갖게 되었습니다. 간단한 회사 소개 홈페이지로 시작했지만, 저의 노력과 열정으로 회사 사장님께서 만족하셔서 두 번째 외주로 백엔드까지 붙는 규모가 큰 대시보드 제작외주를 맡게 되었습니다. 첫 번째와 달리 규모가크고 페이가 큰 만큼 더욱 신경 쓰고, 프론트엔드 업무상 기획자와 백엔드 두 분과 다 소통을 진행해야 하기에 열심히 소통하며 프로젝트를 진행하였습니다. UI/UX 적인 부분은 디자이너가 따로 붙지 않기때문에 최대한 검색을 통해 레퍼런스를 찾아보며 UI작업을 진행하며 최대..