# yup

sju4486

24-1 HOF와 로컬 스토리지를 활용한 기능 만들기24-2 react-hook-form24-3 검증 라이브러리(yup)브라우저 저장소를 이용하면 비회원 전용 장바구니를 구현할 수 있다.쿠키, 로컬 스토리지, 세션 스토리지 중 어떤걸 선택해도 상관없다.각 브라우저 저장

creyon0215

INDEX HOF&로컬 스토리지를 활용한 기능 만들기 (예시 코드) 코드를 구현하며 쿠키, 로컬 스토리지, 세션 스토리지 중 어떤 것을 이용해도 좋다. 각 브라우저 저장소의 특성을 고려해 기획 의도에 적합한 저장소를 선택할 것 비회원 장바구니 기능 구현 1) fet

wyswhsl21

개발기간이 2주뿐이여서 기능 구현에만 집중한 나머지 블로그 정리할 여건이 되지 않았다.mvp 기능까지 구현을 마친 상태에서 밀린 포스트를 작성하려고 한다.내가 프로젝트에서 맡은 구현은 로그인과 회원가입 기능이고 내가 이 기능을 맡은 이유는평소 경험하지 못했던 파트이기도

hyorimm

React Hook Form 과 YUP을 사용하여 훨씬 편하게 유효성 검사 구현을 해보자

kimdongeun12

폼을 자동으로 만들어주는 라이브러리 React-Form Redux-Form - redux에서만 사용이 가능하다는게 단점 Formik - 3년전까지만해도 유명했었음 클래스형에서 함수형으로 이동하면서 떨어짐(러닝커브가 심함) React-Hook-Form - 함수형에서

yj05037

로그인, 회원가입을 react-hook-form 사용해 바꿔보기import CreateUserButtonPage from "../buttons/createUserbutton/button";import CreateUserInputsPage from "../inputs/c

zoo0

React-hook-form 제어 컴포넌트는 입력할 때마다 state에 저장되는 방식으로 동기화에 초점이 맞춰져 있다. ex) 안녕 -> ㅇ,ㅏ,ㄴ,ㄴ,ㅕ,ㅇ 비제어 컴포넌트는 state에 저장하지 않고 필요할 때 document.getElementById나 useR

yj05037

어제수업내용을 정리해본다.사실, 게시판 만드는데 배운걸 적용해보느라 시간이 훌쩍가... 오늘이 되었다.늘 강조하시는 부분이지만, 코드를 유지보수 쉽게하기위해 리펙토링이라는 과정을 거쳐야한다.코드를 간단하게 최대한 줄이는 것이다.그러나 쉽지는 않았다...폼을 자동으로 만

badassong

폼들을 어떻게 하면 효율적으로 관리할 수 있을까?Formik이 원래 인기가 많았으나, 클래스형 컴포넌트에서 함수형 컴포넌트로 넘어가면서 '굳이 Formik을 써야하나?' 라는 인식이 생겨 굉장히 편리한 React-hook-form이 나왔다. 사용법도 쉬워서 요즘 많이

deepthink

이제 유효성 검사를 추가한 formik을 살펴보자.yup을 쓰는건 아니고, 먼저 기본적으로 if 문을 사용하여 유효성 검사를 하는 형태다.커스텀한 유효성검사 함수 validate를 만들고, 그 안에 initialValue 중 유효성 검사가 필요한 애들을 조건문으로 정의

deepthink

이번 프로젝트에서 방을 생성하는 모달을 만들어야 했다.방을 만들며 몇몇 부분에 대해 유효성 검사를 해야했고, form의 형태로 백엔드에 데이터를 넘겨줘야한다.리액트에는 form을 위한 다양한 라이브러리들이 있는데, 그 중 formik이라는 친구를 사용해보기로 했다.구글

tootb

아직 서버 연결이 되지 않아서 기다리는 겸 유효성 검사 부분 코딩을 먼저 진행했다. typescript로 진행하는 것은 처음이어서 검색을 하던 중, yup 이라는 좋은 라이브러리를 발견했다react-hook-formyup@hookform/resolvers다음 명령어를

nanyong0214

react-hook-form > 우리는 이전까지 state를 직접 만들고 onchange함수도 일일이 만들어서 바인딩해주었음. 그러나, 폼 라이브러리를 이용하면 더이상 이러한 코딩을 하지 않아도 된다. 폼 라이브러리에는 react-form, redux-from, re

rlaclgns321

검증 라이브러리로 대표적인 것이 yup 입니다.

hjkdw95

언제까지 util/validate.js 만들어 사용할꺼야

hmds1606

기존에는 useQuery를 사용해서 데이터를 불러오는 방법을 사용을 했다.하지만 useQuery는 내가 원하는 시점에서 데이터를 불러오지 않고 그 페이지가 실행되면 바로 불러와지기 때문에 axios를 이용하여 원하는 시점에 불러오면 되지만 axios는 rest 방식이므

huiju

Algorithm Self Study, Common-Component, Control Components, Non-Control Components, react hook form, useApolloClient, use query, yup, Algorithm Class

space086

학습목표UseQuery를 axios처럼 사용할 수 있대 >> useApolloClient폼을 자동으로 >> React-Hook-FormValidation 라이브러리 >> Yup재사용을 위한 공통컴포넌트 >> Common-Componentjsx가 있으면 하이오더 컴포넌트

sssssssssy

react-hook-form + yup(외부 검증 라이브러리) 회원가입 폼 만들어보기

navida

여러가지 쿼리 방식 useQuery : 요청을해서 data를 받아오면 알아서 자동으로 그려줌 useLazyQuery : 어떠한 함수를 실행할 때 요청 이후 동작은 useQuery와 동일 useApolloClient : 데이터를 가져온 후에 변수에 담거나 알아서 가공해