- JSDT Core: includes the parser, compiler, DOM and more.
Help can be found online on the Eclipse site. For instance, the Juno Help Page can be found here.
Getting Up and Running
The good news is that many of the latest versions of Eclipse already have the JSDT installed. This can easily be verified by opening the Install Software wizard:
- Click on Help > Install new software… from the main menu.
- Select your Eclipse version's main download site in the Work with list. For instance, the download site for Juno is "Juno - http://download.eclipse.org/releases/juno".
- Check the "Hide items that are already installed" box.
Otherwise, you can download the JSDT as part of the Eclipse Web Tools Project (WTP) or as a stand-alone plugin.
Building a Static Website
To create the project:
- Select File > New > Static Web Project from the main menu. If you don't see the Static Web Project item in the list, you can choose Other… to bring up the Select a Wizard Dialog. There, you'll find it in the Web folder .
- On the New Static Web Project screen, give the project a name - something like "JSDT_static" - and click Finish to create it.
Now we'll need an HTML file.
- Right click the WebContent folder and select New > HTML File from the popup menu.
- On the Create a new HTML file screen, give it a name of "index.html" and click Next.
- On the Select HTML Template screen, make sure that the Use HTML Template box is checked, and select "New HTML File (5)" from the list. That will create a blank HTML page using the WWW3 HTML5 specifications. HTML5 support was included as of the JSDT September 2010 release.
- Click Finish to create the index.html file. That will also open it in the editor.
- Position the cursor under the page title and enter the open tag character and the letter 's' (<s). That will be enough to bring up the auto-complete list and position the script tag at the top. Hit the Enter key to insert the script tags at th cursor.
- Insert a newline between the script tags and begin to type "al" as in "alert". Then press the Ctrl+Space key combination to bring up auto-complete suggestions. Select the first alert and hit Enter to insert the alert() method. Pass the string "Hello world!" or something equally trivial.
You should now have something similar to the following:
Previewing the Page
Usually, a web project can be viewed by right-clicking the HTML page and selecting Run As > Run on server… from the popup menu. Unfortunately, this won't work with the JUNO SR2 release because of a known bug with the http preview server. When you launch the preview server, you'll get the following error:
java.lang.NoClassDefFoundError: org/eclipse/jetty/webapp/WebAppContext Caused by: java.lang.ClassNotFoundException: org.eclipse.jetty.webapp.WebAppContext at java.net.URLClassLoader$1.run(Unknown Source) at java.security.AccessController.doPrivileged(Native Method) at java.net.URLClassLoader.findClass(Unknown Source) at java.lang.ClassLoader.loadClass(Unknown Source) at sun.misc.Launcher$AppClassLoader.loadClass(Unknown Source) at java.lang.ClassLoader.loadClass(Unknown Source) Exception in thread "main"
Most likely, this will be fixed in the upcoming June, 2013 release.
In the meantime, the workaround is to not use a server to view your Static Web Projects. This shouldn't be a problem since HTML and JS resources don't require a server anyway. Even Ajax should work without one.
So instead of Run As > Run on server…, select Open With > Web Browser from the menu. By default that will still open the page using the built-in Web browser. If you wish, you can select another browser via Window > Web Browser from the main menu. From there you can select the default system browser or a specific installed browser. Should the browser that you want not show up in that list, you can add it manually from the Preferences under General > Web Browser in the left-hand tree.
In today's article, we learned how to configure and utilize the JSDT plugin for Eclipse. In the next one, we'll learn how to add external third-party libraries to our projects.
If you enjoyed this article, please contribute to Rob's rock star aspirations by purchasing one of Rob's cover or original songs from iTunes.com for only 0.99 cents each.
Rob Gravelle resides in Ottawa, Canada, and is the founder of GravelleWebDesign.com. Rob has built systems for Intelligence-related organizations such as Canada Border Services, CSIS as well as for numerous commercial businesses. EmailRob to receive a free estimate on your software project.
In his spare time, Rob has become an accomplished guitar player, and has released several CDs. His former band, Ivory Knight, was rated as one Canada's top hard rock and metal groups by Brave Words magazine (issue #92).
Rob uses and recommends MochaHost, which provides Web Hosting at $3.10 per month, 2 LifeTime Free Domains, and 6 Months Free!