Tools & Tips

Quick Tip: My Favorite New IDE: WebStorm


Over the weekend, Elijah Manor tweeted about a new IDE, called WebStorm, that is currently being offered as a public preview, from JetBrains. After spending a few hours with it, I'm extremely impressed! In this video quick tip, I thought I'd show you some of my favorite features that you, frankly, just don't see much in other code editors.

Alternative Viewing Options

Notable Features

  • Not as bloated as other IDEs, like Aptana
  • Git integration
  • Fast intellisense
  • Vertical Selecting (Option + select)
  • CSS lookup on markup (Shift + Command + I)
  • Definition lookup (Control J)
  • Immediately finds formatting errors in your code
  • Advanced debugging
  • Plenty of skins
  • Zen coding implementation! (Such as, ul#nav>li*4>a)
  • Quickly and easily export inline CSS and JS to external files.

What Do You Think?

So, if you're curious, take some time to look over WebStorm and let me know what you think! I'm still learning it too, so let me know if you found any cool features that I didn't mention.

Related Posts
  • Code
    Web Development
    PHPStorm: When the IDE Really MattersPhpstorm preview
    The IDE that you choose to use day in and day out, can make a big difference in your web dev workflow. PHPStorm offers many wonderful features to improve this process, let's take a look!Read More…
  • Code
    Code Generation Using T4Dotnet wide retina preview
    Learn the advantages and disadvantages of using code generation via T4 templates.Read More…
  • Web Design
    Why I Choose Stylus (And You Should Too)Stylus thumb
    The world of front end web development has been steadily increasing its uptake of what we call "CSS Preprocessors", which extend the functionality of regular CSS. Arguably the two most well known, with the greatest user base, are LESS and Sass/SCSS. However there is a third preprocessor that hasn't received quite as much attention, and that's Stylus.Read More…
  • Code
    JavaScript & AJAX
    JavaScript Tools of the Trade: JSBinJsbin retina preview
    We've all been there. There are times when you simply want to throw some JavaScript code up and see how it works. Sure, you could go through the hassle of:Read More…
  • Code
    JavaScript & AJAX
    Creating Brackets ExtensionsDeeper in brackets retina preview
    A little while ago I wrote about the recent updates to the Brackets editor. Brackets is an open source project focused on web standards and built with web technologies. It has a narrow focus and therefore may not have a particular feature you've come to depend upon. Luckily, Brackets ships with a powerful extension API that lets you add any number of new features. In this article, I'm going to discuss this API and demonstrate how you can build your own extensions.Read More…
  • Code
    JavaScript & AJAX
    Working With IndexedDB - Part 3Indexeddb retina preview
    Welcome to the final part of my IndexedDB series. When I began this series my intent was to explain a technology that is not always the most... friendly one to work with. In fact, when I first tried working with IndexedDB, last year, my initial reaction was somewhat negative ("Somewhat negative" much like the Universe is "somewhat old."). It's been a long journey, but I finally feel somewhat comfortable working with IndexedDB and I respect what it allows. It is still a technology that can't be used everywhere (it sadly missed being added to iOS7), but I truly believe it is a technology folks can learn and make use of today. In this final article, we're going to demonstrate some additional concepts that build upon the "full" demo we built in the last article. To be clear, you must be caught up on the series or this entry will be difficult to follow, so you may also want to check out part one.Read More…