Using Dojo to develop AJAX Web applications in WebSphere Smash

Before you start

This article assumes that you have downloaded WebSphere SMash and completed a concise tutorial, or have written a simple application. You should be familiar with the fundamentals of Ajax and how Dojo is used.

You will also need the following prerequisites to complete the sample application in this article:

JDK 5.0 or later.

WebSphere sMash 1.0.0.4 or later command-line environment.

An unobstructed network connection to connect to an SMTP mail server.

Firefox 3.0 for starting Appbuilder

Appbuilder is now part of the WebSphere SMash Developer Edition (Developer version), providing a web-based development, testing, and operating environment for WebSphere SMash applications.

You can enter the following command at the command line to open Appbuilder:

Appbuilder Open

The first runtime takes a while to automatically configure, and when you're done you'll automatically open a browser window and you'll see the Appbuilder main interface.

You can use the following command to turn off Appbuilder:

Appbuilder stop

Using Dojo for front-end Ajax programming in WebSphere SMash

The WebSphere SMash contains a dojo toolset that enables Ajax-based WEB front-end development using dojo. While Ajax and Dojo are not necessary for WebSphere SMash applications, by using them, we can build a more user-friendly WEB application for the user experience.

Add Dojo to the WebSphere sMash application

By adding dojo dependencies to the WebSphere sMash application, we can use dojo in the application. Open the Config/ivy.xml file for the WebSphere sMash application and add the following line.

<dependency org= "Dojo" name= "Dojo" rev= "1+"/>

For more information about Dojo, see resources. The following describes the related support that WebSphere SMash provides for Dojo development.

Use conventions to build custom Dojo widgets

Convention is a customary usage, which is the best practice accumulated over the years. For example, Ruby on Rails benefits from the "Convention over Configuration" feature. The Dojo widget is a combination of standard files for WEB applications to build a reusable component that includes HTML and JavaScript. It is very powerful and suitable for building complex, reusable WEB applications. So WebSphere SMash introduces a convention to organize these custom Dojo widgets, which means that you can simplify the integration of tools by placing the relevant files of these widgets in a specific directory app/zwidgets/of the engineering structure. For example, this practice can help the Visual Web page editor Find your custom widget and add it to the Editor's toolbar.

In order to use such a convention directory structure, the WebSphere sMash application should add a Dojo module. By adding a Dojo module, the WebSphere sMash application will look for related files from the app/zwidgets/directory when it encounters a/zwidgets request. For example, if we need to use this Convention directory to build a Dojo widget called X.mywidget, you can create the following two files:

app/zwidgets/x/MyWidget.js

　app/zwidgets/x/templates/MyWidget.html

Dojo's module registration is required before using custom widgets. For the above example, you also need to add the following line of script to register the custom module.

Dojo.registermodulepath ("x", "...). /zwidgets/x ");

In the above example, we use a relative path, which ensures that your application is not affected by the change in the context root of the WebSphere SMash (described in the resources SMash).