개발자 도구는 증상에 맞는 패널을 먼저 고르는 디버깅 지도다

UI가 깨졌는지, 오류가 났는지, 요청이 느린지, 렌더링이 버벅이는지에 따라 처음 열 패널이 달라진다.

증상	먼저 열 패널	확인할 증거	Next.js에서 이어 볼 곳
UI가 깨짐	Elements	DOM 구조, 적용 CSS, 박스 모델	컴포넌트 JSX, CSS module, Tailwind class
클라이언트 오류	Console	error stack, warning, log	client component, hook, event handler
API/이미지 문제	Network	status, payload, TTFB, cache header	route handler, server action, image config
느린 인터랙션	Performance	long task, layout, paint, flame chart	client boundary, heavy library, memo 대상