Over a million developers have joined DZone.

A Storm of Web Developer IDEs

DZone's Guide to

A Storm of Web Developer IDEs

· Web Dev Zone ·
Free Resource

Learn how to add document editing and viewing to your web app on .Net (C#), Node.JS, Java, PHP, Ruby, etc.

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.

Extend your web service functionality with docx, xlsx and pptx editing. Check out ONLYOFFICE document editors for integration.


Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}