As you all might know my first book on VB has been released that will help you to learn VB in-depth with a lot of various examples. To give a feel on how the book is written, I’m releasing this blog on Chapter-1 that will help you to take your decision to buy the book. The first chapter is written on What, Why, and How (WWH) of Visual Builder.

The first chapter of every book is one of the most important chapters as it mainly focuses on the introduction of the technology covered in the book. So, the first chapter of this book will help you to know more about Visual Builder (VB), why you need to use it, and how to use it.

Click here to buy this book.

Read this article to know about all the chapters.

At a high level, the VB is the cloud offering by Oracle that helps you to build engaging web and mobile applications by dragging and dropping the UI components. VB is a declarative approach for building cross-platform applications.

In this chapter, we will cover the following topics:

  • Introducing VB
  • Reviewing the features and benefits of VB
  • Knowing the tools required to use VB
  • Knowing the technologies used in VB
  • Understanding the VB architecture

After completing this chapter, you will be familiar with Visual Builder, its features, and the benefits of using VB. In this chapter, we have explained what tools are required to start the VB, and what technologies you should know or you should learn. Along with this, we have drawn out the VB architecture, which explains how different VB components work together in order to develop web or mobile applications.

Introducing VB

VB is an Oracle Cloud Platform as a Service (PaaS) offering that enables us to build web and mobile applications declaratively by dragging and dropping a wide variety of built-in User Interface (UI) components. VB helps you to build enterprise-grade applications that can be developed and deployed quickly and can be accessed from anywhere at any time. You don’t need to install any additional software on the local machine to use VB. The complete development life cycle is managed by the browser interface. From development to testing to deployment, everything is managed by a single unified tool called Visual Builder.

VB allows developers to access the source code of visual development, which makes it easy to write custom code (HTMLJavaScriptJSON) to enhance the functionality of applications. You don’t require any programming experience to develop applications using Visual Builder. The VB uses the open source Oracle technology called Oracle JavaScript Extension Toolkit (JET) for visual development. All the visual UI components belong to the JET family; however, you have the option to use HTML tags and/or the code editor when required.

VB provides a way to store and manage data into the embedded database and a mechanism to call any type of external REST API to interact with a wide variety of external applications. VB provides a declarative way to call any REST API without any coding. VB allows us to call REST-based integrations developed in the integration cloud seamlessly. A VB application interacts with an embedded database or external REST APIs to interact with data.

Having understood what VB really is, next we will have a look at its features and advantages.

Reviewing the features and benefits of VB

It is worthwhile knowing the benefits VB offers. In this fast-growing world, organizations are looking for a development tool that can help to deliver responsive web and mobile applications quickly and efficiently. VB allows quick development, requires no additional software cost, is a drag and drop tool, has a user-friendly interface to develop UIs, and more. It’s a browser-based tool that helps to deliver engaging web and mobile applications.

VB is best suited for situations when you need to extend Oracle and non-Oracle SaaS applications quickly. Using the inbuilt catalog of the Oracle SaaS application, you can extend the Oracle SaaS application very easily.

Let’s try to understand with an example. Let’s say there is a set of external users who want to access the Oracle SaaS procurement module in order to create Purchase Orders (POs), approve POs, list POs, and so on, but the organization is not willing to accord access to the Oracle SaaS application to the external users.

If the organization has VB, then as a solution, the organization can plan to build a web or mobile application in VB and create different flows and pages. Developers can use the built-in catalog of Oracle SaaS to communicate with the Oracle SaaS application in VB and create/approve/list POs and so on in real time from the VB application directly instead of logging into the Oracle SaaS application.

Once the VB application is developed, you can deploy it with a single click and provide access to the external users so that external users can use SaaS application functionality using the VB application as required.

