15 Develop an App UI or Fragment

An App UI is simply an application that includes Visual Builder pages and flows. Some App UIs are created by Oracle—like Oracle Cloud Applications—but you can build your own App UIs and deploy them as peers alongside Oracle’s App UIs in your Oracle Cloud Applications ecosystem.

A fragment is a reusable user interface component that you can use across many App UIs. For example, suppose you want a common greeting in the form "Hello, <user name>" to appear at the top of several pages. Rather than building this code individually on each of the target pages, you can create a simple fragment and drop the fragment on the page in the appropriate location. Fragments also make it easy to bundle related objects together for layout templates.

From a development perspective, the options available to you when building App UIs and fragments are nearly identical. Although a fragment can be as full-featured as an App UI, it is meant to be deployed within an App UI, as opposed to standing alone as a separate deployable unit.

Note:

As a best practice, it's a good idea to create only one App UI in each extension for typical scenarios.

This chapter—and all the chapters in this part—assume that you have some key concepts already under your belt, namely:

  • You know how App UIs and/or fragments are used and why you might want to build one. If you don't, you may want to read What Is an Extension? and/or What Are Fragments?
  • Before you can create an App UI or fragment, you must have a workspace which, among other things, provides access to a Git repository in which to store your work. If you're already in the Designer (that is, your screen looks something like the one shown below), that means you have a workspace (called myext, in this image) and you're ready to get to work. Description of brandnewworkspace.png follows
    Description of the illustration brandnewworkspace.png

    If your screen doesn't look like this, you need to create an extension so you have your own workspace. See Create an Extension.

Once you've landed in the Designer, you have quite a few options: