Theme Cosmos - Using the Pega API (DX API)

Theme Cosmos - Using the Pega API (DX API)

Description	Guidelines for developing an application interface
Version as of	8.5
Application	Pega Platform
Capability/Industry Area	User Experience

Pega DX API is a set of REST services that allow Pega to communicate with a consumer facing front end. The difference between traditional API and DX API, is that DX API returns case or assignment UX information in the API response – including information about UI elements, layout, actions, and styling - which can be used to build dynamic, future-proof front ends using the customer's front-end technology of choice.

The following use cases can be handled using DX API:

• Viewing a list of case types and creating a case.
• Viewing a list of assignments, choosing an assignment, and submitting an action.
• Building a custom dashboard.

To build a consumer facing UI using Pega DX API, perform the steps listed below.

Enable the Pega DX API

To enable Pega DX API, see Getting started with Pega API for Pega Platform.

Review the request and response elements of Pega DX API

Review the UX information (page, harness, view, section, layout, and controls) in the DX API response on the Pega API landing page. You can navigate to the Pega API landing page from the Resources menu icon in Dev Studio, or from the Channels menu in App Studio to visualize and interact with the API’s resources, such as endpoints, sample responses and request elements.

For more information, see The digital experience API request and response elements and Accessing and testing DX API.

Build a UI with your chosen front-end technology

By using the UX information in the DX API response, customers can build a UI with their chosen front-end technology. Pega has created starter packs for Angular, Vue, React, iOS, etc. Customers can get started using those starter packs for building consumer facing UI. To build the UI using various starter kits from the Pega marketplace, see Creating custom screens with the digital experience APIs.

Starter packs on Pega Marketplace:

• React Starter Pack

• Angular Starter Pack

• Vue Starter Pack

• Pega Process Extender for Salesforce Lightning

• DX API Starter Kit for Pega Mobile SDK (iOS)

References

• Pega Digital Experience (DX) API

• Building custom front-end experiences with Pega's Digital Experience (DX) API

• Utilising DX API and Pega’s Mobile SDK for Consumer Facing Apps

A way of structuring your technology and systems to support customer and business outcomes, which is part of the Center-out approach to business architecture.

A business solution that automates workflows in your organization. Multiple, unrelated applications can be hosted in the same system. You create an application by running the New Application wizard.

(Deprecated) A configuration of panels (areas) in a harness that support a composite portal. Existing panel sets continue to function. As a best practice, upgrade panel sets to screen layouts.

A task that a user completes so that the business process can advance towards the final resolution. You can add assignments to the business process to collect information or seek approvals from users with different roles or levels of expertise. For example, in an online credit card application, a customer needs to fill out the online credit card application form by providing a range of personal and financial details. When the application form is completed, the process advances to the bank employees who can process the request by either approving or rejecting the application.

A work party that typically initiates a case. In many applications, only one customer can be associated with a case.

Actual work that is performed by application users and automations that consists of a sequence of tasks and leads to an intended business goal. An example of a case is a process of hiring a particular job candidate, where an HR worker collects necessary documents, a hiring manager conducts a job interview, and an application sends an automated email with onboarding information after the candidate is approved. To create a case, you first build a template of your business process that is a case type, and then apply the template in multiple cases, for example, to review applications from many candidates.

One of the following UI elements:

- A centralized workspace that displays operational information about your application and key performance indicators, such as the number of assigned items or the average time to resolve a case. A dashboard can include charts, reports, worklists, and other widgets.

- A single webpage that shows the current status and ongoing trends of your organization’s behavior. This data helps you to make informed decisions and guides you to specific investigations or outcomes.

A data structure that holds name-value pairs. Pages are stored in the system memory or in the database. Various types of pages are defined in the system, such as data pages that are created when the data is referenced, named and unnamed pages, parameter pages, clipboard pages, and so on. Every unit of information in an application is a pairing of a name and a value, known as a data element. For example, a data element that stores the email address of a customer has the name "email," and the value "john.smith@company.com." Pages store data elements so that the application can use it to process the case.

A container that organizes the content and structure of a page in the user interface. The layout of a harness is defined by a template. For example, you can base a portal harness on a template that divides the portal into three separate areas: a header, a navigation pane, and a large content pane for displaying documents.

The building blocks of your user interface, sections can use design templates for their structure and contain such interactive UI elements as fields, buttons, lists, and so on. A section creates a functional chunk of a user interface, and can be reused throughout your application for improved consistency and efficient development.

For example, your application may need to display user data as a list of ID cards. You can create a section for the contents of a card, and then reuse that section so that the design of every card is consistent.

A single source of information that presents categorized content, such as tabs or tools. You can access information on a landing page with focus on a single category that you want to select. A number of landing pages can be accessed right at the launch of your application. For example, on the Application Quality landing page, you can view the health of your current application and identify improvements to make before you deploy an application.

The low-code development environment of Pega Platform.