Engineering Corner: Agile Business Suite Client Framework

Introduction

The evolution of user interfaces (UIs) has reached a point where end users expect a considerable amount from their client applications. In order for client application developers to react to these requirements, they need an environment that integrates with the rich toolsets that are available now, and will be in the future, so they can satisfy the expectations of an increasingly demanding customer base.

Since many Agile Business Suite users are feeling the pressure brought upon by this need, we designed the Agile Business Suite Client Framework to help them develop state-of-the-art UIs using their technology of choice, while retaining an optimum level of integration with the AB Suite application itself. The Client Framework allows you to choose the UI development environment and create a look and feel for your client applications that’s right for your needs. You’ll get total control over the user experience and ultimately deliver more satisfying results to your end users.

The underlying principle of the Client Framework is to establish a separation of concerns when it comes to multi-tier application development. Increasingly, UI development is undertaken by a specialized design team that focuses on the client application requirements and interacts with a team of back-end system developers, so that the appropriate data is available and displayed in the required format. In this scenario, the AB Suite application implements the business logic and data interface definitions to address the UI requirements. This approach eliminates the need for AB Suite developers to be responsible for UI development. Instead, that part of the process will be left to an external UI development team. As a result, the AB Suite Client Framework enables a separation of concerns when developing large-scale enterprise applications that demand rich user experiences.

System Modeler Integration

With AB Suite 5.0, we are adding the new Client Framework application type, which exposes the Client Framework capabilities for AB Suite on Microsoft® Windows® applications.

When you create a new Client Framework application, you will notice a number of differences from the traditional AB Suite application. Most notable is the absence of the AB Suite Graphical Forms Painter that was used to design the UI for an Ispec. For a Client Framework application, the UI design is now done in the client technology of choice, such as Windows Presentation Foundation (WPF) Designer for Microsoft Visual Studio® or Blend for XAML based applications, and Visual Studio Tools for Microsoft Model-View-Controller (MVC) Razor views.

You can add a Presentation Interface node, which defines the attributes to be exchanged between the runtime system and the client application, to an Ispec. Essentially, this defines the data contract between the UI developer and the AB Suite model designer.

The attributes in the Presentation Interface are used to generate the Data Model for an Ispec.

The generated Data Model includes data annotations based on the properties of these attributes, which help describe the Data Model definition to UI developers or external tools that can interpret them.

An AB Suite folder now contains new properties specific to the Client Framework. It allows you to choose the client technology you plan to work with, such as WPF, Windows Communication Foundation (WCF), Custom .NET, etc., and groups a collection of Ispecs for use with that technology. Different artifacts will be generated based on the specified client technology.

When a client technology is selected, and Ispecs are added to that folder, System Modeler will automatically execute a background task to generate the required technology projects in the same solution as the AB Suite application.

As more Ispecs are added, modified, or deleted, System Modeler will keep the generated projects in sync with the technology folder contents and the Presentation Interface definitions.

Having everything in one solution provides an integrated approach to developing a Client Framework application, including the UI components. In this way, they can be placed under Source Control, backed up, and restored as a single entity.

When developing client applications, you may find many instances where you need to display a “list of items,” either in a grid, a list view, or a listbox. We’ve acknowledged this requirement with the Client Framework and introduced a new Framework item in AB Suite called GLB.List. It allows you to create a template class that can be used as an item in a list. You can then add items to the list in LDL+ logic and use the new GLB.ClientManager Framework class to send it as either a static or dynamic list. This new item enhances and simplifies the way you currently handle this frequently used aspect of client development.

In addition, CopyIspecs will have their CopyFrom fields generated as a collection that can be treated as a list, making it easy to bind these items to a DataGrid, for example.

The New Access Layer API

At the core of the Client Framework is the ubiquitous Data Model concept. Once we have Ispecs exposed as .NET Data Models, they can be utilized effortlessly in many different development environments. For instance, they can be:

• Serialized to JSON or XML
• Data-bound to XAML Views
• Exposed in WCF contracts
• Instantiated and populated with user data
• Exchanged in MVC Views using MVC Model binding
• Transformed to JSON in Ajax calls using Web API technology

In order to take advantage of the Data Model concept, we introduced a new Access Layer API to the AB Suite Runtime system that manages the transfer of data using Data Models. Delivering data from a browser can be as easy as accepting a Data Model from an MVC request and transmitting it to the runtime system using the Access Layer API Transmit() method. There is nothing more to be done, because the Access Layer API deals in the Data Models generated by System Modeler.

As the name suggests, the Access Layer API is an API to the AB Suite Runtime system. It has been designed with the .NET developer in mind, and exposes classes, interfaces, methods, properties, and events in a style common to a .NET based interface. Intellisense is provided with the Access Layer API in Visual Studio and a compiled help file is also available for use as an online reference.

There are many things to discover about the Access Layer API. Here are some additional points that may be of interest:

• Some key methods are provided in async flavors to allow the client application thread to continue processing while waiting for a reply to the async method call.
• Data is exchanged through Data Model definitions. AB Suite attribute types, such as Date, Boolean, Numeric, etc., are converted to their equivalent .NET types. The client application does not need to perform any conversions because it is already done by the Access Layer API.
• The Access Layer API connects directly to the Runtime system’s COM interface. This architecture eliminates any overhead or proprietary protocols that would otherwise be imposed by intermediate services like the Remote Access Server.

