Developer

JavaScript Editor eliminates some development hassles

JavaScript has always suffered from a lack of development tools. But, fortunately, help is on the way with the Antechinus JavaScript Editor.


Working with JavaScript has always been frustrating because the selection of JavaScript editors is sparse, and those that are out there aren't particularly useful. Plenty of tools are available for entering and validating HTML, JSP, ASP, and so forth, but developers have been forced to manually enter JavaScript routines and cross their fingers—until now. The JavaScript Editor from Antechinus promises to turn JavaScript development into a pleasurable experience. This is a lofty goal, but the product comes close to achieving it—with a few exceptions.

Take JavaScript Editor for a test-drive
Antechinus JavaScript Editor is available from the C Point Web site. Trial copies are available, and all pricing information is available online.

Navigating the interface
Figure A shows the JavaScript Editor interface. The top window is the main development area; it contains the files that are currently open. Four files are open in Figure A—test.js, test2.js, test.html, and ScreenResolution.htm. Yes, HTML files as well as JavaScript are easy to edit. The odd twist is that HTML is not an option when saving individual files. The default file type is JavaScript (js), so you must manually enter the .html (or .htm) extension. This becomes a nuisance when you're creating many HTML files.

Figure A
Antechinus JavaScript Editor IDE


JavaScript may be entered in a separate file (.js file extension) and referenced in the head section of an HTML file or entered directly in the HTML file. The simple HTML file (test.html) references the external JavaScript source file (test.js). Many developers think that this type of linking or importing allows JavaScript code to be hidden, but a user can easily access a referenced JavaScript file by typing in the appropriate URL.

Reach into the toolbox
JavaScript Editor includes many features to streamline JavaScript development. The toolbar in the JavaScript Editor IDE makes it easy to work with both JavaScript and HTML elements. The Functions menu provides access to various JavaScript objects and their respective methods. For example, in Figure B, we've accessed the prompt method of the window object. The Operators menu provides one-click access to flow control, looping, conditionals, and Boolean operators. No need to grab a book or search the Internet for proper syntax.

Figure B
Easy access to JavaScript object models


The HTML menu lets you access common HTML entities, so you can quickly mark up a test HTML page for a JavaScript routine. Only a small number of HTML elements are included, however, so a good HTML reference is still necessary.

Time to start coding
One of the coolest features of the JavaScript Editor is the intellisense/autocomplete feature. This is a standard aspect of most IDEs but rare for JavaScript editors. This feature provides a pop-up list of available methods/properties for an object. It is triggered once you enter a period after the object name. Figure C shows the pop-up information for the window object. The syntax appears as well. This feature alone is worth the purchase of the product.

Figure C
Intellisense/autocomplete feature


Other development features include brace matching, which allows you to quickly locate a brace's matching brace. This is a common JavaScript error: too many or not enough braces. To make navigation easier, you can display line numbers and use bookmarks. You can also customize your color scheme, if you want.

Gain JavaScript knowledge (or work without it)
JavaScript Editor includes a comprehensive JavaScript tutorial that will have most developers up and running in no time. Also, context-sensitive help is available at all times. Highlight a JavaScript object/keyword and press [F1] to view information for the highlighted item. Your brain can now concentrate on coding instead of trying to remember countless elements and syntax.

Testing, testing, testing…
The most time-consuming aspect of development is testing and debugging. Nowhere is this more evident than in JavaScript. Debugging JavaScript is a cumbersome process, requiring the editing of source files and browser reloading to view the results. I have yet to see a manageable JavaScript debugging process. Usually, it involves strategically placed alert statements to monitor script activity.

Sadly, the JavaScript Editor product does not offer much help in this area. There is no way to debug code, stepping through it or setting breakpoints. Still, the IDE does allow you to easily change and reload source files. The Preview In Browser option uses the system default browser to give you a glimpse of your handiwork with one easy click.

Deployment
Once all JavaScript is functioning as necessary, it must be deployed to a staging or production Web server. The JavaScript Editor offers no help in this area, either. Files are saved locally during the development process, so you have to manually copy or move them to the necessary location for QA or production deployment.

Integration with other programs
C Point offers several products in addition to JavaScript Editor, including one for creating Web effects (Antechinus Web Effects) and for drawing (Antechinus Draw Magic). The Web Effects program is easily integrated with the JavaScript Editor to combine the power of both environments.

A helpful JavaScript aid
The Antechinus JavaScript Editor is a good product with a modest price tag ($35 USD). The basic functionality that the environment provides makes it a solid addition to a developer’s toolbox, although I’d like to see better debugging support. You can download a trial copy and take it for a test-drive to get a better feel for the product.

Editor's Picks