# DevTool
Webpack이란 무엇인가? 정의와 필요성, 그리고 장단점
Webpack 1편: Webpack이란 무엇이고 왜 필요한가? 그리고 Webpack 이용시 장단점
React 성능 최적화하기
React에서 성능 최적화는 가장 중요한 요소 중 하나이다.토이프로젝트를 위해 최적화를 하는 방법을 찾아보다 React Developer Tools에 있는 Profiler라는 기능을 알게되었다, React Developer Tools은 오픈소스 React JavaScr
chrome devtools network 탭 waterfall 항목들
chrome devtools의 network탭을 보면 waterfall이 다채로운 색과 함께 늘어져있는 걸 볼 수 있다. hover하면 나타나는 tooltip에서 각 항목들이 의미하는 바와 time이 어떤 항목들로 계산된 값인지 기록해보고자 한다.(시간으로 표기되는 항
.gif)
[JS30] - 9) Dev Tools Domination
Interpolated Styled Warning Error Info 
SourceMap이란 무엇일까?(with webPack devtool)
보통 페이지를 표시하기위한 JS 코드와 css 같은 파일들은 webpck과 같은 도구를 이용해 번들링 되어 난독화되고 압축됩니다. 보다 서버에서 빠르게 전달되고 보안성을 높이기 위해서 이러한 난독화와 압축이 사용되는데 이럴경우 페이지에서 에러가 발생할 시 디버깅하기가
TIL. DevTool( Application)/wecode
🍰 케이크팀 - Application panel - Application 패널의 기능은? 브라우저 저장소 Local storage, Session Storage, Cookie - Local Storage, Session Storage, Cookie 차
TIL. 크롬 개발자 도구 (element, network, console, application)
Elements html 코드를 분석하고 수정할 수 있는 도구 패널이다. Dom과 css를 자유롭게 조작하여 사이트의 레이아웃과 디자인을 테스트 할 수 있다.
성능 최적화 하기.
chrome developer tools 로 성능 확인하기 => inspector => performace => record (녹화버튼) 클릭.. => 원하는 Action 완료후 멈춤.Timing 이라는 곳에 들어가서 확인
