This is a short article about a big topic. About how JET Composite Components – small or pretty substantial – can be reused and integrated, not only in other JET applications (or components) but also in Oracle ADF applications and Application Builder CS. JET Composite Components are based on the W3C Web Component standards – that “allow for the creation of reusable widgets or components in web documents and web applications”, supported by all major browsers.
Some examples of what components could look like and could be used for:
A JET Composite Component is a reusable piece of UI that can be embedded as a custom HTML element and can be composed of other composites, JET components, HTML, JavaScript, and CSS. REST data access can be integrated as deeply or shallowly as desired inside the component – so the component can arrange for its own data. A JET Composite Component is configured with run time meta data to define Attributes/Parameters/Settings, emits Events that can be handled out side of the component and may carry additional design time meta data extensions that facilitate for integration into business-user tools (for example providing explanations about the purpose, functionality and usage of the component).
An initial implementation of JET Composite Components is available in JET today (as of 2.1.0, see a sample on the JET website). This implementation will get richer in the very near future.
At some point – a Zip file containing one or more JET Composite Components can be loaded into a Component Catalog on the Oracle Public Cloud. The composite components can imported into an Application Builder Cloud Service application, its configurable properties are set, appropriate for the host application and the component will do its job inside an ABCS environment.
A similar story applies to ADF (as well as JET itself and MAF):
From the Component Catalog, an ADF developer can import a JET Composite Component and integrate it into an ADF page. Here too the configurable meta-data for the component can be defined – using hard coded properties as well as EL expressions. Composite components will likely require data sets that are presented in some special way – sets that are to be injected from the ADF context.
The composite components can emit events – to tell the [subscribed] world about what went on inside the component (typically a selection or data entry by the user); these events have to somehow be fed into an ADF Faces way of handling events – such as contextual events (as used with ADF Taskflows) or the clientListener (and serverListener) mechanism.
How the integration of JET Composite Components will be done – what the syntax is for an <af:compositeComponent> or whatever the tag is going to be, how composite components are to registered with an ADF application or page, whether this mechanism will support any WebComponent or only JET Composite Components and when the integration is supported in ADF is not yet clear (to me) at the time of writing (October 2016). I am however quite convinced that this mechanism for embedding JET components in ADF application will have several effects: JET becomes even more attractive to the current ADF developer community, new ADF Faces components are less likely to be developed by Oracle yet ADF applications can become richer and more functional in special areas. I can say I am quite looking forward to this development and I am interested to see if the creation and sharing of JET Composite Components is going to really take off, within the community.
ADF 12.2.1.1.0 was released in June. The 12.2.1.2.0 release seems around the corner towards the end of 2016. That is the first opportunity for JET Composite Components to be introduced. However, it may not be until the Spring of next year before we can really get our hands dirty and our feet wet.
Resources
W3C Web Components on Wikipedia: https://en.wikipedia.org/wiki/Web_Components and WebComponents.org: http://webcomponents.org/ and on MDN: https://developer.mozilla.org/en-US/docs/Web/Web_Components
Slide deck from Oracle OpenWorld 2016: https://oracle.rainfocus.com/scripts/catalog/oow16.jsp?search=MTE6650&search.event=oracleopenworld
JET Composite Component Demo: http://www.oracle.com/webfolder/technetwork/jet/jetCookbook.html?component=composite&demo=basic
JET Documentation – Working with Composite Components
Blog article Getting Started with Oracle JET Composite Components by Geertjan Wielenga
how it could be done until now: Embedding Angular in ADF Faces, OTN Community Article 2014 https://community.oracle.com/docs/DOC-890831 by Paco van der Linden & Lucas Jellema
