Which HTML/CSS/JS IDE do I want?

October 27, 2009 1:31 PM

Which HTML/CSS/JS IDE do I want?

So I've been doing AS3 development for the last few years, using Flex Builder, but am now moving back into HTML/CSS/JS. I've gotten used to having a fairly intelligent IDE and I'd like to not go back to the bad old days of having to type every single param and property from scratch every time. (I'm looking for code help, not just highlighting.)

I have tried a few but none seems to have everything I want:

1. Dreamweaver:
Pluses: When you link to a stylesheet, you can CTRL+space and get a list of styles to choose from.
Minuses: Weak support for JS. (no auto-complete at all)

2. Aptana:
Pluses: Seems to have excellent JS support, including major AJAX libraries.
Minuses: Unless I am missing something, I can't choose Css styles off a list, and that is a major major timesaver for the work I'll be doing.

3. HTMLPad 2010:
Plusses and minuses seem about the same as Aptana, plus it costs money. (DW CS3 is already installed on my work machine so no cost there.)

So, am i doing something wrong with Aptana? Is there another piece of software I'm not aware of? Or should I settle for DW for html/css and Aptana for JS? (The work will probably be 80% or more on the html/css side.)

thanks!

posted by drjimmy11 to computers & internet (16 answers total)

To clarify my issue with Aptana: I may well be able to pick from a lists of styles embedded in an html doc by using the "outline" feature. But I can't figure out how to do so for styles in a stylesheet included with a [link] tag, which let's face it, is how it's done 99% of the time.

if I could do that I would go with Aptana for sure.
posted by drjimmy11 at 1:37 PM on October 27, 2009

Intellij is now opensource, awesome ide. You might also want to try Netbeans. They are both primarily java ides but support all of things you stated.
posted by zeoslap at 1:39 PM on October 27, 2009

In trying to wean myself off of Homesite now that Adobe has discontinued it, I've found Komodo Edit to be a decent replacement. I've been working in it for PHP & Python anyway and it has JS autocomplete (plus jQuery support) and CSS suggest and auto-complete.
posted by yerfatma at 1:52 PM on October 27, 2009

Ok, I tried netbeans and it's close but I have this:

[h1 class=""]

and when I press CTRL+space in between those quotes, I get "no suggestions." Which is bizarre, since I have a linked stylesheet and can see the style names right over there in the panel on the side. But it still wants me to type them myself.

Off to try Komodo now...
posted by drjimmy11 at 1:58 PM on October 27, 2009

Unless I'm missing something, Komodo also will not provide me with a list of class names from my stylesheet when I have [h1 class=""].
posted by drjimmy11 at 2:07 PM on October 27, 2009

IntelliJ's open source license seems to be free only for open source projects, which this is not.
posted by drjimmy11 at 2:10 PM on October 27, 2009

Last time I checked out Dreamweaver it had bloated itself to the point of unusability, and I doubt it's gotten much better since. Avoid.

You know what's surprisingly good? The HTML editor from MS Expression Web. If you turn off WYSIWYG your left with a nice slim editor that's pleasingly Homesite like.

(That it's good is actually even more suprising when you consider it's origin: It actually started life as the much maligned Homesite. For some reason MS don't seem to mention that much...)
posted by Artw at 2:12 PM on October 27, 2009

Just to clarify one more time:

All of these programs do fine at suggesting code when writing a stylesheet: ie, I can pick "padding:left" off a list.

But what I want to do is, when writing html, pick my custom class name "drjimmysStyle1" off a list of all the styles in my linked stylesheet(s), rather than try to remember that whole string and run the risk of time-sucking typos. This seems so basic, but no one but Dreamweaver seems to support it.
posted by drjimmy11 at 2:25 PM on October 27, 2009

Last time I checked out Dreamweaver it had bloated itself to the point of unusability, and I doubt it's gotten much better since. Avoid.

Dreamweaver is bloated the way Photoshop is bloated. If you use the features, they're great. If you just need basic HTML/CSS, it's bloated.

OTOH, Adobe has spent a lot of time ensuring Dreamweaver interacts well with Flash, Photoshop, and Fireworks, and -- as the OP noted -- has dropped the ball on JavaScript tools (which would of course make Artw even more unhappy with it, since it would add significant "bloat").

If you want easy and mostly good HTML/CSS creation and great site-management tools but minimal JavaScript support, then Dreamweaver is your tool. But it sounds like you want a better JavaScript tool, in which case Dreamweaver is probably not what you want. But since I haven't used the other applications you mention, I don't know if they're any better.

One suggestion to accomplish what you mention above: You could use some sort of coding shorthand followed by search & replace. For example, instead of "drjimmysStyle1", call it "##s1". Then do a find & replace with whatever tool to turn "##s1" into "drjimmysStyle1". By creating your own shorthand naming conventions, you can save lots of typing time.
posted by coolguymichael at 4:09 PM on October 27, 2009

Well I am not sure what you guys mean by "bloat" - I have a modern computer so there are no performance issues, and I only use the features I want to use.

To reiterate why i want to pick CSS styles off a list, well it's the same reason any programmer wants to pick things off a list rather than type them: Trying to remember and having to constantly check names breaks your flow, even if it doesn't take up that much time on its own. And eventually you will make a minor typo and end up wasting a lot of time hunting it down.

(I need to name things well for other users, so short names is not an option. Also I find non-English shorthand names even harder to remember than long English ones.)
posted by drjimmy11 at 4:44 PM on October 27, 2009

A few people who do HTML/CSS (and PHP) in my office use Eclipse.
posted by Jairus at 5:08 PM on October 27, 2009

I'm generally a vim guy myself, but I've been hearing some good noise about Coda by Panic Software. If you're on OS X, you should probably check it out.
posted by weston at 7:06 PM on October 27, 2009

I know that Visual Studio 2010 has the feature you're looking for.
posted by Jacen Solo at 7:43 PM on October 27, 2009 [1 favorite]

Hmm, to be more helpful, check out the beta page for VS 2010, and download Microsoft Web Developer Express. (You could also be safe and get e.g. VS2010 Ultimate, then uncheck the stuff you don't care about, just in case the "Express" restriction ends up leaving out something cool.)
posted by Jacen Solo at 7:46 PM on October 27, 2009 [1 favorite]

Seconding VS 2009+. I was amazed at how much it helped me.
posted by toastchee at 5:05 AM on October 28, 2009

firefox, notepad++, firebug :)
posted by nihlton at 12:59 PM on November 3, 2009