티스토리 뷰

728x90

안녕하세요 코딩에그입니다.

오늘은 웹개발자를 위한 강의를 가지고 왔습니다.

 

강의 제목은 아는 만큼 보이는 크롬 개발자 도구로

크롬 브라우저의 개발자 도구 사용방법을 정리해놓은 강의입니다.

 

본 강의는 인프런에서 무료로 수강하거나

유튜브의 제주코딩베이스 캠프 채널에서 수강할 수 있습니다.

 

저는 풀스택을 목표로 코딩 공부를 진행하고 있는 데요.

공부를 하다보면 가장 많이 사용하는 브라우저가

크롬이고 웹 페이지를 테스트할 때 개발자 도구를 애용합니다.

그렇지만 개발자 도구는 html 확인이나 콘솔 창 확인 정도로만 

활용하고 있어서 다른 활용법들을 배우기 위해 본 강의를 수강했습니다.

 

크롬 개발자 도구는

웹 페이지의 다양한 요소를 확인하고

테스트 해볼 수 있는 도구입니다.

개발자 도구

개발자 도구는 F12키를 누르거나 ctrl+shift+i 키를 누르면 열 수 있습니다.

혹은 크롬 브라우저 우측 상단에  "  ⋮ " 를 누르고 

도구 더보기 => 개발자 도구에 들어가면 확인할 수 있습니다.

 

이곳에서 직접 HTML이나 CSS를 수정하면서

장난을 쳐볼 수도 있습니다.

 

저는 만우절에 Youtube 화면의 사진과 문구를 조작하고

장난을 쳐봤더니 반응이 좋더라고요.

 

 

그러면 강의는 어떤 내용을 다루고 있을까요?

개발자 도구에서 웹 요소를 확인하고 수정하는 것부터 

개발자 도구 명령을 활용해 기능 수행,

콘솔창 활요, 성능 확인 및 테스트 방법들에 대해 알려주고 있습니다. 

 

강의는 전체 시간이  약 1시간 남짓해서

부담없이 들을 수 있었습니다.

 

처음보는 기능들도 많았으며 특히나

마지막에 진행한 네트워크, 성능 확인, 디버그 파트는

웹개발자를 지향하는 입장에서 유익한 내용들로 가득했습니다.

 

  만약 웹 개발자를 준비하고 있다면

혹은 웹 개발 프로젝트를 하고 있다면

한 번 들어보시는 걸 추천합니다.

728x90