The Kendo UI Designer allows you to visually design, build, and preview OpenEdge web apps with a responsive UI based on Kendo UI, Bootstrap, and AngularJS and with access to OpenEdge Data Object Services. These are one-page apps that you design with the app and data definition stored in JSON meta-data that is separate from the Kendo UI implementation.
This meta-data is then used by the integrated Kendo UI Generator to generate the HTML5/CSS and JavaScript files that you build for an app. The app generation also allows you to immediately preview the app in a browser using live data. You can then eventually deploy the app to separate web servers, including OpenEdge application servers, for further development testing and production.
You design a web app from inputs that include a set of Kendo UI Builder templates from which you can create functional views within one or more app modules. Each module can contain one or more user-created views, and each view can be bound to one or more data source tables that you select, depending on the view. You select each data source from a data provider that you define for one or more OpenEdge Data Object Services. You can have multiple data providers defined for an app, and depending on the view, you can select one or more of these data providers from which to then bind data sources to that view. Some user-created views bind to only one data source at a time, while others allow binding to multiple data sources.
Modules and their views, data providers and their data sources, can all be configured with corresponding properties. These property settings then help to define the meta-data for your app, which is saved separately for each module and data provider that you define.
Finally, you can customize each view with code extensions for both view event handlers and custom sections that are available in the layout of every view. There are also additional extension points available for both basic and more advanced app customization.
The following topics further describe these components of an OpenEdge web app and how you can use them in the Kendo UI Designer to design and build the app. For more information on options for using the individual wizards and dialog boxes that are provided to complete this work in the Designer, see Kendo UI Builder by Progress: Using the Kendo UI Designer. For more information on the extension points available for app customization, see Extension Points and Source Code Customization in this document.
App layout and components