The WPF Client

Windows Presentation Foundation is currently Microsoft’s primary desktop development environment for Windows. With that in mind, AB Suite delivers a fully featured client application based on WPF/XAML technology called the WPF Client. When you create a WPF technology folder, it will automatically generate projects containing Data Models, Data View Models, Data Sources, and empty Views to kick-start desktop development.

You can design your Views in Visual Studio using the WPF Designer, or Microsoft Blend if you prefer that environment. With a relatively small amount of work, you can have a desktop application up and running simply by designing the Views and establishing the bindings between the Data View Model and the controls on the View. The rest of the infrastructure (e.g., to perform transactions, run reports, or open/close sessions) is already in place. Example Views from a redesigned AB Suite Sample system are shown below.

While the WPF Client infrastructure makes it easy to develop client applications like the screens shown, it is also extensible enough to allow you to create something that looks a bit different than the standard WPF Client. You can create a new WPF Client project from the template that we provide and add your own customizations to the WPF Client Container application itself.

MVC Scaffolding

Microsoft MVC and Web API technologies for Internet application development have become very popular in the industry. And, there are positive signs that these technologies will continue to evolve and be part of Microsoft’s future direction. To help you integrate your AB Suite applications with these technologies, the Client Framework includes the MVC Scaffolder, a Visual Studio extension that is available for use with MVC projects. The AB Suite MVC Scaffolder is specific to AB Suite applications and will generate Views, Controllers, and other infrastructure files in an MVC project, giving you a starting point for developing MVC applications.

Some example views for the AB Suite Sample system running as an MVC application are shown below. The UI shown was designed as a set of HTML pages with CSS and JavaScript, by a team that specializes in UI design. These designs were then integrated with the MVC application that was scaffolded using the AB Suite MVC Scaffolder.

We can also apply responsive design principles using the Bootstrap framework to allow a client application to adjust its layout based on different form factors. Notice also how the menu navigation automatically changes to suit the smaller device type.

The MVC Scaffolder can also expose a Web API interface to your AB Suite application. This allows Internet-based applications to perform RESTful service calls to your system over HTTP. And, it’s especially useful for creating mobile or single-page applications that make asynchronous Ajax requests to a web site. Information can be retrieved and inserted into the page without the overhead of a full page refresh. A published Web API interface is also ideal when dealing with heterogenous environments where a variety of different client applications need to make calls into your system. If you are interested in exploring the benefits the Internet of Things can provide your business, including a Web API interface is a vital ingredient.

WCF Gateway

The Client Framework integrates a WCF Gateway with the AB Suite for Windows Runtime. This capability is for client applications that are not able to interoperate with direct COM/DCOM interfaces, including Microsoft Silverlight® or Windows Store apps. The WCF Gateway exposes a service that exchanges the generated Data Models. On the client side, the Remote Access Layer components implement the same Access Layer interface to communicate with the Gateway instead of COM/DCOM. This allows the client application developer to work against the same interface regardless of which connectivity option is being used.

For service-based operations, the WCF Gateway can also host a custom service library generated by the “WCF Library” option in the client technology folder selections. This option creates a WCF Library project that can be configured and hosted by the WCF Gateway service, and exposes the Data Models generated for the Ispecs in the client technology folder.

In the Runtime environment, the WCF Gateway runs as a service. But in the AB Suite development environment, a Gateway Server Console is made available for testing purposes.

The WCF gateway also exposes a File Repository Service that allows client applications to download files and images, for example, as required during the course of their processing.

Migration to the Client Framework

While the Client Framework is ideal for new client application development, we understand that you likely have made investments in existing client technologies with current AB Suite applications. Fortunately, we have a mechanism in place that allows you to convert existing AB Suite models to Client Framework models. You simply create a new Client Framework application from an existing model and let the conversion process take effect. You’ll be left with a new Client Framework model to use for the rest of your development project.

In the case of WPF Client technology, the conversion process will also migrate the existing forms across to WPF/XAML based views. The resulting forms can be used immediately in the WPF Client application. However, there are some minor adjustments that will need to be made, mainly in the area of CopyFrom items, which are now sent as a collection and bound to a DataGrid, instead of individual fields.

For MVC Clients, the AB Suite MVC Scaffolder can also make use of the metadata that the conversion process generates. In this case, the scaffolding template will create a set of controls that were previously defined in the AB Suite forms. If you had a button for an attribute, it will create a button control, and so on. However, it does leave the styling and layout for you to adapt using CSS styling and layout systems, like Bootstrap. Moving to the Client Framework will also require you to decide on the tools and methodologies you will use for the ongoing development of your client applications. In this case, there will be a certain amount of UI redesign to be done after the scaffolding is complete.

Summary

In summary, the Client Framework paves the way for a new era in client application development with AB Suite. It lifts the constraints of the existing paradigm and promotes new ways of approaching both front- and back-end development through a separation of concerns. The UI team and database/transaction processing team can each do what they do best, resulting in the best possible outcome. For customers that have the skills to develop state-of-the-art client applications – or wish to outsource that work – the Client Framework delivers standard interfaces based on the .NET Framework developers already understand and know how to use. We hope that as our customers start using the Client Framework, it will foster an ecosystem of AB Suite developers, where ideas can be shared and we can take the next steps forward together.