React

React

[React] useform + yup 을 활용한 회원가입 form 만들기

useform hook을 사용하면 간편하게 회원가입을 만들 수 있다. useform은 회원가입에 필요한 각각의 항목들을 state로 관리해주고 변화를 실시간으로 반영해준다. import { yupResolver } from "@hookform/resolvers/yup"; import * as yup from "yup"; const schema = yup .object({ memberId: yup .string() .min(6, "최소 6자 이상 작성해야 합니다.") .max(12, "최대 12자까지 작성 가능합니다.") .matches( /^[A-Za-z][A-Za-z0-9_]{6,12}$/, "아이디는 숫자, 영문으로 작성 가능합니다." ) .required("비밀번호를 입력해 주세요!"), passw..

React

[React] useEffect에 대해 알아야 할 사항

useEffect는 component가 rendering이 된 후 실행된다. 보통 component가 필요로 하는 데이터를 request 하는 용도로 많이 쓰인다. dependency array 어떤 값이 변할 때마다 useEffect 가 다시 실행되도록 하려면 dependency array에 해당 값을 넣어준다. 부모 컴포넌트에서 보내는 props가 변경되는 감지하여 re-rendering을 할 경우 해당 props를 dependency array에 추가해준다. useEffect의 밖에 선언된 함수 또는 변수를 useEffect 안에서 사용할 경우 dependency array에 할당하라는 에러가 발생한다. 리액트에서는 이전 값과 함수들이 저장되지 않기 때문에 component에 업데이트가 있을 때마다..

배고픈개발자
'React' 카테고리의 글 목록 (3 Page)