개발자 도구의 수많은 기능과 함께
웹을 깊게 이해하는 개발자로 성장하세요! 🌱

Q&A를 확인해보세요! ✍️

이런 걸 배워요 📖

• 프론트엔드 개발자가 알아야 할 개발자 도구의 기본적인 기능과 실무에서 활용할 수 있는 다양한 팁을 담았습니다!
• 수많은 개발자 도구의 기능들을 익혀, 페이지에 대한 깊게 이해하는 개발자로 성장하실 수 있습니다.
• 웹페이지 디버깅, 성능 분석, HTML/CSS 수정 등 다양한 기능을 학습하실 수 있습니다.
• 개발자 도구 공식 문서: https://developer.chrome.com/docs/devtools/

이런 분들께 추천드려요! 🙆‍♀️

• 웹 개발에 관심 있으신 분
• 개발 작업에 활용할 수 있는 기능을 배우고 싶으신 개발자

강의 특징 ✨

• 크롬 개발자 도구의 사용법을 익힐 수 있습니다.
• 프론트엔드 실무에서 활용할 수 있는 다양한 기능에 대해 학습할 수 있습니다.

학습 내용 📚

섹션 0. 개발자 도구

1.  실행하기
2. 언어 변경하기
3. 눈금자 표시하기
4.  요소 탭 사용하기
5. HTML 수정하기
6. CSS 수정하기
7. 색상 선택 도구
8. 가상 클래스 확인하기
9. 박스 모델 확인하기
10. 자바스크립트 비활성화
11. 화면 캡처하기
12. 디바이스 모드
13.  콘솔 사용하기
14. 콘솔 주의사항 (let, const 선언)
15. 영상 속도 조절하기
16.  로컬 스토리지 
17. 네트워크
18. Lighthouse
19. 성능(Performance)
20. 디버깅(Debugging)