The features that VB offers are as follows:

  • Embedded database: Oracle VB comes with an embedded database that helps you to manage transactional data. Using the data manager of the embedded database, you can import and export bulk data quickly from .csv or .xlsx files. This database has a set of features that makes it easy to maintain the data in the database. Important Note: An embedded database has a limit of 5 GB storage space.
  • Connect to different databases: Oracle VB is provisioned with a local database automatically, but VB gives you the option to switch the local database to another Oracle database such as Database as a Service (DBaaS) or Autonomous Transaction Processing (ATP). Once you connect to a different database, all the data can be managed by the corresponding database.
  • Connect to external REST APIs: Oracle VB allows you to communicate with external REST APIs using a declarative approach without a single line of code. You can connect to any type of REST API and interact with external applications in real-time.
  • Integration with Oracle SaaS application: VB allows out-of-the-box connectivity with Oracle SaaS that helps to extend Oracle SaaS application functionality. With the help of a built-in catalog, VB streamlines the process of communicating with Oracle SaaS applications in real-time without any extra effort.
  • Connect to Processes: VB allows you to interact with the Processes Cloud Service (PCS), which helps you to fetch lists of tasks and take necessary action (approve or reject) from the VB application directly.
  • Web application development: VB allows you to deploy responsive web applications that run on the VB server engine without the need for any additional servers. However, VB web applications can be deployed on any external server but the VB features will be limited.

The following screenshot shows one of the pages of a VB web application:

Figure 1.1 – Web application
  • Mobile application development: VB also allows you to develop a mobile application and build it for Android and iOS. You can build Progressive Web Apps (PWAs) from mobile applications too with just a single click. The following screenshot shows one of the pages of a mobile application:
Figure 1.2 – Mobile application
Figure 1.2 – Mobile application
  • Custom code: In addition to dragging and dropping out-of-the-box components, you have the choice to extend your VB app’s functionality using HTML5 and JavaScript.
  • Inbuilt security framework: Security is one of the top priorities of web and mobile applications, especially when the application is exposed over the internet. VB comes with an embedded security framework that allows you to secure data as well as applications. Application security alone is not enough as anyone can spoof requests in between, change roles, and steal data. So, along with application security, data security is also required.

With the previously listed features, VB is one of the strongest cloud platforms and allows you to build cross-platform applications and solve all the organization’s problems.

The benefits of VB are as follows:

  • Unified platform: The complete life cycle of application development is managed by a single unified platform. Every stage of the application is managed by a single browser-based tool.
  • Quick development: Web and mobile applications can be developed and deployed in a single day using VB as the entire development is just drag and drop. VB provides a user-friendly wizard and other browser-based tools that allow fast development.
  • No additional software: To develop and deploy web and mobile applications, you don’t require any additional software to be installed on your local machine. You just require a browser, good internet connectivity, and a VB subscription, and then you can start your application development.
  • No additional cost: Apart from VB’s cost, you don’t need to pay anything to build web and mobile applications.
  • Easy access to cloud app data and OIC integrations via the catalog: VB provides an built-in catalog to provide access to Oracle SaaS data and integrations developed in Oracle Integration Cloud.
  • Single-click deployment: Using the unified platform, you can bring the application to the world with just a single click.
  • Rich set of UI components: There is a big list of UI components that allow you to create interactive web and mobile applications.
  • Easy creation/packaging of mobile apps

Having discussed the features and benefits of VB, next we’ll explain what tools are required to start development on VB.

Knowing the tools required to use VB

Oracle VB is a pure browser-based development tool that makes it easy for developers to manage the complete life cycle of the development process. To start development in VB, you should be equipped with the following tools:

  • Oracle VB subscription: First and foremost, you must have a VB subscription. A VB instance can be created separately from Oracle Cloud, but VB is also a part of Oracle Integration Cloud (OIC). If you already have an OIC instance, you can leverage the VB feature of OIC without creating a separate VB instance.
  • Browser: Since VB development and deployment is purely browser based, you only need to install a browser to start development. Having a browser-based tool simplifies the development process. You can view the list of supported browsers in the Oracle official documentation at https://docs.oracle.com/en/cloud/paas/app-builder-cloud/abcrn/supported-browsers.html.
  • Good quality internet: Since VB is a cloud-based tool, you should have good quality internet to speed up your application development process.

Having discussed the tools required to develop with VB, next we’ll explain what technologies you should know about before you start developing.

Knowing the technologies used in VB

You don’t require any programming skills to work with on VB as it provides a drag and drop feature with which you can build an enterprise-grade application. But it’s really worth knowing what technologies are used in VB development:

  • JET: JET stands for Java Extension Toolkit, which is Oracle open source technology that is used to build interactive UIs. VB uses JET to design UIs using a rich set of UI components for web and mobile applications. To find out more about JET, you can visit http://oraclejet.org. You can also refer to the JET cookbook for working with UI components at https://www.oracle.com/webfolder/technetwork/jet/jetCookbook.html.The following screenshot shows various JET components in the VB component palette:
