바닐라코딩 사전학습/추가공부 및 부가설명10 크롬 개발자도구로 디버깅하기 디버깅은 개발자에게 코드의 흐름에 따라 변하는 변수나 값을 쉽게 알게해주는 강력한 개발도구이다. 1. 크롬 개발자도구 실행(F12) 2. 개발자도구 탭에서 소스탭 클릭 후에 디버깅을 원하는 파일에 가서 중단지점을 설정한다. 중단지점은 해당 line의 번호를 클릭하면 지정된다. 3. 코드를 실행하고 중단점을 만나게되면 아래와 같은 화면이 나오게 된다. 코드 수행중에 중단점을 만난 화면이므로, 원하는 변수의 값을 마우스오버하여 확인하자. 이후 확인이 끝났으면 다음 스텝에 가기 위해 재생버튼을 누르면 중단점에서 다시 멈춘다. 다시 확인한다. 2021. 12. 24. 주석 1. 주석은 나쁜 코드를 보완하지 못한다. - 코드에 쓸데없는 주석을 붙이는 것은 자신의 코드에 자신이 없기 때문이다. - 주석을 어떻게 쓸까 고민 할 시간에 더 깔끔한 코드를 작성하도록 노력하자 2. 우리는 프로그래머이다. 코드로 의도를 전달하자 3. 좋은 주석이란? - 법적인 주석 : 저작권이나 소유권 정보 - 정보를 제공하는 주석 - 결과를 경고하는 주석 - TODO주석 : 앞으로 해야할 일을 적어놓는 주석. 그러나 나쁜 코드를 남기는 핑계가 되어서는 안된다. 또한 TODO주석은 너무 많아지면 안된다. 주기적으로 업데이트해서 깔끔하게 정리하자. 4. 나쁜 주석이란? - 특별한 이유없이 의무감으로 다는 주석 - 같은 이야기를 반복하는 주석 - 이력을 기록하는 주석 : 이제는 깃허브라는 신이 있으므로 .. 2021. 12. 24. npm으로 JavaScript 모듈 설치하기 바닐라코딩 사전 가이드 진행중에 JavaScript Konas의 과제를 풀게되었다. Konas의 Readme에서 Konas는 테스트러너로 Jasmine을 사용했다고 나와있다. 여기서는 테스트를 수행하는 자세한 방법은 쓰지 않고 우선 기본적인 npm 사용방법을 알고 Jasmine을 설치해보자. NPM이란? Node Packaged Manager의 약자로 node.js로 만들어진 package를 관리해주는 도구이다. 개발자는 npm을 통해 node.js로 만들어진 module을 웹에서 받아서 설치하고 관리할 수 있다. NPM을 사용하기 위해선 node.js를 설치해야한다. node.js 설치파일 안에 npm이 내장되어 있다. npm으로 package(module) install/uninstall하기 현재 d.. 2021. 12. 15. Node vs Element Node: DOM API에 존재하는 모든 것. 여러 가지 DOM 타입들이 상속하는 인터페이스이며 그 다양한 타입들을 비슷하게 처리할 수 있게 한다. 예를 들어, 똑같은 메소드를 상속하거나 똑같은 방식으로 테스트를 할 수 있다. Element: Node에 속해있고 one specific type of node이다. div, body, head등과 같은 특정 타입. 부모 인터페이스인 Node와 그 부모인 EventTarget의 속성을 상속한다. 참고자료) Node - Web API | MDN (mozilla.org) Node - Web API | MDN Node는 여러 가지 DOM 타입들이 상속하는 인터페이스이며 그 다양한 타입들을 비슷하게 처리할 수 있게 한다. 예를들어, 똑같은 메소드를 상속하거나 똑같은.. 2021. 12. 8. 이전 1 2 다음