The key steps for developing WebMaker applications include the following:
Design screen navigation diagram for complex applications (you can start with a single page).
Design or reuse a CSS and application Skin (defaults are available to get you started).
For each page, define or reuse a schema as a starting point, if necessary, to accelerate development. Additionally, you can use the range of controls available in the design palette as well as templates and existing pages. You can also use WSDLs and database Schemas to drag-and-drop information during the page creation process.
The complete application or specific page(s) can be generated at this stage for preview and deployment. The pages at this stage will include validation script based on the underlying schema model and data bindings to enable pre-population of pages and the capture and structuring of html page data after submission. The remaining steps below enable individual fields or groups of fields to be selected, styled, positioned, validated and mapped.
Indicate fields that will be part of each form. Include additional fields here for buttons, etc., which may not be part of schemas.
'Fine-tune' display and validation for each field if required.
Bind fields to XML elements in both directions using XPath.
Design and adapt server-side Controllers for page delivery and remote service orchestration as well as database access.
Import WSDL files to generate remote service proxies that can be used by WebMaker applications to call remote web services.
As well as the XML forms, each WebMaker application uses additional separation of key web application components to enable better engineering and easier future maintenance.
WebMaker application-wide assets:
Common Cascading Style Sheet - This is used to provide a generic application-wide look-and-feel and provides separation of content and presentation.
A common Application Skin - This is in the form of an XSL and provides a template for the overall application. The skin will provide placeholders for menus, logos, headers, footers, etc. The actual content will override this template as necessary for each page, but the parts that are not overridden will remain the same.
The CSS and Skin require definition only once and provide an overall look-and-feel and layout for the web application. The main purpose of WebMaker however is to enable the creation of XML forms. This is achieved by using a component of WebMaker known as FormMaker. FormMaker is part of XStudio and provides a web-based IDE for creating XML forms. FormMaker can be used to produce the following elements of a web application:
Page-specific elements
XML forms encapsulated in XSL. These XSLs are transformed to XHTML during execution to enable wide browser coverage without downloads.
Page-specific CSSs to override or complement the application-wide CSS if necessary.
Javascripts. A common set of javascript files are present for the application, which contain generic scripting for client-side validation. A large part of this scripting is generic and activated based on the schema information that is present for each form. Additional server-side logic can be included to compliment the client-side scripting.
XML Data Mapping information. Similar to the scripting, this information is distributed between the client and the server and enables the data to be mapped bi-directionally between the browser and the underlying XML documents. Once defined, this element is automated and very transparent to the designer.