Figure 1.3 – JET components
Figure 1.3 – JET components

  • HTML5: HTML stands for Hypertext Markup Language, which is used to build responsive web user interfaces. In combination with JET, VB allows us to use HTML5 to extend your UI’s functionality in order to make interactive web and mobile applications. To learn more about HTML5, refer to https://www.w3schools.com/html/.
  • JavaScriptJavaScript is a web scripting language that’s used to develop and control dynamic content. It is also used for client-side validation of web pages. In VB, JavaScript can be used extensively to extend web page functionalities such as client-side validation, filtering records at the client side, and so on. To learn more about JavaScript, refer to https://www.javascript.com/.
  • CSS: CSS stands for Cascading Style Sheets, and is used in web applications to make UIs interactive. With the help of CSS, you can completely change the design of web applications. VB also allows you to write custom CSS to make your web and mobile application interactive. To learn more about CSS, refer to https://www.javatpoint.com/css-tutorial.

Having understood what technologies you should know for VB, next we’ll explain the VB architecture.

Understanding the VB architecture

It’s important to understand how different VB components are placed and communicate with each other in order to develop web or mobile applications. You also need to understand that VB is not just a development platform, but it also allows you to host the applications, so you don’t require a separate hosting environment to run applications developed in VB.

The following screenshot shows how different components communicate with each other:

Figure 1.4 – VB architecture
Figure 1.4 – VB architecture

VB uses industry standards such as Oracle JETHTML5CSS, and REST. VB uses REST technology for data communication when the UI needs to push/pull data from an embedded database or external applications.

Let’s take a look at the different VB components:

  • Oracle JavaScript Extension Toolkit (JET): JET is the open source technology used to develop web and mobile interfaces in VB. A rich set of components is available in the VB component list that help us to develop a user-friendly UI.
  • HTTP/REST: The communication between the frontend and backend happens via HTTPS or REST calls.
  • Frondend: VB mainly uses Oracle JET to develop the UI using drag and drop features. However, in order to extend the VB application, you have the option to use HTML and JavaScript. Mobile applications that you build in VB use Apache Cordova to access device features such as the camera or location.
  • Backend: The backend of VB web or mobile applications is the embedded or external database (Oracle SaaS, non-Oracle SaaS, third-party integrations, Processes, and so on). All the communication between the frontend and backend happens using REST APIs. This is the only mechanism available to communicate with the data in VB. However, you also have the option to use SOAP APIs, but this is not straightforward and you have to use JavaScript to communicate with SOAP APIs. Whenever you create objects (Business Objects) in an embedded database, VB exposes the REST APIs for those objects and interactions happen using only those APIs.

Instead of using an embedded database, you can switch to use other Oracle database services, such as DBaaS or ATP. After you switch database, all the database objects (Business Objects) that you create in the database will be created in the destination database. In this case, the communication will also happen via REST APIs.

In order to communicate with external applications, you have to build a connection (Service Connection) in VB and consume the REST interfaces of those applications. The VB Service Connection can also be used to interact with Oracle SaaS, Processes, and OIC seamlessly.

Now you know how the different components fit in VB, which will make it easier for you to develop applications in VB.

Summary

In this chapter, we took a look at a lot of topics that will help you start your journey with VB. With this chapter, you learned about Visual Builder, how it works, and its features and benefits. This will help you adopt VB quickly and easily.

We also covered various tools that are required to start development on VB. This will prepare you for the next chapters. You have also learned what technologies will be used in VB, and we have provided a few references that help you to learn all of them easily. Although you are not required to know them all in detail, having an understanding of all those technologies will help to adopt VB quickly.

You have seen how different VB components communicate with each other with a good architecture image. We have explained all the components in detail to aid your understanding.

In the next chapter, you will learn how to provision a VB instance, create users, and assign roles to the application. We will also explain the various ways to navigate around VB.

That’s all about the first chapter. I hope you liked the chapter and ready to buy the book. If yes, then click here to buy the book.