Develop Reference

A feature rich JavaScript IDE environment?

I'm currently using Visual Studio 2008 to edit .js files with, and it has decent support but I want more...
I like the VS syntax highlighting and auto-indentation features but additionally would like advanced features like: contextual info and help, collapsible JavaScript blocks, implicit symbol understanding for searching, refactoring and that kind of thing; also warnings and errors for the js code.
Suggestions?
Edit: ooops... for the Windows platform. I see some Eclipse answers already and that's fine as I'll install Eclipse on Windows.
Purpose: I want the tool to be feature rich to aid my understanding of what's happening because JavaScript can get quite obtuse when jQuery is being used. Actually, it can be quite obtuse to understand regardless. Plus the additional (non-jQuery) branching for different browsers and tweaks. It can take a long time to wade through.

I use Komodo Edit (link) or Aptana.

Ever try Aptana?
http://www.aptana.org/

ActiveState Komodo Edit works here too. See my answer just posted here.

JetBrains is working on a promising Web/Javascript IDE called WebStorm. They currently have a public preview out:
http://www.jetbrains.com/webide/index.html
It has some interesting features:
Javascript refactoring
DOM-Based, Browser-Specific Completion
Code Navigation and Usages Search
Code Inspections and Quick-Fixes
JavaScript Debugger Based on Mozilla
Frameworks Support (jQuery, Prototype, ...)

My choice is NetBeanse (as IDE).
But more more often i prefer emacs

IntelliJ IDEA by jetbrains is pretty good for javascript:
http://www.jetbrains.com/idea/features/ajax.html

