2013년 12월 9일 월요일

[튜토리얼/한글화] 개발자도구에서 터미널 사용하기(Using Your Terminal From The DevTools)

+Addy Osmani의 '개발자도구에서 터미널 사용하기(Using Your Terminal From The DevTools)' 튜토리얼이 업데이트되었습니다.

웹 개발을 하다보면 터미널을 반복적으로 사용하게 되는 경우가 있으며 특히 Grunt나 별도의 빌드 및 배치 시스템을 가진 경우는 더 그렇습니다. 이번 튜토리얼은 크롬 개발자도구의 기능/실험실이 아닌 개발자도구에서 터미널을 사용할 수 있게 해주는 작지만 편리한 크롬 확장기능(Extension)입니다. 특히나 금번 튜토리얼은 소개에 가까우므로 커맨드라인 도구를 자주 쓰시는 분들은 한번 참조해보셔도 좋을 듯 합니다.

참고로 윈도우즈 사용하시는 분들은 별도의 문제점이 있는지 댓글 달아주실 수 있을까요? 며칠 전에 알려드린 한분이 자신은 윈도우라서 안되는 것인지 모르겠다고 하셨는데 조금 궁금하네요. :)



TL;DR;


크롬 개발자도구에서 터미널을 지원하는 것은 몇가지 이점이 있습니다. 브라우저와 편집기, 터미널을 오가며 바쁘게 컨텍스트를 변경하는 것보다는 같은 창 내에서 이를 진행하는 것이 효율적일 것입니다. 아래는 개발자도구와 터미널을 통합하여 사용하는 예입니다.

  1. 작업영역(Workspaces)
    1. 크롬 내의 웹앱을 편집하고 디버깅
    2. 서버 실행 시 로컬 프로젝트와 네트워크 파일들의 매핑
  2. 개발자도구 터미널
    1. git, yeoman과 같은 커맨드라인 기능 실행
    2. 앱을 미리보기 위한 새로운 서버를 실행
    3. 소스 컨트롤에 커밋
    4. 의존성 모듈들을 내려받기 위해 (npm, bower 같은) 패키지 관리자 사용
    5. (grunt, make 같은) 빌드 프로세스를 실행
제한점들
  • 다중 탭(Tab), 다중 윈도우, 뒤로가기(History playback)를 지원하지 않습니다.
    • 새로운 인스턴스를 여러개 띄우는 것으로 이를 대치할 수는 있습니다.
크롬을 통해 웹페이지 테스트를, 개발자 도구로 개발 및 디버깅을, 이 확장기능을 이용하여 터미널 빌드를 사용하는 것을 시도해보시기 바랍니다.

참고 글