반응형

개발 관련/React 2

[MSW] FE를 위한 MSW를 활용한 API Mocking (세팅, 사용법) with NextJS

최근에 과제를 하면서 새로운 경험을 하게 되어 이를 글로 정리해놓으려고 한다. 과제에는 목업용 json 파일이 포함되어 있었고, 이를 활용해 화면에 data를 뿌려줘야 했었다. 어떤 방식을 쓸까 고민하던 와중, 동료 개발자가 이전에 MSW를 활용하여 백엔드 api가 없는 상황에서 개발을 하던 것이 생각나서 이를 사용해보기로 결정했다. MSW 라이브러리 설치 $ npm install --D msw 위의 커맨드로 msw를 설치해준다 MSW 기본 세팅 $ npx msw init public/ 해당 명령어를 통해 기반 코드를 자동으로 생성할 수 있다. 여기서 public/은 정적 리소스 코드를 넣어두는 폴더로, Create React App이나 Next, Vue를 활용하면 자동으로 생성되는데 이를 바로 활용할 ..

개발 관련/React 2023.08.20

[React] 언제까지 useState만 쓸래? react-hook-form으로 필드 관리하기(1)

회사를 옮기면서 Vue에서 리액트를 한지 반년이 지났다. 블로그도 그만큼 방치되어있었는데, 신기하게도 Vue 관련 게시글이 내 블로그에서는 최고의 조회수를 자랑하고 있다 처음 시작했던 것은 노마드 코더의 리액트 강의를 보고 시작했는데, 어찌저찌하다보니 지금은 리액트로 백오피스를 끝내고 (정말 어쩌다보니) next.js + react native로 어플리케이션까지 진행 중이다. 그래서 오늘부터는 조금씩 리액트를 하면서 써왔던 기술들에 대해서 복기 겸 정리해놓을 생각이다. 그리고 그 첫 타자는 react-hook-form 우리는 프로젝트들을 진행하며 수 많은 필드들을 다루게 된다. 입력필드만 하더라도 회원가입 정보, 댓글, 게시판 등 수 많은 곳에 사용이 되는데, 이를 useState 하나 없이 사용 가능하..

개발 관련/React 2022.12.28
반응형