

Ask HN: JavaScript dev environment ? - Murkin

I finally decided to dive deeper in JavaScript.<p>Move away from simple JS and Firebug debugging. To large and more complex software for the front-end and explore the new opportunities in the back-end (Node.js and such)<p>What I need is not just an editor (vim will do) but rather a full environement where I can edit, run, test and debug JavaScript.<p>All recommendations are welcome.
======
igrekel
I was actually looking into that over the last few days and haven't found
anything satisfying yet.

I have tried Aptana, WebStorm (from Jet brains), textmate, bbedit, jseclipse,
visual studio, vim. But still haven"t found what I am hoping to find.

I find the eclipse based solutions (Aptana and jseclipse) are too slow for my
taste and while they do provide things like completion, it is fairly limited
to the obvious things. Aptana probably does what you are looking for, it has a
debugger that integrate with your browser.

I tought webstorm seemed better but it is also a bit slow and brings a bit too
much with it. Give it a try it may be what you are looking it also has
debugger integration.

I couldn't find any special editing facilities other than text highlighting
and indentation in bbedit and eventually gave up. TextMate does it ok but
since I am not that familiar with javascript and the libraries I am using, I
was hoping for something that would let me edit and introspect things at the
same time. its really comparable to what you could achieve with vim or emacs.

~~~
DTrejo
I've really enjoyed using Textmate with various JS bundles like Javascript
Tools (comes with jslint, js beautify, and some snippets).

Regarding a "more full development environment," my good friend said the
following to me:

 _IDEs can be nice, as they help you handle complicated code. On the other
hand, they don't prevent you from writing complicated code in the first
place._

~~~
igrekel
I was more looking for a more complete IDE because I am not very familiar with
javascript and JQuery and hope it would make looking up available functions
easier.

------
daleharvey
I use emacs with jslint + flymake, js2 mode + espresso, it isnt perfect yet
but its getting pretty close.

~~~
phuff
You can also use something like my js-comint mode (see <http://js-comint-
el.sourceforge.net/>) to run code that isn't dom-ish in a js repl like
spidermonkey or rhino from emacs. It's pretty sweet to be able to run an
expression with C-x C-e and see how it works.

~~~
mahmud
Thanks, I was looking for that.

What are people's opinions of ES4? I am using it to learn the good parts of
Javascript. Is it recommended?

------
koenbok
I use a combination of TextMate, d8 (v8 shell) and Sprockets
(<http://getsprockets.org>). For debugging mostly Webkit's debugger.

------
gmurphy
You didn't specify the platform, but Visual Studio with Visual Assist X
surprisingly makes for a really good JS editor. I've found it a lot faster and
easier on my system than the larger Java-based JS editors (JSEclipse, Komodo
etc).

It doesn't have integrated debugging, it costs a lot, and people won't believe
you when you tell them about it, however.

~~~
evo_9
Yeah, I like VisualStudio 2010 also, I know it's not a popular choice amongst
HN'ers, but MS started as a Tools company and out of everything they make, I
think their dev tools are actual quite good. I do a lot of JS/jQuery coding
and it works reasonably well.

I'm curious about Visual Assist X - does it add more/better support for
Javascript and/or jQuery?

I also use Aptana Studio on OSX when I do pure UI coding. It's not bad for
pure JS/jQuery but their isn't much autocomplete support.

Edit: Side note on the cost of VisualStudio 2010 - I signed up for MS's
BizSpark program and was given a free MSDN license including full copies of
VisualStudio 2010, SQL 2008, etc.

~~~
Encosia
For those purposes, Visual Studio is free:
<http://www.microsoft.com/express/Web/>

------
olegp
IntelliJ IDEA (<http://www.jetbrains.com/idea/>) has good JavaScript support,
including refactoring. I also quite like Komodo Edit
(<http://www.activestate.com/komodo-edit>), since it's more lightweight but
has JavaScript code completion & is easily extensible.

While you're looking at Node, I also suggest you take a look at RingoJS
(<http://ringojs.org/>). It should be easier to get started with & has
debugging support.

~~~
kodisha
+1 for IntelliJ IDEA, js support is really superb.

------
maushu
This rather related to my startup in development. I hope to release this
service soon.

Anyways, I use a decent editor (Notepad++ is a good one) for most code that
doesn't need debugging (besides the good old trace statements) and for
debugging I use eclipse.

In the latest version of Node.js (0.1.100) a console.log() was added.

------
antichaos
What's wrong with Firebug? I fail to find a better alternative for JS
debugging.

~~~
hundredwatt
I have run into problems in the past caused by forgetting to remove
console.log() lines from my scripts. If the console wasn't open, then the
scripts didn't work.

This isn't a huge problem or reason not to use Firebug (which I would be
totally lost without), just something to be wary of.

~~~
geocar

        if(!console)console={log:function(){}};
    

You're welcome.

~~~
marcuswestin
This will throw if console is not defined. Try

    
    
       if (!window.console)
    

Or

    
    
       if (typeof console == 'undefined')
    

Or

    
    
       if !('console' in window))
    
     N

~~~
geocar
Doesn't here. What are you using?

------
augustl
Use JsTestDriver to write and run your tests.

One of my pet projects is open source and tested with JsTestDriver [1], that
should be a good starting point for learning more about how to test JavaScript
in webapps.

I also like to use Sinon [2] for stubbing and mocking. The author of Sinon is
also putting the finishing touches on a book about TDD-ing JavaScript.

EDIT: calendar-logic.js [4] an example of how you can extract and test logic
in separate libraries. It's being used on figureoutwhen.com.

[1] <http://github.com/augustl/figureoutwhen.com> [2]
<http://cjohansen.no/sinon/> [3] [http://www.amazon.com/Test-Driven-
JavaScript-Development-Dev...](http://www.amazon.com/Test-Driven-JavaScript-
Development-Developers-Library/dp/0321683919) [4] <http://ditrw.com/calendar-
logic-dot-js/>

------
shawndumas
I have been enjoying WebStorm. BTW: it'll do Zen Coding[1]. That's a plus!

.

[1]: <http://code.google.com/p/zen-coding/>

------
CyberFonic
This is what works for me:

3 screens: 1 with two windows for editing code, 1 to run Chrome and 1 for
Chrome Dev Tools. Overkill? Nope, good to see it all in context.

I modularize code (bottom up dev style) and test each class / function before
integrating with code body. Chrome Dev Tools is fantastic for tracking down
CSS cascade probs, etc.

Other tools: Vim, Rhino book and www.w3schools.com for references. I develop
only for Chrome / Safari (some FireFox) so can't suggest as for IE, Opera,
etc.

------
gmosx
I use the Google chrome developer tools. Highly recommended!

------
nostrademons
Most of the JS pros I know just use vim/emacs + FireBug.

------
arc_of_descent
What has complex got to do with the editor? Maybe it would help a bit. But if
you design the codebase to be modular, you have only a little part of the code
to worry about at a time, so you can use your current editor setup. :)

------
warfangle
emacs with espresso mode; rhinounit.