IDE for JavaScript development [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking us to recommend or find a tool, library or favorite off-site resource are off-topic for Stack Overflow as they tend to attract opinionated answers and spam. Instead, describe the problem and what has been done so far to solve it.
Closed 9 years ago.
Improve this question
What do you suggest for JS development IDE. Is there something similar to VisualStudio IDE, so I can run/debug my application in it?

At JetBrains we've just developed lightweight HTML/Javascript/CSS IDE WebStorm that includes very smart JavaScript Editor with DOM-based autocompletion and HTML5 API support.
It allows you to debug(breakpoints supported) and run your scripts directly from IDE.

A few options:
Visual Studio 2008 (including VWD Express, http://blog.berniesumption.com/software/how-to-debug-javascript-in-internet-explorer/)
Adobe Dreamweaver CS4
Notepad++ (or any other text editor), Firefox and Firebug

I think IntellJ's JavaScript support is excellent, just like everything else that they do.

Netbeans 6.x and Firefox+Firebug
In the past I used Aptana Standalone or as a Eclipse plugin. The Pro version has some nice addons like the embedded IE (to the always embedded Firefox) and debugging support for both browsers.
I found after hours of testing, that Suns Netbeans is the best PHP and Python IDE for Windows and Linux. I was surprised that also Javascript support can hold the candle to Aptana.
So Netbeans is my recommendation (not only for Javascript).
Give it a try, its free!

I've found Aptana Studio to be good.

I tend to recommend more and more Netbeans that has not been proposed yet (I am blind sometimes). Netbeans is developed by Sun and support not only Java but also a few other languages (PHP,Ruby,Python, Javascript).
I use it for a while now and I am very satisfied. It is fast, provides code completion and integrates easily major JS libraries (Prototype, YUI). It has also a debugger that you can tied to FF or IE.
Try it you won't be disappointed!

Here's a good list of IDEs you can use for writing JavaScript:
http://www.programmerfish.com/top-8-ide-integrated-development-environment-for-java-script-html5-ajax/

Nowadays I am using JetBrains' PHPStorm and I can easily say, this is the best editor I've ever tried. Comes with lots of features that I have not seen at other editors like,
find a word in a directory (grep equivalent)
extended and useful intellisense feature with multiple files and parent classes
internal GIT support
a tree view for application structure
an awesome version history support that works with GIT and your local history. This is very useful when you want to take a look at a GIT untracked file, you can see all history details of the file for weeks.
with a great addon named CSSXFire that works with Firebug and tracks the CSS changes and import them to editor and allows you easily reproduce the same changes that you've done in Firebug CSS Console. This is really awesome
another useful feature is, when you want to delete or rename a file, editor searches the file has been used in this directory and notifies you. This is called safe-refactor
intellisense for files, while you typing a css background-image, a src or an href attribute
Sometimes I deal with PHP so I prefer PHPStorm, so Front End Developers should prefer WebStrorm that is specialized for us.
I think, every FE Developer should try PHPStorm or WebStorm with Firefox and Firebug.

Komodo IDE (or the free Komodo Edit if you can live without an integrated debugger) are pretty nice.

I tried few IDE last week and NetBeans is my winner. It got silent upload option for file upload in background. And very good code completion, folding, etc.

Here is my experience with the applications based on Extjs in UI with Java as server side language. I am a big supporter of open source technologies/products.
I so far I have used Eclipse, Netbeans, Webstorm and notepad++ with some added plugins.
And I feel Netbeans is best in terms of Syntax highlighting and formating. It recognizes missing commas, global variables, duplicate keys for object literals in a very impressive way.
Almost similar things can be achieved by adding some pligins like Spket in eclipse too, but it asks for licence when you go for advance level of settings.
If you are not so much concern about an integrated environment with web server then Web storm is best in all the aspects, but the biggest drawback of it is, "Its paid". ( Even if it asks for 1000 Rs ).

Firebug and a good syntax highlighting text editor is about the best combo. It's not necessary to add in much else. With just this combo you get:
Ability to set breakpoints
Inspect objects
Traverse the DOM
Alter CSS rules on the fly
See network traffic/responses
Evaluate and substitute code on the fly in production
And there are tools which add on to Firebug:
YSlow - Determine "why" your page is slow
Fireunit - Run unit tests
One of the advantage of Javascript development is that it's flexible and you can get instantaneous feedback while developing. I see no reason to get in the way of that by adding an IDE which includes a "deployment" step.

Notepad++ comes with built-in javascript syntax highlighting and JSlint plugin is very handy. IMHO for debugging there is nothing better than Chrome developer tools or Firebug.

This page reviews the most advanced Javascript IDEs (in terms of refactoring and intellisense anyway) :
http://blue-walrus.com/2013/08/review-javascript-ides/

Eclipse and JSEclipse plugin and of course Firefox + Firebug the ultimate duo. You'll find this development setup satisfactory.

Aptana is a great IDE as it will provide intelli-sense for CSS, javascript, html, java, etc. The debugger gives you the choice to run in FF or IE and is a full featured debugger. The community edition allows you to run a server side javascript as well. A very solid and feature rich platform for free.

Is there a windows utility similar to HTML Tidy for Javascript? [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 7 years ago.
Improve this question
I want to cleanup some javascript files and reformat them with nice indents, etc,
Are there recommendations for utilities to do this under Windows?

Beautify Javascript is a good, simple option.
(Oops. Thought I grabbed the link for the app, not the home page.) ;)

Try the online JavaScript Tidy
Several attempts have been made to
produce programs to reformat code, but
these often fail to cope with
situations such as '{', '}' or ';'
characters inside strings, regular
expressions, or comments, so virtually
all of them end up with broken code.
However, browsers already have their
own parsers built in that deal with
all of these situations. This script
hooks into the browser's own parser,
by wrapping the code in a function
then using the native toString method
to obtain the tidied code. As a
result, it relies on the browser
producing a tidied output, which there
is no requirement for them to do. In
fact, it relies on the browser
decompiling to tidied code instead of
just retaining the original, which is
an expensive process in terms of
performance, and leads to extra
complexity when trying to make sure
the decompiled code still works, so
not all browsers choose to do it this
way.
For best results, use Opera 9.2x- (not
9.5+), Safari or Konqueror on this page. It partially works in Firefox
(nested functions are not tidied,
meaning that most scripts you want to
tidy still end up unreadable), and
fails to reformat code in IE and iCab
3-. Since you can always keep a copy
of Opera 9.2 on your computer (as well
as whatever the current version is), I
recommend you use Opera, and keep a
copy of it around for use with JSTidy.

If you have Visual Studio you can open the Javascript document and press CTRL+K, CTRL+D to format the whole document.

This page on about.com has a tool where you paste in your script and it cleans it up for you.

GNU indent tidies up C-style languages. Perhaps Javascript could be used as a subject as well.

For offline use, this answer to a similar question explains how to set up the code Jonathan suggested to run from a command line with Rhino.

Our JavaScript Formatter uses a language-precise parser to read the Javascript and then format the code. It doesn't get confused by the contents of HTML, strings, or characters. Does run on Windows.

JavaScript Source Code Analyzer [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 6 years ago.
Improve this question
Does anyone know of a good, extensible source code analyzer that examines JavaScript files?

In the interest of keeping this question up-to-date, there is a fork of JSLint called JSHint. An explanation of why JSHint was created can be found here, but to summarize:
JSHint is a fork of JSLint, the tool
written and maintained by Douglas
Crockford. JSLint served me well for
quite some time but in the past few
months it has gotten uncomfortably
opinionated and hostile towards your
code. It is quickly transforming from
a tool that helps developers to
prevent bugs to a tool that makes sure
you write your code like Douglas
Crockford.

JSLint has historically been the main tool for this, but several more now exist:
JSHint - a fork of JSLint that is said to be a little less opinionated
Closure Linter - a linter that checks against the Google Javascript Style Guide
ESLint - a more flexible tool, but newer, and not yet as stable.

If you haven't found it yet, you should take a look at Google Closure Compiler. Compiles your JavaScript and finds errors in code. http://code.google.com/closure/compiler/docs/gettingstarted_api.html

I tried out ESlint and found it good..you can also add custom rules there..Here is the github repo: https://github.com/nzakas/eslint

JSAnalyse has just been published on codeplex. It is a tool which analyses the dependencies between javascript files. You can even define the allowed dependencies and JSAnalysis checks whether the defined rules are fulfilled or not. That allows to keep track about the javascript dependencies even in big projects and to have a clean architecture.
JSAnalyse can be executed as a command line tool or configured via the Visual Studio Layer Diagramm. It is also easy to integrate into the build. With gated check-ins you can keep the dependencies under control.

There exist a parser called ECMAScript parsing infrastructure for multipurpose analysis (esprima) located at http://esprima.org/ with several example tools that can be used in some analysis
ECMAScript parsing infrastructure for multipurpose analysis

Apart from JSLint, JSHint, ESLint, Plato, Google Closure-Linter there's another tool named Esprima.
Here is the link for it: http://esprima.org/
Also, this is the github link for the tool Esprima: https://github.com/ariya/esprima
I faced installation issues while trying out Google Closure-Linter for Windows. But, it does mention on the web page that its support for Windows is experimental. All other tools are easy to use.

I have found JSLint which helps correct a lot of common errors and such; however, I'm hoping to find something that I can add my own rules and such to help automate some coding standards stuff that my company is wanting to implement into JavaScript.
http://www.jslint.com/
I need to look into it's extensibility model more.

There's a few tools on the list of tools for static code analysis at wikipedia that has JavaScript support, you can allso see JavaScript Debugging if any of the tools mentioned would help. There's allso a few good tools at YUI (Yahoo! Developer Network), as well as a lot of helpful components.
I've allways used JSLint myself, and that's the only analysis tool for JS I've tried. I've grown more and more fond of JavaScript, but good tools is still a problem. :(

I use Aptana for JavaScript file analysis. It catches alot of goofs (if condition with a single =). It also describes the class layout. I believe it has a jslint implementation embedded in it.

Are there any JavaScript live syntax highlighters? [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 6 years ago.
Improve this question
I've found syntax highlighters that highlight pre-existing code, but I'd like to do it as you type with a WYSIWYG-style editor. I don't need auto-completed functions, just the highlighting.
As a follow-up question, what is the WYSIWYG editor that stackoverflow uses?
Edit: Thanks to the answer below, I found two that look like they might suit my needs:
EditArea and CodePress
EDIT: See this question also:
https://stackoverflow.com/questions/379185/free-syntax-highlighting-editor-control-in-javascript

The question might be better stated as "What syntax-highlighting editor do you recommended to replace an html textarea in my web app?" (Some of the other answers here deal with desktop apps or pure-syntax highlighters, not client-side editors)
I also recommend CodeMirror, it's written in Javascript and supports lots of browsers. It uses a real parser (rather than regexps) so it can deal with complex problems like correctly highlighting escaped strings. The developer is also very responsive on the discussion group.

Here is a really interesting article about how to write one: (Even better, he gives the full source to a JavaScript formatter and colorizer.)
Implementing a syntax-higlighting JavaScript editor in JavaScript
or
A brutal odyssey to the dark side of the DOM tree
How does one do decent syntax
highlighting? A very simple scanning
can tell the difference between
strings, comments, keywords, and other
code. But this time I wanted to
actually be able to recognize regular
expressions, so that I didn't have any
blatant incorrect behaviour anymore.
Importantly, it handles regex correctly. Also of interest is that he used a continuation passing style lexer/parser instead of the more typical lex (or regex) based lexers that you'll see in the wild.
As a bonus he discusses a lot of real-world issues you'll run into when working with JavaScript in the browser.

See Google code pretify.
See this question for the edit control that stackoverflow uses.

Sorry to drag this back up but the best i have found in CodeMirror http://codemirror.net/

I dont program a lot of javascript but JSEclipse has been pretty helpful for me in the past. It comes as an Eclipse plug-in.
I've been using it for years for free
http://www.interaktonline.com/products/eclipse/jseclipse/overview/
I also rely heavily on FireBug for Firefox whenever I deal with Javascript

You can also try http://softwaremaniacs.org/soft/highlight/en/ - it's fast, it supports not only javascript but many other languages. And if you need a live preview of how the highlighting will work, you can use setInterval to run the highlighting and show it in a separate box.

Although it has a steep learning curve, Vim is the best editor out there, for any language. It has a GUI version, but really shines in terminal editing. Any time spent learning how to use this editor is not time wasted. It has syntax highlighting, as you're looking for, as well as thousands (literally) of other features and plugins.

Gotta go with Bespin by Mozilla. It's built using HTML5 features (so it's quick and fast, but doesn't support legacy browsers though), but definitely amazing to use and beats everything I've come across - probably beacause it's Mozilla backing it, and they develop Firefox so yeah... There's also a jQuery Plugin which contains a extension for it to make it a bit easier to use with jQuery.