ADF BC REST Service from ADF Library JAR

I had assignment to enable ADF BC REST for existing ADF application, which was developed with multiple ADF libraries. ADF BC REST was supposed to be enabled for one of the ADF libraries and then accessed through Master application. All ADF BC REST samples usually show how to enable REST inside Master application itself. I was curious if it will work to enable ADF BC REST and package it into ADF library, which is consumed from Master application. It worked and I would like to share sample app.

Sample app is based on two JDEV projects - library and master applications. Library application contains ADF BC REST implementation for Employees VO:

ADF Library is generated out of ViewController project, ADF BC REST is packaged through dependency:

Model (enabled with ADF BC support) project in Master application imports ADF library:

Run Master application by running REST project. There is improvement in JDEV 12.2.1.3 comparing to 12.2.1.2 - re-deployment works even if dependent ADF library was changed (this is very useful fix - saves a lot of time during development):

REST response is received:

Download sample application - adfbcrest.zip.

Oracle JET List Implementation based on WorkBetter Alta UI

During weekend I was playing with JET WorkBetter sample app. I thought it would be nice to extract People list UI into my own app - so that it will be easy to reuse this UI pattern in our own JET applications. I succeeded to achieve my goal and would like to share WorkBetter Alta UI list sample with you.

This is how my own JET list UI looks like, based on sample app:

Header block is implemented in separate div, this contains title and toolbar for buttons. List content is rendered out of template located in its own div:

Template renders JET list component. List in turn is based based on item template:

Item template defines list row content and structure - through set of JET and custom CSS styles. Data attributes are referenced directly from template structure:

For this sample I'm using basic set of mock data defined in JS module, but obviously it can fetch data from REST service too:

Set of custom styles (created based on WorkBetter example) is located in override.css file within JET application structure:

Sample JET list application can be downloaded from GitHub - jetlistapp.

To build this application, I was using JET CLI commands. Especially useful I found options to strip application leaving only sources and then to restore JET environment - this helps to share code.

Here is the sequence of commands how I was using JET CLI:

ojet create jetlistapp --template=navdrawer (creates JET application)

ojet serve (runs JET application)

ojet strip (removes all files except your sources)

ojet restore (brings back JET environment, after application was stripped)

ojet serve (you can run application again, after it was restored)

Oracle JET Simple Table with Fake JSON Server

What if you want to build JET UI, but there is no back-end REST service ready yet. You could use static JSON data inside JET app and load it from the JSON file. This works, but data retrieval logic will need to be changed after REST service will be ready. This is not productive. Ideally you would like to have fake REST service to simulate REST calls from JET UI, until real REST back-end is ready.

This can be achieved with JSON Server. It provides full fake REST API to be used by front-end client. It is extremely easy to setup JSON Server with NPM. Run npm install to setup JSON Server:

npm install -g json-server

Create simple JSON file with data structure - this will be served from JSON Server:

Run JSON Server with this command, pointing to JSON file:

json-server --watch db.json

You should see REST endpoint URL displayed in the log. Use this URL in JET application to define collection:

JET CollectionTableDataSource can be created on top of collection backed by REST:

JET UI table component renders data directly from CollectionTableDataSource:

Table UI is rendered based on REST call:

To verify REST call, go to developer console and check network request. You should see request executed against fake JSON Server:

Response is visible too:

Download JET sample application with JSON file for JSON Server from my GitHub repository - jetsimplecrud.

ADF 12c Table CRUD Fix for Auto Focus

I had a post about how to improve user data entry for ADF table with auto focus for new row - Improving ADF UI Table CRUD Functionality with Auto Focus. If you follow comments thread for that post - you will see described approach doesn't work exactly as it should in ADF 12c (focus is set for new row but later is lost after tab navigation - it should move focus to another column). Thanks to the community we have simple fix for this issue, read OTN Forum thread - Set Focus on CreateINsert row in ADF Table. I hope Oracle will fix this functionality in the next ADF versions (currently they say it is expected behaviour, and I don't agree with this). But for now - fix does the job.

 Sample app was updated to 12.2.1.3 and it contains fixes described on OTN Forum - ADFTableFocusApp_v2.zip. Focus is set for first column of new row to avoid extra mouse click:

After tab is pressed - focus moves to the next column:

Fix simulates row selection through ADF JS API. After focus was set for the first column in current row - we execute row selection based on active row key. This allows ADF Faces to move focus to the next column on tab, because it knows currently selected row on client side:

Make sure to set active row key in the bean method, same place where focus ID is calculated (otherwise there will be JS error):

ADF Client Side Validation with JavaScript

In my previous post I explained how to use JS client side formatter for ADF Faces input components - ADF Goes Client Side - UI Performance Boost with JavaScript. The same principle can be applied for client side validation. Most likely you are not going to implement complex validation rules on the client side, but for simple checks - it will be perfect. There will be no roundtrip to the server and this will allow to improve user experience.

Client side validation check runs instantly when value is changed and there is no need to set Auto Submit = true to send value to the server. This rule checks value to be in certain range, similar simple checks can be implemented on client side (I'm sure you will find similar rules in your project):

If value is in range, client side formatter is applied as expected:

Custom JSF converter is registered in faces-config.xml and can be added to the input field either manually or dropped through the wizard:

Converter is based on ID, which is defined in faces-config.xml:

Definition in faces-config.xml:

Customer converter class defines range values, these properties will be consumed in JS logic:

Range check is done in JS. If validation fails, we display JSF error message. All happens on client side, without request to the server:

Download sample application with client side validation logic - ADFFormattingApp_v2.zip.

Oracle Java Cloud Service - Scaling and Cluster Setup for ADF

Last couple of weeks I was busy preparing to my OOW'17 session about estimating Java Cloud Service performance for ADF application. I was running stress tests against various JCS instance configurations to be able to create performance estimation methodology. I will describe this methodology on OOW, but here today will list key steps required to scale up JCS instance.

Let's assume you are running single cloud node with 1 CPU and 7.5 GB RAM. This node contains WLS admin and managed server:

To scale up cloud node, simply invoke Scale Up command from the menu. Select new compute shape and confirm scale up operation:

Scale up completed:

Now go to WebLogic console and update Managed Server startup parameters, to adjust heap size to higher value:

Managed server memory can be increased up to certain amount. If more resources will be needed, at some point you will need to create multiple managed servers and connect them into cluster. This would require to define Load Balancer instance (to have single entry point to the cluster):

Cluster node must run in dedicated cloud node. If cluster is based on two managed servers, there must be two cloud nodes:

Managed servers from cloud nodes can be connected into single cluster, this can be done in WebLogic console:

Once cluster is defined, deployment becomes easy - you can deploy ADF application into cluster and it will be propagated to all nodes:

Traffic director running in load balancer instance will be automatically configured to route traffic to cluster nodes:

My Blog Samples Download Repository (For Samples Before 2014 January)

I have been asked, where to download my blog sample applications, posted before 2014 January. If you try to download such sample - you will get error about sample not found. Thats because Google discontinued their support for Google Code repository.

However, you can still download all my samples posted before 2014 January from Google Code archive. Go to archive URL - Google Code Archive for jdevsamples and you can browse all old samples there by date:

All new samples (after 2014 January) are hosted from Google Drive or from GitHub and are accessible directly from blog by URL.