본문 바로가기

MUI2

Next.js 시작하기 - 간단한 Login 페이지 만들기 (3) React-Query React-Query 사용하기지금부터 간단한 Login api를 React-query를 사용하여 구현해볼 예정이다. 앞서 언급했듯이, React-Query는 프론트엔드 api 사용에 있어 다양한 편의기능을 제공해 준다. 대표적으로 data가 갱신되면 useState를 사용할 필요 없이, 해당 data의 상태 변화를 확인하고 랜더링이 되는 기능부터, 페이지별 데이터 호출, loading 감지 등의 기능을 제공한다. 더 자세한 내용은 아래의 카카오 기술 블로그를 참고하면 좋을 것 같다. 카카오페이 프론트엔드 개발자들이 React Query를 선택한 이유 | 카카오페이 기술 블로그카카오페이 프론트엔드 개발자들이 React Query를 선택한 이유에 대해 설명합니다. 이 글은 연작 중 1편에 해당합니다. 1편:.. 2024. 7. 6.
Next.js 시작하기 - 간단한 Login 페이지 만들기 (1) Router 시작하기전체적인 프로젝트 세팅이 끝났으니, 이제 본격적으로 페이지를 만들어볼 차례다. 빠른 개발을 위해 MUI를 적극적으로 사용하여 직접 스타일링을 하는 경우를 최대한 줄이고자 하지만, React-Hook-Form과 MUI를 사용하는 것에 있어서 컨트롤적인 문제가 발생하는 부분이 있다. 때문에 이러한 문제가 발생하는 부분에 대하여 직접 스타일링을 하는 부분 또한 존재할 예정이다.만약 MUI를 어쩔 수 없이 꼭 React-Hook-Form과 사용하고자 한다면, 사용법을 함께 첨부할 예정이다. 필자는 방법을 알아내는데 너무 많은 삽질이 들어갔다.Next.js의 라우팅 방식Routing - 페이지 간의 이동을 관리하는 방법이다. NextJS 14 Folder StructureOnce again, it’s 5 .. 2024. 5. 30.
728x90
반응형