원격 디버깅을 위해 Chrome DevTools 앱을 사용하는 방법
Chrome DevTools App은 Kenneth Auchenberg가 devtools를 브라우저 (이 경우 Chrome 브라우저 외부)에서 가져 오기 위해 만들어졌습니다. 이 응용 프로그램은 NW.js를 기반으로하며 Mac OS X 및 Linux 및 Windows에서 실행할 수 있습니다..
제조업체가이 기능을 만들도록 유도하는 데는 여러 가지 이유가 있지만 개발자의 편의를 개발자에게 제공하는 것이 그의 비전입니다. 모두 동일한 통합 플랫폼 (app)의 여러 브라우저에서 원격 디버깅. 이 아이디어는 다양한 이유 (그리고 그의 블로그에서 읽을 수있는 저항) 때문에 붙잡고 실현하는 데 시간이 걸릴 것입니다..
Chrome DevTools App에 대해 간단히 살펴보고 Google에서 개발자에게 제공해야 할 내용을 살펴 보겠습니다..
Hongkiat에 대한 추가 정보 :
- Chrome 개발자 도구 시작하기
- 5 (기타) 개발자를위한 유용한 Chrome DevTools 팁
- Google Chrome DevTools 테마를 맞춤 설정하는 방법
설치
Chrome-Devtools.app.zip을 다운로드하고 압축을 풉니 다. 더블 클릭하여 실행하십시오. Chrome 브라우저를 시작하고 원격 디버깅 사용.
Mac에서이 작업을 수행하려면 터미널을 열고 아래 명령을 실행하십시오.
sudo / Applications / Google \ Chrome.app/Contents/MacOS/Google \ Chrome -remote-debugging-port = 9222
창을 실행하는 경우 명령 프롬프트를 열고 다음 명령을 사용하십시오.
chrome.exe를 시작합니다. -remote-debugging-port = 9222
사용하는 방법
Chrome이 이미 열려 있고 원격 디버깅 기능이 활성화되어 있으면 이제 어느 사이트 로든지 이동할 수 있습니다. 예를 들어이 연습을 위해 Hongkiat.com을 열었습니다. 다음으로 Chrome DevTools 앱 창으로 넘어갑니다. 이 목록 새로 고침 (버튼은 오른쪽 하단에 있음).
이제 Hongkiat.com 링크가 표시됩니다 (아래 그림 참조)..
지금 '이동'버튼을 클릭하십시오.. 새 창이 열릴 것입니다. 그게 전부 야. Chrome DevTools 앱이 이미 실행되고 있습니다. 여기서 볼 수있는 것은 Chrome 브라우저에서 '요소 검사'를 할 때와 동일합니다..
여기에서 Chrome에서 DevTools를 기본적으로 사용하는 것과 마찬가지로 Chrome DevTools 앱을 사용할 수 있습니다. DOM 요소를 검사하고 자바 스크립트를 디버깅하며 콘솔로 작업 할 수 있습니다..
무엇 향후 계획?
이 응용 프로그램은 여전히 매우 실험적입니다. 그러나 현재 DevTool을 Chrome에서 없애는 아이디어를 통해 개발자는 앱을 기능 편집기로 취급하고 node.js 및 iOS와 같은 다른 런타임에서 작업 할 수 있습니다. 더 많은 가능성을 찾으려면 Auchenberg의 사고 방식을 여기에서 확인하십시오..