Skip to content

웹스톰 #
Find similar titles

You are seeing an old version of the page. Go to latest version

Structured data

Category
Programming

웹스톰(WebStorm)이란 #

웹스톰(WebStorm)HTML 편집기가 포함된 자바스크립트 IDE(Intergrated Development Environment)로 IntelliJ IDEA 플랫폼 위에 구축되었고 비주얼 스튜디오나 이클립스와 같은 프론트엔드 개발에 최적화 된 통합개발환경을 제공한다.

Image

<2019년 9월 2일자 웹스톰(WebStorm) 웹사이트 화면>

Node.js, CoffeeScript, TypeScript, Dart, Jade, Sass, Less, Stylus 같은 최신 웹 트렌드를 지원하며 플랫폼에 유동적(Cross-platform)이어서 윈도우, 맥, 리눅스에서 동작한다.

웹개발, 특히 자바스크립트 친화적 프론트엔드 개발에 특화된 웹스톰은 HTML, CSS, javaScript, XML, VCS 작업, 웹 개발을 위한 여러 도구 (특히, IntelliJ IDEA의 모든 웹 관련 기능 상속) 등을 지원하는데 지원사양은 다음과 같다.

웹스톰 특징 #

  • JavaScript editor
    • 지능형 코드 완성 (Intelligent Code Completion)
    • 코드 검사 및 신속한 수정 옵션 (Code Inspection and Quick-fix Options)
    • 코드 탐색 및 용도 검색 (Code Navigation and Usages Search)
    • 코드 리팩토링 (Code Refactoring)
  • Debugging and Testing
    • 강력한 자바스크립트 디버거 (Powerful JavaScript Debugger)
    • 자바 스크립트 단위 테스트 (JavaScript Unit Testing)
  • Node.js
  • Modern Languages
    • TypeScript 지원
    • CoffeeScript 지원
    • Dart 지원
    • ECMAScript 지원
  • More Than Code
    • 코드 검사 (Code Inspection)
    • 코드에서 모든 "외부"와 "내부"언어에 대한 지원(Language Mixing/Injection)
      • 자바 스크립트 코드 블록의 외부 또는 자바 스크립트 문자열 리터럴 내부 CSS, HTML, 등 전체 코딩 지원
    • 맞춤법 검사 (Spellchecker)
    • 중복 코드 검출 (Smart Duplicated Code Detector)
  • HTML and CSS
    • HTML5, CSS3 지원
    • 문법검사 및 빠른 수정 (Validation and Quick-Fixes)
    • Zen Coding & Emmet 지원
    • CSS ID 조회 시 스타일 또는 이미지 미리보기 팝업 (Show Content)
    • 우클릭으로 해당 태그에 적용된 스타일 보기 (Show Applied Styles)
  • Less, Sass and Stylus
  • 최신 기술과의 호환성
    • Angular, React, Vue
  • Smart Environment
    • Project Template
      • Node.js Express application, Twitter Bootstrap, Meteor application, Foundation, Web Starter Kit, Angular.js seed project
    • FTP and Remote Files Syncronization (Settings > Directories 메뉴)
    • Version Control Systems Integration :
      • Subversion, CVS, Git, Perforce, Mercurial, TFS
    • Local History

웹스톰(WebStorm) 가격 #

웹스톰(WebStorm)은 30일 평가 버전을 사용할 수 있으며 오픈 소스 프로젝트 개발자에게는 무료로 라이선스가 제공된다. 상세 가격정보는 해당 링크를 통해 확인이 가능하다.

  • Fallback License
    • 웹스톰 라이센는 1년 이상 구독했다면 구독종료 후엔 구독 시작시점의 최소버전을 영구적으로 사용할 수 있다. 1년 이상 구독하지 않았다면 Fallback License를 갖지 못한다.

Image

<2019년 9월 2일자 웹스톰(WebStorm) 영구적인 Fallback 라이센스란?>

웹스톰 주요기능 #

  • Rename
    • 단축키 : ^+T
    • 지역 변수를 한번에 수정할 수 있는 기능이다.
    • 변수를 일괄 수정함으로써 오타가능성을 줄여준다.
  • Change Signature
    • 단축키 : ^+S
    • 다른 곳에서 사용중인 함수나 메서드의 파라메터를 안전하게 추가하거나 삭제하는 기능
    • 함수의 시그니처 변경으로 발생할 수 있는 에러를 방지할 수 있다.
  • safe delete
    • 단축키 : ^+D
    • 삭제하려는 변수나 객체의 의존관계를 파악하여 삭제하는 기능
    • 다른 곳에서 사용중인 변수나 객체를 파악하여 사용자가 안전하게 삭제할 수 있다.
  • Extract Variable
    • 단축키 : Ctrl+Alt+V
    • 함수나 메서드내 여러번 사용되는 수식을 변수로 추출하는 기능
    • 중복된 수식을 변수화하여 가독성을 높일 수 있다.
  • 단축키 변경
    • 메뉴 - Help - Keymap Reference
    • 이클립스 등 다른 툴의 단축키를 적용하여 사용할 수 있다.

웹스톰 설치 #

동영상보기 #

0.0.1_20140628_0