zerovoids.dev

Home/Learning/Documents/React/react-dom‹ React

Learning · React

react-dom

기능당 한 편 — 무엇·무슨 일·사용법·실무 예시·중요도.

Docs 33Version v19.2

Hooks01

useFormStatusReact 19상위 form이 지금 제출 중인지, 무슨 데이터를 보내는지를 하위 컴포넌트에서 읽는다.→

Components12

<form>React 19브라우저 <form>에 함수 action을 붙여, 제출을 트랜지션 안에서 처리하게 한다.→<input>브라우저 input 요소. value/onChange로 상태에 묶으면 controlled, defaultValue만 주면 uncontrolled다.→<link>React 19외부 리소스 링크. 컴포넌트 어디서 렌더해도 React가 <head>로 올려 준다(React 19).→<select>드롭다운 선택 상자. value/defaultValue로 선택 상태를 다룬다.→Common components (props·ref·이벤트)div·span 같은 모든 내장 DOM 요소가 공통으로 받는 props — ref·style·이벤트·className 등.→<meta>React 19문서 메타데이터. 컴포넌트 어디서 렌더해도 React가 <head>로 올려 준다(React 19).→<option><select> 안의 개별 선택지. selected 대신 부모의 value/defaultValue로 선택을 정한다.→<progress>작업 진행률 표시줄. value/max로 완료 정도를, value={null}로 진행 중을 나타낸다.→<script>문서에 스크립트를 넣는다. React 19는 외부 스크립트를 중복 제거하고 <head>로 올린다.→<style>인라인 CSS를 문서에 넣는다. React 19는 href/precedence로 중복 제거·순서 정렬해 <head>로 올린다.→<textarea>여러 줄 텍스트 입력. 초기값과 내용은 children이 아니라 value/defaultValue로 준다.→<title>React 19문서 제목. 컴포넌트 어디서 렌더해도 React가 <head>로 올려 준다(React 19).→

APIs20

createPortalReact 16자식을 트리 밖 다른 DOM 노드에 그리면서도 React 트리상으로는 그대로 자식으로 둔다.→createRootReact 18브라우저 DOM 노드 안에 React 루트를 만들어 컴포넌트를 그린다. 순수 클라이언트 렌더 앱의 진입점.→hydrateRootReact 18서버가 미리 그린 HTML에 React를 붙여 상호작용 가능한 앱으로 살려낸다.→flushSyncReact 16콜백 안의 갱신을 동기로 즉시 반영해 DOM을 바로 업데이트한다. 자동 배칭을 깬다.→preinitReact 19스타일시트나 외부 스크립트를 미리 내려받고 곧바로 적용·실행한다.→preloadReact 19곧 쓸 리소스(스타일시트·폰트·스크립트·이미지)를 미리 내려받으라고 브라우저에 힌트를 준다.→renderToPipeableStreamReact 18Node.js 스트림으로 React 트리를 HTML로 그리는 서버 렌더링 API.→renderToReadableStreamReact 18Web Streams 런타임(엣지·Deno)에서 React 트리를 HTML 스트림으로 그린다.→preconnectReact 19곧 리소스를 받아올 서버에 미리 연결을 열어 두라고 브라우저에 힌트를 준다.→prefetchDNSReact 19나중에 쓸 서버의 IP 주소를 미리 찾아 두라고 브라우저에 귀띔하는 리소스 힌트.→preinitModuleReact 19ESM 모듈을 미리 내려받고 그 자리에서 바로 실행까지 해 두라고 브라우저에 알린다.→preloadModuleReact 19ESM 모듈을 미리 내려받아 두라고 브라우저에 힌트를 준다. 실행은 아직 안 한다.→prerenderReact 19정적 생성을 위해 React 트리를 끝까지 다 그린 뒤에야 HTML을 돌려주는 Web Streams 렌더링 API.→prerenderToNodeStream정적 생성을 위해 React 트리를 끝까지 다 그린 뒤 Node.js 스트림으로 HTML을 돌려주는 렌더링 API.→renderToStaticMarkupReact 16React 트리를 하이드레이션 불가능한 순수 HTML 문자열로 동기 렌더링한다.→renderToStringReact 16React 트리를 HTML 문자열로 동기 렌더링하는 레거시 서버 API. 스트리밍·Suspense를 제대로 못 다룬다.→resumeprerender가 멈춘 지점부터 이어받아, 나머지를 스트리밍 SSR로 완성하는 서버 렌더링 API.→resumeAndPrerenderprerender가 멈춘 지점부터 이어받아, 다시 정적 HTML로 완성하는 API.→resumeAndPrerenderToNodeStreamresumeAndPrerender의 Node.js 버전. prerenderToNodeStream이 멈춘 지점부터 이어 정적 HTML을 완성한다.→resumeToPipeableStreamprerenderToNodeStream이 멈춘 지점부터 이어받아, Node.js 스트림으로 SSR을 완성하는 API.→

zerovoids.dev