Quick Tip: My Favorite New IDE: WebStorm
videos

Quick Tip: My Favorite New IDE: WebStorm

on Mar 8th 2010 with 149 comments

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.

 
Enjoyed this Post?

Subscribe to our RSS Feed, Follow us on Twitter or simply recommend us to friends and colleagues!

By

Rollover to read this author's bio or click through to see a full list of posts by this author.

I'm the editor of Nettuts+, and love making the process of building for the web as easy as possible. Also, I'm finishing up my latest book on Laravel Testing! If you want be friends, say hi on Twitter.  

Plus Premium
 
 
Note: Want to add some source code? Type <pre><code> before it and </code></pre> after it. Find out more
Newer Comments →
  • http://www.moscreative.com Serhiy

    I very Like Aptana… I’ll make are try

    • http://icontut.com nabeel

      Yh, good luck!

  • http://www.manocreative.com/ Manuel Pineault

    This looks sick! I was looking for a Windows application that has crazy features like Coda. This might be a good competitor :)

    Thanks again Jeffrey Way, for your awesome screencasts.

  • http://www.virtualerik.com Erik

    This looks pretty awesome.

    How did web developers learn when your screencasts weren’t around?

    • http://ivansotof.com Ivan

      We were forced to use our brains. :)

      • http://www.newarts.at Drazen Mokic

        And Google :D

  • Micko

    There is something I don’t understand. They say that it is “pre-release software available for preview purposes only”, does that mean you have to pay for using it later?

    • http://www.jeffrey-way.com Jeffrey Way
      Author

      Yeah probably. You have to pay for most quality editors. :)

      • Micko

        Unfortunately :/ If just Notepad++ would support zen-coding it would definitely be best editor :P

    • http://www.what-a-geek.com Adit Gupta

      @Micko – Zen coding is now supported in Notepad++ v0.6 :)

      • Micko

        This is great!

      • Altrea

        Waiting so long for this.

        I LOVE it :D

      • scherii

        I think you mean “Zen Coding for Notepad++” v0.6 – since Notepad++’s last version was 5.6.8 :D
        http://code.google.com/p/zen-coding/downloads/list

      • http://www.duvieusart.net/portfolio/2009 dvs

        I used to be on Windows and swtich to Mac recently and have since then been looking for a Notepad++ like app.. Anyone knows one ?

      • Khalil

        @dvs, I’ve heard TextMate is really good on Mac though I can’t say for sure since I don’t use Macs myself but I think you have to pay for it.

        If you need a free one you could try TextWrangler.

      • Amy

        @ dvs I really like TextMate though it costs something like $40. If you’re looking for something free, TextWrangler or BB Edit are pretty good alternatives. If you do any type of coding above and beyond basic HTML, CSS, PHP, JavaScript, XML, etc, TextMate has bundles for ActionScript, C, Objective C, Ruby, Ruby on Rails, Java and more built right in. I feel it’s well worth the money for TextMate if you can afford it.

  • http://filmsamlare.se Thim

    Looks great just a question, I’ve download it for windows and I dont know how to change the theme for it somebody who knows? :)

    • Jakub

      Well, if there’s no dark theme then it’s absolutely useless for me :(

    • http://www.fishmemory.net fractalbit

      I also want to know this. You can press ctrl+~ but the only available is the default!

      • http://filmsamlare.se Thim

        @fractalbit:
        When I press ctrl+ ~ it doesn’t show anything what am I doing wrong :(? :p

  • http://www.electecmix.com/ Latavish

    SWEETNESS!! This is worth a try! And I assume this will allow the use of frameworks such of Codeigniter. :-) will try this tonight. Thanks Jeffrey.

  • Marcos Cerutti

    Hell-o Jeffrey!

    Thanks for the great tip mate, but I must ask, worths switch from Textmate? Sure it relies on personal taste, but as I have been trying several others IDEs and all seems to be an “overkill” and when I get back to textmate, it does all we need (sure, except build in ftp). But I would like to hear from you, what do you think?

    But well, I will give a try now.

    Cheers

  • Klon

    Great stuff, thanks Jeff
    Have you used the PHP IDE they offer?

    • http://www.jeffrey-way.com Jeffrey Way
      Author

      Not yet. Planning to though. :)

  • http://www.what-a-geek.com Adit Gupta

    I would still prefer Aptana Studio because :
    1. It’s free
    2. It’s robust with support for Rails, Python, PHP and Adobe Air
    3. It supports zen coding
    4. Git and Subversion integration

    This gives me no reason to switch to WebStorm. Although, one can always try new IDE’s :)

    • http://www.fishmemory.net fractalbit

      I find aptana very bloated and buggy.

  • Boris (CMT Studio)

    Some attempt at discussion from me now.

    Those nice little features look cool, but a few things come up in my mind before trying this new IDE:

    - Does it have a nice explorer view with the ability of creating new folders/files etc. (for example Notepad++ requires a plugin for that)? This is vital for the workflow, at least to me.
    - Can you connect to an FTP server and edit/save the code directly?
    - Have you tried the php editor? Is it advanced enough or you its man focus is on coding? (I see the features in their website, but I want a first-hand info) :P
    - And…how come is Aptana bloated? Not to forget that WebStorm is paid, while Aptana is free and still preferred by professionals (including me, Ive tried about 4 different IDEs only this year). :)

    I already use zen coding in Aptana and never write inline css, never preview pages from within the IDE, etc. But the things I really like here (from their website) is Smarty Templates Editing – this is something not much IDEs have, like NetBeans supports CodeIgniter.

    And finally, thanks for making this screencast, Jeff. :)

  • Yusuf

    ehm.. i didnt like , just like aptana..

    i prefer u “Netbeans PHP IDE”. its my favourite these days.

    • diddy

      So do I (that and eclipse) – I am sure it exists, but some sort of ide roundup with pros and cons would be great

    • http://www.hilario.lu/ DJaVuPixel

      me too i prefer Netbeans PHP IDE. It is really powerfull and much more convenient to use than Aptana! Personally I found it also faster than an eclipse based application (Aptana, Eclipse PHP).
      Lately I abandoned Aptana and I only use Netbeans PHP and I am really happy!

  • http://www.iconfinder.net martin Leblanc

    Wow… Really nice IDE.

  • oconn96

    Looks like this one has a lot to offer. Some things I found on that remind me of eclipse when I do my java work. I’m still gonna stick with PHP designer and Coda for now though.

  • http://www.wdonline.com Jeremy McPeak

    Looks like it has some nice features.

  • http://tutorial-city.net/ Tutorial City

    Aptana seems to be more flexible than WebStorm, and it’s free. I’ll try WebStorm a little more anyway.

  • http://michael.theirwinfamily.net Michael

    Does it let you integrate classes, etc.? For example, if I have a class named Foo, with methods bar and test, will it do the pop-up things with definitions the functions as I’m working with an object of that class? I know a lot of other IDEs do that.

    • http://www.jeffrey-way.com Jeffrey Way
      Author

      Yep.

      • Boris (CMT Studio)

        And would it do that if the class is in a separate file which is included? I love to see that helpful feature. :)

  • vengen

    Looks very fine. I’m gonna check it very soonly ;)

    All the best,
    vengen

  • http://www.kreativeking.com Clemente

    This looks SOOOOOO cool, I’m definetely checking this out later today. Thanks for the Quick Tip

  • http://nanochrome.tumblr.com nanochrome

    Looks good, but sadly like most IDEs it looks terrible :)

    • http://nanochrome.tumblr.com nanochrome

      Sorry, I mean the features are good but the looks isn’t.

  • http://twitter.com/maxberndt Max

    Come on Jeff, I don’t have time too check out all the cool stuff you keep presenting us!! Stop it!
    ;-)

  • http://prakasa.me/ Desain Web

    Just for reference..

  • iivo

    Nice!

    Event hough I’m personally a huge fan of Coda, I’m definitely gonna try this one out.

    Btw, Jeffrey. This has actually nothing to do with the IDE, but I wondering what’s that add-on you have on the lower right corner of the FF that looks pretty much like firebug? I know I’ve seen that one somewhere, just can’t remember what it is and something tells me that it has been on my “check this one out” list.

    • http://www.jeffrey-way.com Jeffrey Way
      Author

      It’s just Firebug. :)

  • flash

    Nice to see that its already supported on both mac and windows. Hopefully we dont get screwed on the price as it seems like a nice app. Defo worth a trial run – thanks for starting us off JW!

  • http://www.itforit.net MaartenC

    I’ve been using IntelliJ (it’s Jetbrains’ Java IDE) for a while in school now and I really liked it. I found out about the WebIDE a while back and it was awesome. Probably going to install it again pretty soon!

  • http://www.jc-designs.net/blog Jeremy Carlson

    While it looks better than Aptana (at least to me)….I am afraid of what they will charge for this. We talkin $50 or hundreds here? I would hate to start using it, love it, then find out I don’t want to pay the amount they are asking.

    Not sure if i saw this asked or not either, is the zen coding built in, or do I have to install it like Aptana?

    • Boris (CMT Studio)

      I think that as far as Zen coding for WebIDE is listed for separate download at http://code.google.com/p/zen-coding/ – you have to install it additionally. :)

      • http://www.jeffrey-way.com Jeffrey Way
        Author

        No – it’s built in.

  • ryan

    How do I add a new color scheme? aka the twilight theme?

    • http://www.jeffrey-way.com Jeffrey Way
      Author

      On a Mac, go to Library -> Preferences -> WebIDE … and there should be a section to add a new XML file – that you download from the site that I liked to above.

  • Patrick

    IntelliJ (or a slim version — webStorm) is the best IDE ever …

  • nykeri

    Well i atleast installed both and i disliked both of them equally sure it has all those features but i just dont like it though. Thanks anyway but i think its my hate for IDEs as all are slow, so i just prefer Notepad++ and Komodo Edit even though it has more features than both combined

  • http://www.fishmemory.net fractalbit

    I don’t have words. I used NetBeans until now and i was quite happy but dissapointed with how slow it was. So i downloaded the phpStorm and was blown away. It is about twice as fast and have much better productivity features! Just read the tips and coding will be a pleasure!

    Judging from the ruby ide price, this should be around 80€. If it is so, i am DEFINATELY buying this!

    Thanks for the discovery jeffrey!

  • Nick

    Does it have an Upload on Save feature? I cant find it!

    • http://www.fishmemory.net fractalbit

      Correct me if i am wrong but i think it auto saves, you don’t need to save anything. It also keeps multiple versions of your files marked by date/time and you can compare and revert back to any of the previous versions. Go to Version Control->local history->show history.

  • http://www.25thingsdesign.com Devin

    This looks great. I am going to have to download it later.

  • http://conecode.com Ryan

    I downloaded the Windows version, and it seemed a little buggy…at least during the install. I like the CSS features though.

    • http://www.jeffrey-way.com Jeffrey Way
      Author

      Not sure. You might be right, as it’s still in the preview release. But on Mac, everything seemed to be in order. It was a bit slow from time to time. But that’s all that I noticed.

  • http://www.xcellence-it.com/ Xcellence IT

    Would like to try it….

    thanks for sharing…

  • Gogkou

    What’s the shortcut key for expanding Zen Coding?

    • http://www.fishmemory.net fractalbit

      tab works for me

  • http://laranz.com lawrence77

    It may be a Quick Introduction instead of Quick Tip :)

  • http://nike1.se Nike

    Anyone knows how to add new color schemes on Windows? It took me like 5 min just to find the settings panel, i find this program a bit bloated tbh. I do however love all the features. :)

  • Alix

    You should really consider komodo IDE jeffrey, good article anyway, I’m always looking for the best IDE for Codeigniter!

  • Andrew Bekesh

    Notepad++ with ZenCoding my favourite. Not looking for any replacement.
    I still believe IDE’s like webstorm and such are way out of web/designer/developer needs got couple nice features, but still bloated with not needed stuff.
    For serious programmers/developers ZendStudio is way to go.
    Don’t know why they still release all this new stuff none uses.

    • Davis

      I don’t agree with this line: “For serious programmers/developers Zend Studio is way to go.”
      I know we all have different tastes on which IDE is the best but I personally believe that Visual Studio is the best IDE in the market, Zend Studio can’t even compare with Visual Studio’s features.

      Correct me if I’m wrong.

  • http://www.nouveller.com/ Benjamin Reid

    It looks pretty nifty, I’m always on the look out for better IDE’s.

    I use Coda at home but work on a PC at work so don’t have that luxury. What I’d love is Coda for PC, the simplicity and execution of the clips system is brilliant.

  • Jack F

    Anyone tried the phpide they offer?

  • Andi D

    PhpStorm and WebStorm are two different IDEs, right?
    Or is PhpStorm included in WebStorm?

    • http://www.jeffrey-way.com Jeffrey Way
      Author

      They’re separate.

  • Gergely Olah

    How does it work?

  • http://seekbob.com seekbob

    wow, really powerfull…

    which one should I choose?
    Webstorm or PHPstrom?

    • http://www.fishmemory.net fractalbit

      If you program in PHP then the phpstorm since it includes all the features in the webstorm and then some…

  • Daniel Shanahan

    Jeffrey, if I remember correctly, you did a recent screencast using Espresso by MacRabbit (http://macrabbit.com/espresso/). Did you like it? If so, can you do a quick screencast on that Text Editor? (BTW, I am not in any way associated with MacRabbit).

    Thanks.

  • Martin G

    Is WebStorm a subset of PHPStorm (or vice versa)? Do I need to use both apps, or only PHPStorm?
    Anyone checked this out? Can’t find any info on the website of the developers.

    regards,
    Martij

  • http://www.gabri.me Gabri

    I like the CSS features in this and also how simple it looks . also it`s great to find that it has local history like Aptana .

    btw, i made a theme for Aptana , Notepad++ & Komodo Edit if anyone is interested you can download it from my site.

  • Mark

    what’s the shortcut key for expanding the zen coding in WebStorm?

    • http://www.jeffrey-way.com Jeffrey Way
      Author

      Tab.

  • http://www.jordanwalker.net Jordan Walker

    In my experience and understanding, why not find an IDE, master it, and stop looking for others!

    • http://www.jeffrey-way.com Jeffrey Way
      Author

      Because what if a much better IDE came along…but we were too stubborn to look over it? :)

  • http://sonergonul.com Soner Gönül

    Wow

    That’s cool !

    Thanks !

  • http://www.artelixdesign.com Melvin José

    Downloading it now.
    You convinced me to try it out.

Newer Comments →