이노베이션-실전플젝
[TIL] React Develop Tools 사용
개린이다
2023. 8. 18. 15:27
* 문제점 : 딱히 없음 그냥 렌더링되는 거 보려고 설치함
* 설치방법 :
- 크롬확장 프로그램으로 아래의 링크에 들어가서 설치(아님 그냥 검색해도 됨)
React Developer Tools
Adds React debugging tools to the Chrome Developer Tools. Created from revision 035a41c4e on 7/10/2023.
chrome.google.com
* 사용목적
- 렌더링되는 부분을 시각적으로 보고 싶었음
- 아래처럼 렌더링 되는 곳에 색 들어오는 거
*사용방법:
1. F12 / 검사 들어가서 Components 들어가기
2. 톱니바퀴 누르기
3. Highlight updates when components render. 선택해주기
끝
* 그럼 행동을 했을 때, 렌더링 되는 곳에만 색이 들어온다. 리렌더링 되는 곳이 어딘지 판별이 가능해짐!