Node js with Inspect of Chrome DevTools Version 55+ in VSCode.

Inspector Tools & Clients

디버깅 툴이 중요한 이유는 작동하고 있는 문제 위치를 정확히 파악하는 것도 있고

처리 지연이 발생하는 위치에 대한 해당 플로우를 정확하기 이해 할 수 있는 장점이 있다.

mean stack 방식으로 개발하는 개발자들이 많아진 추세 덕분에

구글 디버깅 툴에서도 손쉽게 만날 수 있게 되었다.

NODEJS 공식 홈페이지의 inspect 툴 활용법을 2가지 방식으로 소개 해주고 있다.

URL : https://github.com/nodejs/node-inspect.

먼저 node 설치 하고 나서,

npm install -g node-inspect

이후, 진행하고 있는 프로젝트에서

node --inspect app.js

라고 간단하게 쳐주면 된다. 이때 주의해야 할 점은, app.js가 반드시 웹서버 소스로 마무리 되어있어야 한다는 점.

상위 모듈로 module.exports = app; 하게 되어 있다면, 디버그 콘솔은 디버깅 툴을 만나지도 못하고, disconnected 당한다.

두가지의 옵션 방식으로 우리의 서버를 만나게 할 수 있는데 저는 1번 옵션으로 했습니다.

Option 1: Open chrome://inspect in a Chromium-based browser. Click the Configure button and ensure your target host and port are listed. Then select your Node.js app from the list.

Option 2: Install the Chrome Extension NIM (Node Inspector Manager):https://chrome.google.com/webstore/detail/nim-node-inspector-manage/gnhhdgbaldcilmgcpfddgdbkhjohddkj

VS Code 1.10+

vscode의 lanuch.json에 배정해줄 수 있겠으나, 필요할 때만 보기 위해서 터미널(윈도우, 파워쉘)에서는 그렇게 처리 했네요.

여간 좋습니다. 여러 상태 변수들의 대한 값들이나, 프로세스의 값들도 확인 가능하고, 처리 로직에 대한 여러 비효율성을 잡는데 속시원하게 볼 수 있다는 장점이 있답니다.