프로젝트에서 결제 로직을 구현하면서 상품 정보 페이지와 결제 페이지에서 같은 api를 중복 호출하는 문제점이 생겼다.상품 정보 페이지의 다음 로직인 결제 페이지에서는 dropdown에 표시하기 위해서였다..😭 localStorage로 관리하자니 타입 안정성이 좋지 않아서, 기존 로그인 정보를 관리하던 Context API를 사용할까 생각해보았는데판매 상품 정보는 다른 페이지에서도 필요하고 일시적인 상태이기 때문에, Zustand 라이브러리를 사용해보기로 했다. Zustand란?Zustand는 React에서 사용할 수 있는 가벼운 상태 관리 라이브러리로, Redux-Toolkit보다 간편하게 상태를 관리할 수 있다.별도의 Provider 설정이 필요하지 않고, 간단한 API로 전역 상태를 다룰 수 있다는..

이번에 새로운 프로젝트를 진행하면서,개발 환경 구축을 맡게 되었다. 앞서 진행한 프로젝트들에서도 초기 세팅을 맡았긴 했지만TypeScript와 TailwindCSS로 개발하는 것은 처음이기 때문에이번 기회에 차근차근 정리해보고자 한다.  1. Vite로 프로젝트 생성yarn create vite√ Project name: ... (프로젝트 명)√ Select a framework: » React√ Select a variant: » TypeScript + SWC 2. 프로젝트 폴더 터미널에서 installyarn 3. eslint 설정yarn add -D eslint 개발 의존성을 위해 -D를 붙여 설치한다. 이후 eslint를 typeScript에 적용하기 위해 추가적인 플러그인을 설치해준다.yarn ..