일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- Pr
- PullRequest
- form
- 오블완
- Study
- prettier
- eslint
- react
- 비제어
- 협업
- frontend
- 개발자
- Context API
- 개발자 도구
- github
- zustand
- useState
- Fe
- 코딩 테스트
- polling
- 개발
- 가을 감성
- tailwind css
- CSS
- js
- 티스토리챌린지
- next.js
- 프레임 워크
- package.json
- react-query
- Today
- Total
목록form (2)
ougi FE
오늘은 얼마 전에 스터디에서 선배님이 오늘 주제에 대해서 질문을 해주셨는데 좀 더 유연하게 대답하지 못한 것 같아 이 둘에 대해서 좀 더 자세히 알아보려고 합니다❓ 제어 비제어? 그게 뭘까?먼저 제어 컴포넌트는 사용자의 입력을 state로 관리하고 업데이트합니다React에서 state 값이며 setState로 업데이트 됩니다import { useState } from "react";export function Example() { const [value, setValue] = useState(""); return ( setValue(e.target.value)} /> );} 비제어 컴포넌트는 DOM을 직접 조작하여 데이터를 관리합니다상태를 가지지 않으며 입력에 대한 DOM ..
안녕하세요 오늘은 React-Hook-Form에 대해서 소개해드릴 것인데요 저는 요즘 로그인, 회원가입 페이지를 구현하면서 어떻게하면 효율적으로 form을 관리할 수 있을지 고민이 많았습니다그래서 블로그를 살펴보다가 React-Hook-Form 라이브러리에 대해서 알게 되어 이렇게 글을 적게 되었습니다React-Hook-Form이란?React-Hook-Form 라이브러리는 사용하기 쉬운 유효성 검사 기능을 가지고 있고 확장가능한 form을 제공합니다이 라이브러리를 사용하면 코드가 매우 줄어들고 불필요한 렌더링을 제거해서 성능도 개선이 되는 효과가 있습니다🎯 사용법 저는 기본적으로 React-Hook-Form 사용에 필요한 register함수와 handleSubmit함수를 소개드리고 오류처리, 유효성 검..