리액트 공식문서 정리

전역적인 상태관리가 필요할 때예를 들어 로그인한 유저 정보, 테마, language 등이 있다

코드분할 왜 해야 하는가? 번들링은 필수이나 앱이 커지면 번들도 커지기 마련입니다. 특히, 용량이 큰 서드파티 라이브러리는 로드시간을 길게 만드는 주범이니 주의합시다. 아이러니하게도, 번들이 거대해질수록 번들을 나누어야 합니다. 이럴꺼면 왜 번들링한건데 ㅡ.ㅡ

WCAG Web Content Accessibility Guidelines => 접근성을 갖춘 웹사이트를 만드는데 필요한 지침 https://www.wuhcag.com/wcag-checklist/

Error boundaries Suspense를 미리 정의한 MyErrorBoundary 컴포넌트로 감싸면 lazy 컴포넌트에서 네트워크 장애가 발생 했을시 에러를 처리할 수 있다 특징 Error boundaries로 감싼 컴포넌트들의 에러만을 캐치한다 클래스 컴포넌트만이 에러 경계가 될 수 있다 try catch 구문과 비슷하지만, 컴포넌트에만...

Ref 전달은, 특히 재사용 가능한 컴포넌트 라이브러리와 같은 어떤 컴포넌트에서는 유용할 수 있습니다. DOM 에 refs 전달하기 아래와 같이 FancyButton를 사용하는 상위 컴포넌트들은 button DOM 노드에 대한 참조를 가져올 수 있고 접근할 수 있습니다. Ref 전달은 DOM 컴포넌트에만 한정적이지 않습니다. 클래스 컴포넌트 인스턴스에...

Fragments를 사용하면 DOM에 별도의 노드를 추가하지 않고 여러 자식을 그룹화할 수 있다 동기 tr 요소의 자식으로 td요소들이 있어야 하는데, div로 감싸면 유효한 구조가 아니다. 따라서, div 요소 대신 fragments를 사용하자 key가 있는 F

DOM 조작 플러그인과 통합하기 리액트는 DOM에서 일어나는 변화를 인식하지 못하므로, 리액트 컴포넌트가 업데이트 되지 않게 막아야 한다. 업데이트할 필요가 없는 `` 같은 요소를 렌더링 하자. jquery 플러그인은 DOM에 이벤트리스너를 등록하므로 componentWillUnmount메소드 내에서 리스너를 해제 해주어야 한다. 웬만하면 jquery...

컴파일 후jsx는 React.createElement를 호출하는 컴파일 되어서 import React from 'react';를 작성해야 합니다.import React from 'react';import CustomButton from './CustomButton';f

리액트로 성능문제를 겪고 있고, 리액트의 경고 메시지들이 본인의 앱을 느리게 만들고 있다면 Brunch, Browserify, Rollup등과 같은 production build 라이브러리를 사용해야 합니다. 하지만, 대부분이 webpack 개발환경 아래에 놓여있기 때문에 Webpack v4이상에서 아래와 같이 terser plugin을 사용하는게 좋습니...

O(n) 복잡도의 휴리스틱 알고리즘를 사용.두개의 트리를 비교할 때, 두개의 루트 엘리먼트부터 비교.완전히 새로운 트리를 구축ex) a => img, Button => div생애주기componentWillUnmount() 실행UNSAFE_componentWillMoun