# react developer tools

nuyhes

🕵️‍♀️React 리액트란? 메타에서 개발한 오픈 소스 자바스크립트 라이브러리. 프론트엔드 개발자 사이에서 AngularJS, Vue.js와 더불어 많은 인기를 얻고 있다. GitHub Star 수는 Vue가 가장 많으며(2022년 12월 04일 기준 Vue는 201K, React는 199K, Angular는 59.4K), npm 패키지 다운로드 수는 React가 가장 많다. SPA을 전제로 하고 있으며, Dirty checking과 Virtual DOM을 활용하여 업데이트 해야하는 DOM 요소를 찾아서 해당 부분만 업데이트하기 때문에, 리렌더링이 잦은 동적인 모던 웹에서 엄청나게 빠른 퍼포먼스를 내는게 가능하다. 기본적으로 모듈형 개발이기 때문에 생산성 또한 상당히 높은 라이브러리인지라 순식간에 대세로

jrl103

페이지가 자꾸 무한 렌더링이 되는 오류가 났다.. 이 오류를 찾기 위해 .. 전 코드를 주석 처리하고 하나하나 찾아내는 번거로움을 거쳤다ㅠ.. 렌더링 확인 방법 (React Developer Tools) 렌더링이 될 때마다 노란 박스로 표시해주는 확장 프로그램이 있다. React Developer Tools 라는 확장 프로그램이다. 개발자 도구의 Co

productuidev

React 기본 Udemy - 한입크기로 잘라 먹는 리액트 📌 React Developer Tools ☑️ React Developer Tools(RDT) 활용하기 크롬 > 확장 프로그램 검색 > React Developer Tools(RDT) > 확장프로그램에 추가 ☑️ 기본 설정 ☑️ 개발중인 프로젝트에서 확인하기 크롬에 추가 시 이렇게 나옴 ![](h

john_with_smile

메모이제이션, Memoization state가 바뀌면 안의 컴포넌트가 다시 만들어지면서 화면이 다시 그려지는데 그 안에 있는 자식, 변수, 함수는 다시만들어지나?? 이론상으로는 된다고 했는데 실제로 한번 보자 + 이게 메모가 되는가 <- 이걸 메모이제이션이라고한다 한번 코드들을 통해서 보자 Cotainer(부모) presenter(자식)으로 나눠보고 부모가 바뀌면 자식이 어떻게 되나 보면 된다. 버튼을 만들어서 let과 state를 이용해서 카운트가 1씩 증가하게 만들었다 그리고 console.log를 이용해서 어떤곳이 렌더링되는지 써놓음 Let의 경우 카운트는 증가하지만 화면에 반영은 안된다 ![](https://images.velog.io/images/johnwiths