1

DX External Data Provider in an headless worldJanuary 25th, 2017

2

Introduction

What will you see?

External data providerRendering capabilities of DXLearn how to bake a cake

There are 28 slides and 3 bonus

3

The basics: get content, display it.

1

4

1 Simple use case

Goal to achieve: - Give the world access to my catalog

Requirements:- A Catalog- A web server application (the world)

5

1 Things to do

- Expose the catalog to the world - Create a connector in the web server application to

read the Catalog

2 connectors :- ExposeCatalog- DisplayCatalog

6

Now, complicate things a bit

2

7

2 Add a new source of content

Goal to achieve:- Provide content from a completely different Catalog

Things to do:- Create a connector to this catalog - Edit the display connector to fit the new structure

8

2 Add a new output

Goal to achieve:- Expose the content to an Android / iOS / raspberry

application

Things to do:- Edit the 2 connectors to support this new output- Create a new output connector to support all the

external sources with their input connectors

9

2

10

2 And life goes on ...

New outputs to addNew sources to add

Time needed increase dramatically

Complex to maintain

11

2 DX

Use DX as a solution between your content sources and the outside world

Using the External Data Provider to get the DataUsing the rendering mechanism and structure to deliver it

- Quick development- Easy to maintain- Easy to evolve

12

2

13

3Your content in DX:External Data Providers

14

What is an External Data Provider ?

Functionally: A way to virtualize content in DX JCR tree

Technically: A simple DX module

3

15

How to create an External Data Provider

Set an external provider declaration based onorg.jahia.modules.external.ExternalContentStoreProvider

Define an External Data Source implementing org.jahia.modules.external.ExternalDataSource

Create an External Data object

3

16

ExternalContentStoreProvider

Use spring to instantiate the provider.<bean id="ExternalGenericDatabaseProvider" class="org.jahia.modules.external.ExternalContentStoreProvider" parent="AbstractJCRStoreProvider"> <property name="key" value="ExternalGenericDatabaseProvider"/> <property name="mountPoint" value="/external-database-generic"/> <property name="externalProviderInitializerService" ref="ExternalProviderInitializerService"/> <property name="dataSource"> <bean class="org.jahia.modules.external.test.db.GenericDatabaseDataSource"/> </property></bean>

The provider declaration can define provider capabilities such as:

- Extension support- Lock support

3

17

External Data Source

Implement ExternalDataSource to build ExternalDataList<String> getChildren(String path)ExternalData getItemByIdentifier(String identifier)ExternalData getItemByPath(String path)

getSupportedNodeTypes()isSupportsHierarchicalIdentifiers()isSupportsUuid()itemExists(String path)

3

18

3 External Data Object

To build it, use the default ConstructorExternalData(String id, String path, String type, Map<String, String[]> properties, boolean isNew)

19

3 Extend an External Data Source

The External Data source can be extended implementing the following interfaces:

AccessControllable SupportPrivilegesSearchableWritableCanCheckAvailabilityCanLoadChildrenInBatchInitializableLazyPropertyReferenceable

20

3 Extension

With extensions, it is possible to enhance the external content with custom properties.

This can be useful to add ratings, comments

The content is stored in a dedicated place in the JCR.

21

3 Server settings

An External Data Provider is used to mount external content into DX.

We provide a UI in the server settings to manage mount points

No documentation yet :'(

22

3 Usages

In DX:- VFS to mount file system- Sources in the Studio- User and Group Provider

From modules (available on the store or in Github):- CMIS- Tmdb- Database connector- LDAP

23

4Headless rendering

24

Headless

The rendering is detached from its content.Consume JSON

Examples :Single page appMobile rendering

Create a new edit UI

4

25

4 DX and Headless

DX natively offers to render content in an unitary way

DX can generate JSON

26

4 How to query and get JSON

Querying content can let you read the content, but also modifying it

- With the render chain:Default json views that can be found in /default/src/main/resources/nt_base/json

- Create an Action

- Use Jax-RS API (like in our JC Rest API module)

- Use GraphQL (this is the future)

27

5Conclusion

28

Mix the things

Get your content in DX using the External Data Provider

Generate JSON using DX capabilities

Enjoy !!

5

29

5 One more thing ..

Now that your content is in DX you can use :

- Edit engines- DX flows- DX modules- Play with it as any other DX content- Etc ..

30

Alternatively you can bake a cake

Here the recipe:● nonstick vegetable oil spray● 1 1/2 cups all-purpose flour● 2 teaspoons baking powder● 3/4 teaspoon kosher salt● 1 cup sugar● 1 tablespoon finely grated lemon zest● 3/4 cup whole-milk Greek yogurt● 1/2 cup vegetable oil● 2 large eggs● 1/2 teaspoon vanilla extract

5

31

Preparation

Preheat oven to 350°F. Coat a standard (8 1/2x4 1/4") loaf pan with nonstick vegetable oil spray. Dust with flour; tap out excess. Whisk 1 1/2 cups all-purpose flour, 2 teaspoons baking powder, and 3/4 teaspoon kosher salt in a medium bowl. Using your fingers, rub 1 cup sugar with 1 tablespoon finely grated lemon zest in a large bowl until sugar is moist. Add 3/4 cup whole-milk Greek yogurt, 1/2 cup vegetable oil, 2 large eggs, and 1/2 teaspoon vanilla extract; whisk to blend. Fold in dry ingredients just to blend. Pour batter into prepared pan; smooth top. Bake until top of cake is golden brown and a tester inserted into center comes out clean, 50-55 minutes.

Let cake cool in pan on a wire rack for 15 minutes. Invert onto rack; let cool completely. DO AHEAD: Can be made 3 days ahead. Store airtight at room temperature.

5

32

THE END!THANKS FOR LISTENING