Creating Dojo-enabled web projects

Dojo-enabled web projects hold all of the web resources that are created and used when developing a Dojo web application.

Before you begin

Install Ajax, Dojo Toolkit, and HTML development tools.
Install the WebSphere® Application Server Feature Pack for Web 2.0 to run your project on WebSphere Application Server.

Procedure

In the Enterprise Explorer view, right-click and select New > Web Project.
In the Name field, enter a name for your new web project.
From the list of project templates, click Dojo Toolkit.
In the Programming Model section, specify one of the following programming models to use when creating your project:
- To develop your web application using only Javascript, HTML, Dojo, and CSS, click Client-side only (HTML, JavaScript). Server-side programming is not available with this option.
- To use Java EE technologies such as Servlets, JSPs, or JPA to develop your web application, click Java EE.
To configure your new web project, click Next. The available configuration options depend on the programming model you selected.
If you are using the Java EE programming model, proceed to step 7. If you are not using the Java EE programming model, jump to step 9.
From the list of available configuration options, click Deployment.
From the Target Runtime list, select a target run time for your new web project.
Note: If the target run time was previously set, this list is not available. Complete one of the following steps to make this list available:
- Specify a new EAR project name and then select a target run time.
- Select an existing EAR project from the list that uses the target run time that you want to use.
By using the Web Preview Server you can compile, test, and run resources in a Dojo-enabled web project.
From the list of available configuration options, click Dojo Toolkit.
Configure how your project accesses the Dojo Toolkit and which version of the toolkit to use:
1. Click Change these setup options.
2. Choose one of the following options to set up Dojo in your web project and click Next:
  Copy Dojo into this project. It will be deployed from there.
  Specify the name of the Dojo folder and which of the following Dojo distributions to use:
  - The default Dojo distribution included in the run time
  - A Dojo distribution in your workspace or file system
  You can also select an archive file of a compressed Dojo distribution. When you click Finish, the contents of the archive file are automatically extracted into your project.
  Dojo is in a project in the workspace, and will be deployed from there.
  
  Browse to the root Dojo folder in another project in your workspace. The Dojo toolkit is not copied into your project. It is deployed from the project that contains the toolkit.
  
  Dojo is remotely deployed or is on a public CDN.
  Specify the remote location of the Dojo toolkit source:
  - Public CDN: Enter the URL of a publicly available content delivery network. Content delivery networks provide geographically distributed hosting for open source JavaScript libraries. When a browser resolves the URL in your web application, the browser automatically downloads the file from the closest available server.
  - Remote URI: Type the URI of the remote location to the root Dojo folder.
  In the Corresponding Dojo section, choose the Dojo source distribution that is the closest match to your remote Dojo Toolkit. This selection provides access to tools such as content assist. You can choose the default Dojo provided with this product or browse to a Dojo folder in your workspace or file system.
3. If you copied the Dojo Toolkit into your project, the latest version of Dojo that IBM® supports is copied into your web project. If you want to use a different Dojo Toolkit, select a version from the list.
  Tip: This product supports the Dojo Toolkits that are included in the WebSphere Application Server Feature Pack for Web 2.0 and Mobile, and includes following toolkits:
  - Dojo Toolkit SDK 1.3.2
  - Dojo Toolkit SDK 1.4.1
  - Dojo Toolkit SDK 1.5.0
  - Dojo Toolkit SDK 1.7 (default)
4. If you copied the Dojo Toolkit into your project, you can include only the parts of the Dojo Toolkit that are required for your web application. Expand the Select the Dojo components to be included in the project section and select the Dojo components that you want to include in your project.
  Tip: To select one of the most commonly selected configurations, choose an item from the Common Configurations list:
  - Minimal includes dojo/dojo.js, dojo/_base.js, and dojo/_base.
  - Dojo Core includes dojo.
  - Dijit includes dijit and dojo.
  - Dojox Mobile includes dijit, dojo, dojox/fx, dojox/mobile dojox/fx.js, and dojox/mobile.js.
  To include Dojo support in your web project, select dojo/dojo.js, dojo/_base.js, and dojo/_base (the minimal configuration).
  Note: The test code included in Dojo Toolkit SDK 1.6 and previous versions is vulnerable to cross-site scripting attacks. These vulnerabilities are contained in several .php files that supply dummy data for the test cases. When you select these files to copy into the project, a warning message is displayed in the Dojo Project Setup page of the wizard. Clear the selections for these files so that they are not copied into the project. If you require these files, ensure that they are not deployed with your web application.
Click Finish to create your web project.

Results

In the Enterprise Explorer view, a dojo folder is created under the WebContent folder. When you create a web page, the palette opens with several Dojo drawers. The Dojo components in the drawers are supplied by IBM at design time. At run time, the JavaScript that corresponds to the Dojo resources you specified during project creation is run.

What to do next

JavaScript files must be stored in the WebContent folder. JavaScript files that are referenced by HTML or JSP files run on the server even when they are not in a JavaScript source folder. A JavaScript source folder is used to determine which files to validate and make available for content assist. To set up source folders or view existing source folders in the project properties, right-click your web project and select Properties > JavaScript > Include Path.

JavaScript files that are not referenced by HTML or JSP files must be placed in a JavaScript source folder. After these files are placed in a JavaScript source folder, they are available for validation and content assist.