Working...
Thursday, May 2, 2024
VBCS - work with events and events listeners
- An event occurs when something happens in your application.
- Some examples are when a page loads (lifecycle event), a button is clicked (component event), and when a variable's value changes (variable event).
- An event's type depends on how it is triggered; for example, a button or a menu would trigger a component event
Type of events:
Component events:
- An event associated with a UI component in a page, including those in dynamic components.
- It’s possible to choose which event the component triggers, but available events will depend on the component. For example, an event like
ojAction
is available to a button but not to an input text field.
Variable events:
- An event specific to a variable that occurs when the value stored in the variable changes.
- The only available variable event is
onValueChanged
.
Custom events:
- A user-defined event that can only be triggered by the Fire Event action (
fireCustomEventAction
) in an action chain. - You use custom events to trigger an action chain from another action chain or JS function.
Lifecycle events:
Predefined events that are automatically triggered during a page’s lifecycle:
vbBeforeEnter
is triggered before navigating to a page.vbEnter
is triggered when all flow or page variables have been initialized.vbBeforeExit
is triggered before leaving a page.The
vbBeforeExit
event optionally allows navigation to be canceled (say, when a page has unsaved changes) by returning an object with the propertycancelled
set totrue
. When using the browser (back or forward button), the event's payload is an object containing default parameter values.vbExit
is triggered before leaving a flow or page.vbAfterNavigate
is triggered when navigation to the page is complete.
You can associate action chains with these events to augment a page or flow's default lifecycle. For example, if you want to initialize some component variables when a page opens, you can create an event listener in your artifact that listens for the vbEnter
event, then set the event listener to trigger an action chain that assigns values to the component's variables.
Reference:
Sunday, April 28, 2024
VBCS - provisioning visual builder instance
There is two ways we can provision visual builder istance.
One: create an OIC integration instance and enable visual builder
Two: subscribe visual builder instance without having oic integration instance.
Here we will see how to do with the integration instance:
Login to OCI instance >> navigator >> developer services >> integration under application integration >> choose component >> create integration instance >>open the created instance and enable visual builder and >> click service console
Saturday, April 27, 2024
VBCS - constituents of a web application
Here, we will discuss different parts of a web app.following are the parts:
main:
It has the main flow or node and a main-start default page.
Fragments:
It is responsible to create reusable code, like portion of a web page - shell-footer, shell-header. We can use the fragments in all the pages.
Resources:
Under resources, we can see actions, components, we can write our own CSS, can import out own images, javascript files, strings(localizing and generalizing )
Root Pages
Root pages is a shell page , responsible to create skalaton of a page. Whatever we create in a shell, it will be showing across all the pages. Like header and footer of the pages. By default the shell page settings is set to main flow that means, if the web app is live, it will start with the main flow. We can change the default flow from main to any other flow if required. Similarly from main flow >> setttings , we can change the default page main-start to any other page.
VBCS - important parts or tools under Navigator
The vertical toolbar is the navigator. It has following parts:
Web applications:
We can create multiple web apps within our visual application. Each web app is independent, but they can all use the data sources defined in the visual application.
Services:
With the help of service connections, connect to REST APIS, to any back end systems like database ORDS system, fusion applications etc which has exposed as a rest. If we need to connect a soap connection. Then better to use oic integration to connect soap service, then from vbcs servics, we can the rest integration service as servicr catalog.
- A business object is just a resource for example, en employee or address. It has fields to hold the data for your application. A business object is like database table. In fact, business objects are stored in a database.
- The web application accessess the business objects through their rest endpoints.
Friday, April 26, 2024
VBCS - access and secure business objects
1. Role based security control:
- By default, the business objects in your application are accessible to all users that can access the application.
- To secure the data stored in objects, you can use user roles to restrict a user’s access to view, create, update, and delete operations by configuring role-based access for each operation. Users can only perform the operations and interact with the business objects associated with the role that the user has been assigned.
- To allow anonymous access to the data in a business object, for each operation you must explicitly set the permissions granted to the Anonymous User authentication role.
To enable role-based security for a business object:
Select the business object you want to secure >> Open the Security tab of the business object.
- Click the Role-based security icon to enable security for the object.When you enable role-based security for a business object, you see a matrix of the existing user roles and the business operations that can be performed.
- By default, when you enable security, all existing user roles are permitted to perform all operations. If you create a new user role, permissions to perform operations are disabled for the new role and must be enabled manually.
- Select the operations that can be performed by each authentication and user role. You can enable or disable permission for each operation.
When configuring security, you can allow external clients to access the business objects in your application through their REST endpoints. For example, you might want an external service like Process Automation to update a business object after a process is complete, say change a status field from "requested" to "approved".
To do this, you need to retrieve the API for the catalog of endpoints exposed by your application's business objects, found in the Catalog API panel in the Business Objects tab of your application's Settings editor:
- Open the Business Objects tab in the visual application’s Settings editor.
- Under Security, select an authentication option:
- Allow anonymous access to business objects describe end point
- Enable basic authentication for business object REST APIs
Wednesday, April 24, 2024
VBCS - Understand actions and action chains
- An action chain is made up of one or more individual actions, each of which represents a single asynchronous unit of work. Action chains are triggered by events.
- An action chain, like a variable, has a scope:
- it can be defined at the application level : You can call an application-scoped action chain from any page.
- the page level. You can call a page-scoped action chain only from the page on which it is defined.
- To create an action chain, you can define your own actions and can also use predefined actions. Actions within a particular chain run serially, and multiple action chains can run concurrently. Action chains simplify the coordination of asynchronous activities.
- A single event may simultaneously trigger multiple action chains. For example, the page enter event may trigger multiple data fetch action chains simultaneously.
- An action is a specific function that performs a task. In JavaScript terms, an action is a Promise factory. An action can exist only within an action chain, not independently.
- An example of an action chain is one that makes a REST call (first action), then takes the result of that and stores that in a variable (second action).
- Action chains have a well-defined context and contract: an action chain orchestrates its underlying actions, coordinating state flow and the execution path. The action chain can define input parameters and local variables that are only available in that context.
- Visual builder comes with a set of builtin or predefined actions for an action chain used for example, navigation or assigning variable values, we can use if and switch actions that take an expression and offer multiple different chain continuations depending on the result
onValueChange
(for a variable), or vbEnter
. An event may include a payload, which can then be used within the action chain. A payload may be passed into an action chain through the input parameters. The Visual Builder user interface can help you create action chains automatically (with appropriate input parameters) based on a particular event.VBCS - Understand variables
- A variable is the basic buildig block for managing client state. It is of specific type and exists in a specific scope.
- A variable type can be primitive(string, boolean, number, etc), a structured(an array or object), dynamic type(any) or a builtin type(service data provider or array data provider).
- It stores intermidiate state on the client between the visual builder user interface and the rest services. Components are principally bound to these variables and the behavior of the variables is governed by actions.
- Intial value of a variable is determined using the defaultValue property set on the variable.
- When a variable value changes, a variable emits an event, this event may trigger an action chain.
- Constants are a type of variable of the constants namespace and are used to store values tgat do not need to change over time such as company name or measurement conversion value.
- We can use a variable to pass a parameter between the pages. We can mark a page variable as an input, specifying how it becomes part of the contract in order to navigate to that page.
Monday, April 22, 2024
VBCS - typical visual application workflow
- A visual application is a collection of resources that you use to develop web (and mobile) apps.
- It includes metadata in JSON files that describe data sources (business objects and services) as well as the HTML and JavaScript files of your web (and mobile) apps.
- To develop your application, you define its data sources and design an interface for users to work with.
- Visual Builder does not impose any specific order for building your application. How you proceed is personal preference and determined by the way you planned your application. If you already know the data sources that you will use, or the structure of objects that you have, you might want to start by defining the service connections and business objects. However you decide to proceed, you always start with a visual application.
High-level description of the tasks that you typically perform when building your application:
- Create a new visual application
- Create servicr connections
- Create business objects
- Add web (and mobile) apps
- Develop the web (and mobile ) apps
- Secure the application
- Stage and test the application
- Import real data and check schema
- Publish the application
Sunday, April 21, 2024
VBCS - task18 - publish the application
Usecase: here, we will see how to publish your application to live when we have successfully tested the staged application. The live application will be visible to users with proper credentials.
Detailed steps:
Cilck menu >> select publish >> Include data from stage >> publish
VBCS - task17 - stage the application and import data into the application
Stage the application:
Click the Menu in the header >> select stage >>select business object data option and click stage >> click Menu again >> select Open stage application
Import data into your application:
If we need to add more records to our data in the staging database, we follow the below steps:
Have a zip file containing csv files for each business object >> click the business object under the navigator >> click Menu ...>> data Manager >> select staging from the drop down list in the upper right corner >> click import from file >> select zip file and import. >> open the any object like departments >> data tab >> select staging , we can see the imported data.
Note: visual builder provides different databases for the development, staging and live phases of an application. We can use empty database for the staging or live phase, we can transfer data from one to another or we xan import specific data for each.
VBCS - task16 - Enable the web app as a PWA
Usecase: Here we will show how to enable the web app as a PWA.
- Once all the web app development work done, as a final step before we stage the app, we can enable it to rub as a Provressive Web App or PWA.
- PWAs are designed to be capable, reliable, and provide a platform specific look and feel.
- When we enable a web app as a PWA, it can be installed ditectly from a browser on a user's device, including Android and iOS mobile devices.
Navigation and steps:
Web apps >> click hrwebapp node >> settings >> PWA >> toggle Enable Progressive web app(PWA).>> review the Manifest setting(app name, short name, theme color) >> under resources >> click create next to the offline fallback page .
App name: to be displayed when we are prompted to install the app.
Short name: The short name is used on the Home screen, launcher, and other places where space is limited.
Offline Fallback page: To add page that is displayed when the user pefforms an action in the PWA that requires a connection , but the device is offline.
Saturday, April 20, 2024
VBCS - task15 - access data from an external REST service using service connection - Define by endpoint option
Usecase: we will show how to access data from an external REST service using service connection - Define by endpoint option.
Highlevel steps:
- Create a service connection to an external rest endpoint
- Create a type and variable from the rest endpoint
- Add fields to the employees edit page to display country data
- Bind the created country avatar, input fields to the created country type variables.
- Assign data to variables
- Test the employee's country details
Implementation steps:
Step1: create a service connection to an external rest endpoint
Web apps >> Services >> click + service connection >> wizard will show 3 options >> select define by endpoint >> select method, provide URL and select action >> create backend
Here, we have mentioned below details:
Method: get
URL: https://restcountries.com/v2/alpha/{code}
action: Get one
Step4:Bind the created country avatar, input text fields to the countryType variable
Go to the page designer >> select avatar >> click data tab >> src field >> select the created country type variable and flag >> sameway for region and timezone and src >> add the variables
Step5: assign data to the variable
Select country field data >> add on value event that triggers an action chain >>>> from where we use rest call action and select the endpoint service >> assign input parameter >> expand employee under page and map country to code. >> drag and drop assign variable >> select countrytypevar >> which maps to callrest response body
Featured Post
11g to 12c OSB projects migration points
1. Export 11g OSB code and import in 12c Jdeveloper. Steps to import OSB project in Jdeveloper: File⇾Import⇾Service Bus Resources⇾ Se...
-
Please find the following links for OIC hands on and relevant information: Oracle Integration Cloud Introduction | Benefits | Services offer...
-
Credential Store Framework (CSF) is used in OWSM to manage the secure credentials. CSF provides a way to store, retrieve, and delete cred...
-
What is Throttling: Throttling is termed as "regulate the flow". Oracle Service Bus has throttling feature and by using that f...