API Quick Start Guide

We build APIs for the digital economy.

To keep ahead of customer demand, banks need to compose business capabilities efficiently and easily. That’s why Temenos APIs are as intuitive as they are comprehensive and powerful.

Our APIs come with fully fledged platform-neutral web components. These components are fully flexible and can be embedded in any development framework such as Angular, React or Vue. For ease of use, ​t​​​hey're fully connected to Temenos APIs and can be implemented into UI projects to accelerate development.

Our APIs include sample requests and response data for users/developers of all levels. They're written in Javascript/Typescript for the benefit of developers, and all the sources provided can be customized by the banks. Banks can extend and compose Temenos solutions productively and easily whether using the APIs directly or the web components based on our APIs.


Find out more at Everyone's Temenos APIs.

Go to our Full API Catalog.

Unified User Experience (UUX Component Explorer)

The UUX Component Explorer is a developers playground, used to help developers understand the relationship between the components and the APIs they consume.
It's similar to 
other playground environments such as JSFiddleUUX components allow developers to rapidly build modern web apps.

Web Components

The UUX Components are stand-alone individual web components that perform specific functions used as developers' building blocks for banking applications.

Using Web Components
  • Portable and can be readily used in any framework, including those used to create the Temenos product suite.
  • Develop responsive web applications faster.
  • Easily share business components across different technologies, promoting reuse.
  • Keep up with the latest industry developments and reduce reliance on proprietary technologies.
  • Use widely available skillsets ⁠— it's just HTML, JavaScript and TypeScript.
  • Provide an upgrade path for all Temenos UI/User Agents.
Using UUX Component Explorer
Panels

The UUX Component Explorer has two panels:

  • Component

  • Tool Panel- This panel consists of 4 tabs along the top:

  1. API Monitor
  2. Config
  3. Data
  4. Localisation

image 61

 

Navigation Bar

On the left of the Component Explorer is the navigation bar for choosing which component to explore. After selecting the component, it is loaded into the Component and the Compound panel tabs.

Account List: Lists all accounts populated in the data tab.

Account Summary: Shows all relevant information for a specific account.

Customer List: Lists all customers populated in the data tab.

Customer Summary: Shows all relevant information for a specific customer.

Domestic Payment: Allows user to transfer/pay money to another person/account nationally.

International Payment: Allows user to transfer/pay money to another person/account internationally.

Transaction List: Shows a list of transactions and their details that can be filtered as per users request/requirement.
 

Component

This panel displays the selected UUX component of the data that has been received from the API Response panel.
See Testing for examples.

 

API Monitor

This tab shows the details of the request made from the component to the API, this includes:

  1. Request URL- The URL of the request that is being called.
  2. Request Method- The message type (GET and PUT)
  3. Status- If the request was successful or failed.  
  4. Response- The response data of the initiated component.

image 62

The data is received back in real-time and pushes into the user interface to display to the user in the component panel.
 

Config

The Config displays the configuration details for each component, this includes:

  1. API Domain
  2. API Endpoints – some components can have multiple endpoints.
image 63

 
Data

This tab allows users to look at all the data within the components internal datastore, this includes:

  1. Lookup - Lookup data that has loaded at runtime.

    image 64
     

  2. Capture - Data that is captured by the user as they fill out application forms.
    image-20220706121152-1

     

     

  3. Review - Contains data returned from the server after the initial submission from the user. This could include additional fields, charges, currency conversions etc.
     

  4. Confirmation - Contains data returned from the server after the final submission from the user. This could include transaction references, status messages etc.

 


Localisation

This panel allows users to test different locales and to view/edit the translations provided for the component.
It allows the user to see the following for the different locales:

  • Text direction (LRT or RTL).
  • Number/currency formatting.
  • Date formatting etc.

See Testing for examples.
 

Testing

The sections below demonstrate some of the functionalities and processes of using the UUX Component Explorer.

View a list of accounts

We are going to demonstrate how to use the UUX Component Explorer to generate a component based on the information received from an initiated API in the API Response panel.

Procedure:
  1. On the left-hand side, click Account List. This will populate the component explorer with all the relevant data for this component. 

    image-20220706122021-1
     

  2. In the API Monitor tab, the API data is populated, including the Request URL.

    image-20220706122439-2
     

  3. In addition to this, it also generates a UI in the Component panel.
    The data has been processed and displays it in a clear, user-friendly format.

    image-20220706122514-3

To try other functionalities see our Demo page.

Editing Data

In this section we demonstrate how you can edit the data in the Data panel in the example shown. The API Monitor panel is read only.
To do this, we use the same data for returning a list of accounts.

Procedure:
  1. On the left-hand side, click Account List. This will populate the component explorer with all the relevant data for this component.
     
    image-20220706122021-1
     
  2. You can now proceed with changing some of that data. For this navigate to the Data tab, from here we're going to change the “accountName” and the “currencyCode”.

    image-20220706151606-1
  3. Once you’ve made these changes, click the Apply Changes button to process them.

    image-20220706151851-2
     
  4. Instantly the changes have been implemented and displayed in the Component panel.

    Before:

    image-20220706153226-4

    After:
    image-20220706153011-3

 

Making a payment

In this section we demonstrate how you can make a payment using the Component UI.
To do this, we use the Domestic Payment Component. 

Procedure:
  1. On the left-hand side, click Domestic Payment. This will populate the component explorer with all the relevant data for this component.

     image-20220707103227-2
     
  2. You can proceed to fill in the form, the component has been populated with sufficient data for testing. When you are happy with the inputted data, click Continue
    image-20220707103641-3
     
  3. You are then asked to review the payment, if the details are correct click Submit.
     
    image-20220707104355-6
Troubleshooting

The UUX Component Explorer has an effective function which highlights errors that may appear.
In the below example, we have renamed the “accountName” to “test” and applied the data to the component.

image 53

As result, in the Component panel, you can see the value has changed.
It has defaulted to the field name “accountName” because that is what the component is looking for.


image 54

You can view the error message in the console.

image 55

In addition to the error console, an error message can be seen in the API Monitor.
Such as; 404 - Not Found, 403 - forbidden/permission issue, 500 - internal server error etc.

image-20220706121620-1

 

The UI has continued to function, so the user is able to continue, but may need to raise the error to developers to resolve it.

Next Steps