리액트2 [Next.js] Getting Started - Installation(설치하기) Next.js 공식문서 바로가기 Next.js 설치하기 React의 CRA와 유사하게 간편 설치할 수 있으며, 자동 설치와 수동 설치가 있다. 자동 설치 자동 설치의 경우, 명령어로 설치 후 기본적인 폴더 구조가 자동으로 생성된다. npx create-next-app (프로젝트명) 설치 시 아래와 같은 프롬프트가 표시된다. Would you like to use TypeScript? (타입스크립트 사용 여부) Would you like to use ESLint? (eslint 사용 여부) Would you like to use Tailwind CSS? (테일윈드 사용 여부) Would you like to use `src/` directory? (src 폴더를 사용할지 여부) Would you like .. 2023. 8. 2. react-hook-form + yup으로 효율적인 폼 관리하기 react-hook-form 공식 문서 yup 공식 문서 react-hook-form + yup react-hook-form은 사용자로부터 데이터를 수집하는 form을 좀 더 효율적으로 관리할 수 있도록 도와주는 라이브러리. 비제어 컴포넌트 방식으로 구현되어 있어 렌더링 이슈를 해결가능하며, yup은 form의 유효성 검증을 도와주는 라이브라리이며 주로 react-hook-form과 함께 사용한다. 설치 yarn add react-hook-form yup @hookform/resolvers yup 세팅 우선 유효성 검증을 하기위한 schema를 세팅한다. import * as yup from "yup"; const schema = yup.object({ id: yup .string() .required(.. 2023. 3. 25. 이전 1 다음