How many times have you used some software or service and wished that it would have that one additional feature you need to do your work? Or you wished it could be reorganized to fit into your workflow better or that it could work with data from another location?
These are not uncommon scenarios, and these issues are critical in the enterprise, because data and process are what make organizations unique and efficient. Thankfully Oracle and other software and service vendors have recognized the need for their users to customize, configure, and extend their products to meet the unique requirements of the enterprise.
Oracle Visual Builder automatically imports and registers Oracle Fusion Applications Services (FA Services) such as Oracle Sales Cloud, Oracle Enterprise Resource Planning Cloud (Oracle ERP Cloud), and Oracle Human Capital Management Cloud (Oracle HCM Cloud) and the Business Object REST definition within the Oracle Visual Builder Service Catalog. Within that service catalog, you can pick a service and browse its set of available REST endpoints, as shown in Figure 1.
Figure 1. FA Services are part of the Oracle Visual Builder Service Catalog.
In the rest of this article, we are going to build a mobile app with Oracle Visual Builder that extends Oracle sales and service application. Our app will be a PWA that works against the Accounts business object to enable interaction with accounts on a mobile device.
First, you need to ensure that an FA service is registered within your Oracle Visual Builder instance. If Oracle Visual Builder Cloud Service is provisioned within the same tenancy as an FA service, that FA service will be automatically registered as a tenant-level setting within it. If the service is not within the same tenancy, you need to add the base URL of the FA service and credentials within the Oracle Visual Builder tenant settings or on a per-application basis. The tenant settings are accessible with administrator rights and show up in the top-level (to the right) hamburger menu—if you have the administrator role—as shown in Figure 2.
Figure 2. Tenant-level settings for Oracle Visual Builder are accessible to the administrator role.
If the FA Services are prepopulated because they are provisioned within the same tenancy, you will access those services with your Oracle Cloud account using single sign-on (SSO), as will the end users of your app extension. This access also assumes you have set up identity federation to your FA Services correctly. I recommend this document for information on the setup required to federate from Oracle Identity Cloud Service to FA Services as the identity provider.
Otherwise, you can point to any instance of an FA service and use other authentication options, such as basic authentication or OAuth. Figure 3 shows the application-level authentication settings. Oracle Cloud Account is your SSO option.
Figure 3. Override (or set) FA Services settings at the application level.
With your FA Services set up for access from Oracle Visual Builder, you can connect to a set of business objects within a service by importing REST endpoint definitions from FA Services within Oracle Visual Builder. FA Services expose their business objects as a set of REST endpoints using a descriptive metadata file called FA Describe. FA Describe is similar to other REST API formats, such as Swagger, but it is very verbose and full-featured. You can access the FA Describe file using the following URL format from the base URL, as shown in Figure 4.
Figure 4. FA Services provide a verbose FA Describe metadata file listing REST services.
As mentioned previously, by registering an FA Services base URL (automatically or manually) with Oracle Visual Builder, the FA Describe metadata gets exposed as a cataloged service called FA Services. Once the REST endpoints have been imported, you can reference them within the design time of your application. When building an application, the JSON returned from those REST requests will be bound to one or more UI controls to interact with that data.
Let’s extend Oracle SaaS and build a custom application named “Accounts on the Go” that accesses the accounts within Oracle Sales Cloud. First, you want to import those REST endpoints related to the accounts. Within Oracle Visual Builder, you do this with a service connection. In the Service Connection editor, add a new service through Select a Catalog, and then access the FA Services Catalog. Finally, within the FA Services Catalog, select Sales and Service.
When you select a specific service, you will see the list of available endpoints grouped by the name of the business object, as shown in Figure 5. Look for Accounts and expand it. You can select that top-level group node, which will pull in all endpoints related to accounts, or you can select individual endpoints. Often, endpoints rely on other endpoints as links, so be sure to consult the service documentation before selecting individual endpoints. Alternatively, you can select all endpoints, which will pull in those “dependencies,” but that could make your app larger or have a negative impact on app performance. After selecting the endpoints, you can reference them during UI construction and bind UI components to specific endpoints.
Figure 5. REST endpoints are shown for operations on the Accounts business object in Oracle Sales Cloud.
Now that you’ve registered the REST endpoints with Oracle Visual Builder, you’re ready to build the user interface. For this example, you will build a mobile-designed PWA. You will use a List View as the primary interface.
In Oracle Visual Builder, to create a new mobile app, enter
AccountsOnTheGo in the Application Name filed and select None for the Navigation Style. Then select List for the Page Template, as shown in Figure 6.
Figure 6. Select navigation and layout options for your mobile application.
When the page loads in the designer, ensure the List View component is selected. Now add (bind) data using an Oracle Visual Builder Quick Start. Available Quick Starts are shown in the far right tab on the Property Inspector, as shown in Figure 7: Add Data, Add Create Page, Add Edit Page, Add Detail Page, and Add Delete Action.
Figure 7. Each UI component has Quick Starts.
For each of the Quick Starts, select the service you want to use, as defined by your REST import operation. Next, select which fields you want to include on that page. Finally, set up query parameters as well as filter criteria. For example, you can set up a fetch for more rows on scroll as opposed to retrieving all of the data elements with the initial call.
After you have completed your mobile application, you can choose to deploy it through an app store by building native iOS App Store Packages (IPAs) or Android Packages (APKs), or you can deploy the app as a PWA. If you deploy the app as a PWA, you can provide your end users with a URL link they can click or a QR code they can scan to load the application onto their devices. Your end users then have the option to “install” the PWA by adding it to their home screens and the option to launch the application from the home screen with no browser chrome. Additionally, with a PWA, the Edit and Delete options are implemented as part of a swipe gesture, which delivers a native look-and-feel experience. Figure 8 demonstrates the user experience on the device when swiping a row in the List View.
Figure 8. You can provide a native mobile experience with a PWA.
With Oracle Visual Builder, it is simple to build extensions to your SaaS applications. Oracle Fusion Applications, such as Oracle Sales and Service Cloud, Oracle HCM Cloud, and Oracle ERP Cloud, register their endpoints in the Oracle Visual Builder catalog, so you can quickly access the data within them. Now you have the power to build with ease any type of custom user experience for mobile, desktop, and tablet Oracle SaaS users.
Illustration: Wes Rowell