Enabling Redwood components within the Standard Visual Builder app

This article demonstrates how to integrate Redwood templates and components into a standard VBCS application using Oracle Visual Builder.

So far, we’ve been relying on the simplicity of the Regular Blank Template Visual Builder application. However, with the introduction of Redwood, a wealth of new features has arrived.

By simply importing Redwood components, developers can significantly streamline their workload and harness the power of low-code development. This advancement promises to enhance efficiency and empower developers like never before.

Following are the high level steps to fill the use case:

Create Regular VB Application
Create a Redwood template-based Application
Export & Import Redwood Config in the Application Javascript
Adding Dependencies to the application

Create Regular VB Application:
Create a VB application and a web application under the VB application using the Web application navigator.
Create a Redwood template-based Application:
Develop a VB Application by entering the application name and choosing the Redwood Starter Template from the available options as shown in the following screenshot: When crafting a VB application utilizing the Redwood Starter Application template, it generates a ‘vbredwoodapp’ with the default flow set to ‘main’.
Export & Import Redwood Config in the Application Javascript:
Go to the application-level JavaScript file of the Redwood application. Copy the ‘define‘ section. Switch to the regular VBCS app, navigate to its application-level JavaScript file, and paste the copied section as shown in the screenshot below:
```
define(['oj-sp/spectra-shell/config/config'], function() {
```
Adding Dependencies to the application:
Navigate to the search panel to locate the Dependencies in the Redwood Application source code. You will find two files named dependencies.json. Open the first file and copy the contents of the “component-dependencies”: { } object. Paste this object into the first dependencies.json file of a Regular VBCSapp. Repeat this process for the second dependencies.json file as shown in the screenshot below.
Now if we go to the main flow of VB regular application, click on +, and select Create Page we will be able to see the redwood templates to select as shown in the following screenshot:

Along with that if we switch to the Components pallet in main-start we will be able to see redwood components available to select as shown in the following screenshot:
Now, we can utilize Redwood components and templates directly within our standard VBCS application interface. Here’s how we enable Redwood Components and Templates in the Oracle Visual Builder.