react

React

[React] TypeDoc 적용 및 사용 가이드

1. TypeDoc란TypeDoc는 TypeScript 코드에서 JSDoc 스타일의 주석을 읽고, 이를 기반으로 API 문서를 생성해주는 도구이다.코드에 주석을 달아두면 TypeDoc이 이를 기반으로 HTML 또는 JSON 형식의 문서를 생성해준다.참고 사이트공식 사이트 : https://typedoc.org/NPM : https://www.npmjs.com/package/typedoc 2. TypeDoc 도입 이유코드에 작성된 주석을 기반으로 문서를 자동으로 생성하여, 수동 문서 작성의 번거로움을 줄일 수 있다.함수의 입/출력 타입과 어떠한 기능과 내용으로 동작하는지에 대한 내용을 명확하게 파악할 수 있다.팀원들이 API나 모듈의 사용법을 쉽게 이해할 수 있어, 온보딩 속도가 빨라지고 협업이 원활해진다..

React

[React] 폼 컨트롤 - RHF

)-ReactHookForm(RHF)" style="color: #292929;" data-numhead-preview="">React Hook Form(RHF)React에서 폼을 쉽게 처리할 수 있게 도와주는 라이브러리일반적으로 태그 안에서 사용된다.성능 최적화불필요한 렌더링을 최소화하여 성능을 최적화한다.입력 필드가 변경될 때마다 전체 폼을 다시 렌더링하지 않고, 입력 필드만 업데이트 되므로 대규모 폼에서 성능 저하를 방지할 수 있다.단순한 API훅을 기반으로 동작하며, useForm, register, handleSubmit, formState 등을 사용하여 폼 상태와 유효성 검사를 관리한다.유효성 검사내장 유효성 검사 규칙을 제공하여 간단하게 유효성 검사를 설정 및 처리할 수 있다.커스텀 유효성..

React

[React] 토이 프로젝트로 배우는 이론과 실습

이론 정리|| 연산자두 개의 값을 비교하여 첫 번째 값이 falsy (즉, null, undefined, 0, NaN, 빈 문자열 '', false 등)일 때 두 번째 값을 반환 삼항 연산자condition ? valueIfTrue : valueIfFalse조건(Condition)에 따라 두 가지 값 중 하나를 선택하는 간결한 방법조건부 렌더링, 간단한 조건부 로직 처리 등에서 유용하게 쓰인다.const handleNameChange = (e) => { setUser(prevUser => ({ ...prevUser, name: e.target.value }));};현재 상태 유지: prevUser 객체의 기존 프로퍼티는 전개 연산자 ...prevUser를 통해 그..

seco
'react' 태그의 글 목록