Benefiting from Kinetic Bundles

transcript

Ben ChristensonKinetic Data

About Me

Ben Christenson Employee at Kinetic Data for 12 years

and a member of the Product Development team for the past 6 years.

Co-developer of the Kinetic Bundles strategy and implementation.

What is a Kinetic Bundle?

Evolution of our theming strategy

How did Bundles come to be?

Evolution of themes Way to apply branding to Kinetic forms

Required to Simplify initial web presence implementation

Share work

Implement more complex interfaces

Disclaimer

Kinetic Data focuses on the most common tasks Implementing a theme typically occurs once

Developing or configuring a Bundle is simple, but… Requires familiarity with HTML/CSS/Javascript

May require familiarity with Java

Request Bundle - Klean

The first available Kinetic Bundle is named “Klean” Bare-bones sample

Heavily documented

Starting point for bottom-up development

NOT a drop in solution

Being used by professional services

Klean: Base Package

The base package is responsible for rendering Kinetic form content

Kinetic Request Primer

Kinetic Request is a Java Web Application Accessed from a Web Browser

Kinetic Request forms apply a Theme Specify a JSP to use for rendering the HTML

Are styled by CSS

Leverage Javascript for dynamic interaction

Deploying a Bundle

Download the bundle Copy the contents Configure the display page Open the form

What is a Bundle, technically?

Self contained directory Stored within the /kinetic/themes directory

Includes four component subdirectories The common root package. The core root package. A collection of helpful libraries. A collection of additional packages.

Key Concept: Packages

Klean: Catalog Package

The catalog package is responsible for rendering catalog content

What is a Package, technically?

Root Packages Common Core

Packages Subdirectory Base Package (Display and Review logic) Service Catalog or Service Portal Fulfillment Console …

What comprises a package?

Packages are organized into four types of files Configuration

Framework

Interface

Resources

Package Organization: Config

Files in the config directory

Modify configurable behavior

Set variables used throughout the bundle

Package Organization: Framework

Files in the framework directory implement the technical internals of the package.

Helpers IncludesModels

Package Organization: Framework/Helpers

Used to wrap common functionality

Package Organization: Framework/Includes

Load all of the framework files

Package Organization: Framework/Models

Abstracted interface to backend data

Package Organization: Interface

Files in the interface directory Specify the content that is displayed

Typically render HTML

May render JSON or XML

Includes the callbacks and fragments subdirectories

Package Organization: Interface

Page JSPs (display.jsp, review.jsp) Includes common interface fragments

Includes Kinetic form content

Portal Page JSPs (catalog.jsp, login.jsp, etc) Includes common interface fragments

Typically has no Kinetic form content

Package Organization: Interface/Callbacks

Specify content for asynchronous (AJAX) request Search results

User details

Submission details

Package Organization: Interface/Fragments

Reusable fragments referenced from interface files Template page content (headers/footers)

Package Organization: Resources

Files in the resources directory are referenced by the files in the interface directory. CSS

Images

Javascript

What comprises a bundle?

Bundles are organized into four directories The common root package. The core root package. A collection of helpful libraries. A collection of additional packages.

Bundle Organization: The Common Package

Origin – Need to share content Improves reusability and consistency Reduced duplication

Resources (CSS, Images, Javascript)

Similar UI

Klean: Common Package

Bundle Organization: The Core Package

Contains interface fragments required to make Request work

Core Models Catalog, Category, Submission, Template Task, TaskMessage

Wrappers bundle context customerRequest

Klean: Core Package

Documentation

Bundle Organization: Libraries

Re-usable solutions Often highly technical or difficult to implement Examples:

Advanced Search

Server-side paginated tables

Libraries: Advanced Search

Example of the power of callbacks

Bundle Packages

Increase portability of consoles and interfaces Typically Include

A base package for rendering service items

A catalog package for rendering the service portal

May Include A submissions package for rendering submitted items

Klean Package: Submissions

Provide users with access to their submissions

Additional Packages

Distributed on Kinetic Community Can be dropped in to any bundle

Minor modifications to apply styles and branding

Activity Package

Provide users with access to… everything

Assignment Package

Example of the power of models

Integration Packages

my-eService

Bundle Benefits: Organization

Organizational consistency Easier to read and write

Easier re-use

Self-contained Exist side by side with existing themes

Bundle Benefits: Portability

Everything is a relative reference Easier replication of packages or entire bundles

Zero effort migrations between Dev/QA/Prod

Packages and libraries are self contained Easier to share

Bundle Benefits: Callbacks

More flexible than Simple Data Requests Can make multiple data queries

Can build complicated relationships

Can implement complicated data translations

Bundle Benefits: Models

Simplify code Abstract backend interaction

Focus on the UI

Changing data backend

Provide a reasonable approach for full CRUD Synchronous processing

Bundle Benefits: Performance

Fewer asynchronous requests Don’t see visible delay between page loading and data populating

Server side pagination Leveraging callbacks and Java

Model association loading Load all records in one query

Conclusion

Questions?

Personal Contact Information: Ben Christenson ben.christenson@kineticdata.com 651.556.0937

Benefiting from Kinetic Bundles

Documents