In the last post about the new Adobe Data Model codename Fiber First Experiences with the Adobe Data Model – Setup, I looked at the setup and installation process. This one will be a short post about how to run a first HelloWorld example, so let’s take a look if we can do a some click & drag and get some data on the screen.

Ok, let’s start.

Open Flash Builder and create a new Flex Project. Give it the name helloworld, set Application type to Web and Server technology to J2EE. Check the Use remote object access service and choose LiveCycle Data Services ES. Leave the Create combined Java/Flex project using WTP unchecked. And click next.

In the Configure J2EE Server step, just check that your root setting are set correctly. In my configuration Root folder is C:\Flex\lcds\lcds3\tomcat\webapps\lcds, Root URL is http://localhost:8400/lcds/ and Context root is /lcds. Click on Validate Configuration to test your settings.

You should also see that Flash Builder has automatically set the Output folder on your server. Now you can click Next one more time, leave the rest as is and click Finish.

It’s finally time to work with the Adobe Data Model. While you are still in Flash Builder, look at the Package Explorer. You should see a new icon called Open Data Model for Active Project. When you click on it, Flash Builder will create an fml file for you which opens in Design view.

If you ask yourself where the heck this file now is, click in the Package Explorer on the Filter icon and uncheck .* and .model. Hit F5 to refresh the Package Explorer you should now see a .model folder which contains the newly created Adobe Data Model. In my case the file is called helloworld.fml.

Switch to the new Adobe Data Model perspective, for example by going to Window -> Open Perspective -> Adobe Data Model.

If the setup still works as expected, you should be able to see your databases in the RDS view. Open your tables and just drag an easy table to your fml file. In my case, I have a user table containing just a numeric id and firstname and lastname fields as string.

Save the fml file and, if you are curious like me, click on the Source button and take a look at the generated xml code. What you can see here is called a meta model and contains things like entities, annotations and properties. If you dare, you can now also take a look at the Modeler Guide pdf that came with the LCDS3 beta download, as you can see the Adobe Data Model is properly worked out and thoroughly documented.

Let’s continue with our helloworld now. Switch back to Flash Builder and take a closer look to the Data Service view. Flash Builder should have generated a Service for you. If you refresh the Flex project in the Package Explorer you should also see a new package, named after the project name. Flash Builder has created Entity, Service and Metadata files for you.

Quite cool, but this is just half of the story, there is also the server side.

Some intermediate thoughts

All this plays nicely together with the code generated by Flash Catalyst, where you end up with an assets and component folder. But what I ask myself is actually why Adobe uses the name of the project as the package name for the ActionScript model and service classes, instead of taking a more generic name like datamodel? Maybe a good and flexible way would be to have a possibility to set these package names in the Flash Builder settings somehow.

I mean this for both, Flash Catalyst and Flash Builder, so that you could place the components for example into com.mysite.view.widgetname.gen.components and com.mysite.model.adobemodel. What do you think? How should theses packages be named to suite your expectations?

… but, let’s go on with our example.

Before we are able to call the server, we have to tell the server which services we expect to be available. Look again at the fml file, at the top you will find an icon called Deploy Model to LCDS Server.

When you click on this button, the model file (helloworld.fml) will be copied to the server into the WEB-INF/fiber directory.

Also take a look into WEB-INF/flex/services-config.xml where you can see that next to the <service-include> tags a new service class is added called fiber.data.services.ModelDeploymentService. The model file will be used to make the needed services available to Flex.

The obvious question now is what possibilities there are to hock into this process. As far as I discovered it yet, one way will be to extend the FiberAssembler and introduce your own functionality based on annotations you add to your model so that your custom assemblers are able to take specific actions. I plan to try this in the next post.

Ok, to finish this, open the main application file of your Flex application and switch to the design view. From the Components Panel and there from the Data Controls choose the DataGrid and at it to your mxml file. From the Data/Services Panel drag & drop your Service to the Grid and click ok to bind the getAll() method to the DataGrid.

Save the file and run your project.

Voila, you should see your database content in the gird which is automatically loaded at the creationComplete event.

For me, all this is in the line of what we have seen in the last weeks around the Flash Catalyst workflows. By including now also the Adobe Data Model, you are able to further expand the workflow and even connect your data store to your Flex applications without writing to much code.

Together with the Modeler, the Adobe Data Model is definitively a very interesting an modern way to access your data or even start to work with a model driven approach. It looks like MDA starts to lift off for Flex Developers!

Now we only have to figure out how we use this catalysed way of working with these real world java back-ends. So, in the next post I will try to discuss some more complex use cases.

Sincerely yours,
Roland