Mitch Pronschinske is the Lead Research Analyst at DZone. Researching and compiling content for DZone's research guides is his primary job. He likes to make his own ringtones, watches cartoons/anime, enjoys card and board games, and plays the accordion. Mitch is a DZone Zone Leader and has posted 2578 posts at DZone. You can read more from them at their website. View Full User Profile

A Storm of Web Developer IDEs

  • submit to reddit
JetBrains knows how to build an intelligent, friendly IDEs (they are the makers of IntelliJ IDEA).  Today, JetBrains has unleashed two brand new projects they've been working on: WebStorm and PhpStorm.  Both of these new IDE's for web developers include many of the code completion, debugging, and refactoring features that you would expect to find in the IntelliJ platform.  Due to the success of JetBrains' first language-specific IDE, RubyMine, the company has continued making more focused, lightweight, standalone IDEs for development in Python, PHP, and web languages.

WebStorm 1.0

All of your basic IDE features are covered for JavaScript, CSS, and HTML in WebStorm.  There's DOM-based, browser-specific code completion for JavaScript plus Dom- and Schema-based code completion for HTML and CSS.  WebStorm detects code problems and suggests auto-fixes for things like invalid CSS selector formats or missing required attributes.  

CSS Auto-Fix

One of many nifty features is the quick definition lookup display that pops up to display the actual styles defined for a particular CSS ID.  You can also open a tree view showing all the styles applied to a CSS tag by right-clicking on a tag and selecting "Show Applied Styles for Tag."

Tree View of CSS Tag's Styles

Returning to JavaScript, there are numerous refactoring capabilities and code navigation features.  JavaScript also includes code inspections and auto-fixes just like CSS and HTML have in WebStorm.  Another key feature is the Mozilla-based debugger, which has a full suite of a debugging complete range of features.

JS Auto-Completion

WebStorm supports development for the following JS frameworks:

  • JQuery
  • YUI
  • Prototype,
  • DoJo
  • MooTools
  • Qooxdoo
  • Bindows

WebStorm also supports these version control systems: Git, SVN, Perforce, and CVS.  Some of the other key features in WebStorm include batch code analysis as well as FTP and remote files synchronization.

PhpStorm 1.0

Code completion in PhpStorm finalizes classes, methods, variable names, and PHP keywords, plus commonly used names for fields and variables depending on their type.  The editor supports PHPDocs and provides appropriate code completion tips for @property, @method, and @var annotations.  There is also support for PHP refactoring, debugging, code navigation, and Smarty template editing.

Smarty Template Editing

Within PhpStorm you can develop PHPUnit tests and run them from the directory, file, or class using context menu options.  A GUI-based test runner displays detailed stats for the whole suite and every particular test.

PHPUnit Test Runner

WebStorm and PhpStorm have inherited many of the strengths from PHP and web language support in IntelliJ IDEA.  JetBrains says it will continue to support multiple languages, including PHP and web languages, in IntelliJ for polyglot programmers, but for web developers who just want to use the most common web languages, PhpStorm and WebStorm will be better choices.

Personal and commercial licenses are available now for WebStorm and PhpStorm with a introductory discount until September 2010.  Each license includes one year of free updates.  A 45-day free trial is available here.