Productive Enterprise Web Development with Ext JS and Clear Data Builderhttp://www.sencha.com/blog/productive-enterprise-web-development-with-ext-js-and-clear-data-builder
It&rsquo;s not likely that you&rsquo;ll start developing an enterprise HTML5 application without using one of the JavaScript frameworks. One of the most feature complete frameworks is Sencha Ext JS. Farata Systems has developed an open source software tool called Clear Toolkit for Ext JS. Clear Toolkit includes an Eclipse plugin called Clear Data Builder.en-usyfain@faratasystems.comCopyright 20132013-04-22T14:59:50+00:00Comment by firefoxSafariHi Viktor,
Thanks for the excellent responses.&nbsp; It sounds like the toolkit has been very well thought out.
Just a suggestion that some of these points would be good to have on the wiki
Nice work!
(note: third time I’ve tried to respond so apologies if there’s someday a flurry of dup comments).Hi Viktor,

Thanks for the excellent responses. It sounds like the toolkit has been very well thought out.

Just a suggestion that some of these points would be good to have on the wiki

Nice work!

(note: third time I’ve tried to respond so apologies if there’s someday a flurry of dup comments).

]]>Wed, 24 Apr 2013 22:46 GMThttp://www.sencha.com/blog//productive-enterprise-web-development-with-ext-js-and-clear-data-builder#id:33184#date:22:46Comment by Viktor GamovHi firefoxSafari,
// Controller getters
Yes, it’s known issue with ExtJS 4.2 and it will be fixed in next release of CDB.
As for now, you can grab the clear.override.app.Controller.js code from Github https://github.com/Farata/ClearJS/blob/master/com.farata.cleardatabuilder.extjs/resources/new_project/WebContent/clear/override/app/Controller.js and place it in your project. If you have other issues, feel free to report to the issue tracker [1].
// Transactional
Server-side component clear.transaction.djn.BatchGateway (https://github.com/Farata/ClearJS/blob/master/clear-extjs-runtime-djn/src/clear/transaction/djn/BatchGateway.java) uses JTA to perform transactional handling of batch members that sent by BatchManager (see Clear.data.DirectStore, sync() method) client-side component. If you don’t want to use JTA stuff, you need to provide your own implementation with signature described Clear.direct.ServerConfig.js (In BatchGateway.java find annotated @DirectMethod execute method). If you have some particular use case in mind, please, fill the bug in the issue tracker on the Github [1], and will try to help you with it.
//Scaffolding
The ExtJS Models generator can be used as a standalone utility. Here is an example how it can be used from command line https://www.box.com/s/8f3kw7rx7zzmirf45l2l ($JAVA_HOME/bin should be in the PATH).
Also you can customize a service code generation even today. The templates (CDB uses XSL for the templates) are fully customizable. Please, look inside cdb_build folder of a generated project.
FYI, Clear Data Builder does not wipe out the generated code, it only replaces the older source files with the newer versions. Consequently, if you rename your Java classes, it is your responsibility to delete the generated source files related to the old class. Long story short, you can throw away a generator part any time.
[1] https://github.com/Farata/ClearJS/issues
Cheers,
ViktorHi firefoxSafari,

// Transactional
Server-side component clear.transaction.djn.BatchGateway (https://github.com/Farata/ClearJS/blob/master/clear-extjs-runtime-djn/src/clear/transaction/djn/BatchGateway.java) uses JTA to perform transactional handling of batch members that sent by BatchManager (see Clear.data.DirectStore, sync() method) client-side component. If you don’t want to use JTA stuff, you need to provide your own implementation with signature described Clear.direct.ServerConfig.js (In BatchGateway.java find annotated @DirectMethod execute method). If you have some particular use case in mind, please, fill the bug in the issue tracker on the Github [1], and will try to help you with it.

//Scaffolding
The ExtJS Models generator can be used as a standalone utility. Here is an example how it can be used from command line https://www.box.com/s/8f3kw7rx7zzmirf45l2l ($JAVA_HOME/bin should be in the PATH).
Also you can customize a service code generation even today. The templates (CDB uses XSL for the templates) are fully customizable. Please, look inside cdb_build folder of a generated project.
FYI, Clear Data Builder does not wipe out the generated code, it only replaces the older source files with the newer versions. Consequently, if you rename your Java classes, it is your responsibility to delete the generated source files related to the old class. Long story short, you can throw away a generator part any time.

]]>Wed, 24 Apr 2013 21:06 GMThttp://www.sencha.com/blog//productive-enterprise-web-development-with-ext-js-and-clear-data-builder#id:33183#date:21:06Comment by firefoxSafariHi Viktor,
Thanks for the info.
//Direct and CRUD
You’re quite right - the Java Example Project did answer my question about id’s.&nbsp; For the benefit of others reading this, the key for me was that I had to invoke changeObject.setNewVersion(dto) in my _doCreate methods after I had assigned the id I wanted to the dto.&nbsp; It might be nice to add just this last bit to the screencast, too.
FYI, the Java Example Project gave me several JavaScript errors using Ext 4.2.&nbsp; The controller methods were looking for a method called getExampleCompanyStore, but the actual method Ext generated was getExampleCompanyStoreStore.&nbsp; Brings back nightmares from jax-ws where wsgen always wanted to call my endpoints ServiceService!&nbsp; After changing this, the examples worked as expected.
//Transaction libraries
I understand that I could remove the tx libraries for WebSphere and that it’s desirable for it to run on Tomcat out of the box.&nbsp; However, it still does sound like CDB is choosing a tx strategy for me in that I have to use JTA and I have to bind things to JNDI.&nbsp; Starting a project from sratch is one thing, but I’ve seen many apps use resource local tx and not mess with JTA at all.&nbsp; Debatable whether this is good, but it’s the reality for many older JavaEE apps I’ve seen.&nbsp; I think it would bring more value if the tx strategy was completely pluggable.&nbsp; Maybe it is - haven’t spent enough time on CDB to give a judgement on it.
//Scaffolding
Excited for future scaffolding options.&nbsp; Would love to eventually see the templates that actually generate the scaffolding opened up to give users more control.&nbsp; Something like grails or spring roo.
Our reality is that we might not be able to use all pieces of CDB on all apps, especially existing ones.&nbsp; IMO to reach the most people and have the most impact, it would good to decouple the Ext Direct and server side parts, the tx strategy, and the client side code generation.&nbsp; For example, maybe because of constraints on a legacy app, someone can’t use Ext Direct but they still get value from annotating Java classes to generate Ext model and sample grid, albeit not with not as much functionality.&nbsp; I realize this might not fall into the overall goals for the project, though.
I’ll keep playing around and check out the rest of the wiki pages - glad Java to Ext scaffolding options are starting to emerge.Hi Viktor,

Thanks for the info.

//Direct and CRUD
You’re quite right - the Java Example Project did answer my question about id’s. For the benefit of others reading this, the key for me was that I had to invoke changeObject.setNewVersion(dto) in my _doCreate methods after I had assigned the id I wanted to the dto. It might be nice to add just this last bit to the screencast, too.

FYI, the Java Example Project gave me several JavaScript errors using Ext 4.2. The controller methods were looking for a method called getExampleCompanyStore, but the actual method Ext generated was getExampleCompanyStoreStore. Brings back nightmares from jax-ws where wsgen always wanted to call my endpoints ServiceService! After changing this, the examples worked as expected.

//Transaction libraries
I understand that I could remove the tx libraries for WebSphere and that it’s desirable for it to run on Tomcat out of the box. However, it still does sound like CDB is choosing a tx strategy for me in that I have to use JTA and I have to bind things to JNDI. Starting a project from sratch is one thing, but I’ve seen many apps use resource local tx and not mess with JTA at all. Debatable whether this is good, but it’s the reality for many older JavaEE apps I’ve seen. I think it would bring more value if the tx strategy was completely pluggable. Maybe it is - haven’t spent enough time on CDB to give a judgement on it.

//Scaffolding
Excited for future scaffolding options. Would love to eventually see the templates that actually generate the scaffolding opened up to give users more control. Something like grails or spring roo.

Our reality is that we might not be able to use all pieces of CDB on all apps, especially existing ones. IMO to reach the most people and have the most impact, it would good to decouple the Ext Direct and server side parts, the tx strategy, and the client side code generation. For example, maybe because of constraints on a legacy app, someone can’t use Ext Direct but they still get value from annotating Java classes to generate Ext model and sample grid, albeit not with not as much functionality. I realize this might not fall into the overall goals for the project, though.

I’ll keep playing around and check out the rest of the wiki pages - glad Java to Ext scaffolding options are starting to emerge.

]]>Wed, 24 Apr 2013 19:08 GMThttp://www.sencha.com/blog//productive-enterprise-web-development-with-ext-js-and-clear-data-builder#id:33181#date:19:08Comment by Viktor GamovHello firefoxSafari,
Thanks for your feedback.
// Trailing commas
Thanks for pointing out. We will revise default templates for typos and unnecessary trailing commas.
//Transaction libraries
By default, Clear Data Builder creates project that could be run on Tomcat without any other dependencies. This is starting point for developer. Tomcat is widely adopted Java WebServer. But Tomcat itself is not full Java EE application server. Which means, some of the important APIs are missing. CDB runtime rely on standard Java Transaction API to translate client side Batch request into server side transactions. For that purpose, CDB ships with JOTM transaction manager library that enables JTA programming model in Tomcat. If you want to run application of WebSphere you need to manually remove jotm libraries. But you need to make sure that your JTA implementation registers java:comp/UserTransaction JNDI resource. Clear Toolkit not choosing a transaction strategy for you, as per Convention over Configuration, only provides a default implementation which works out of the box.
//Direct and CRUD
You can Java Example Project (New -&gt; ClearDataBuilder for ExtJs Project in Eclipse). This project has extensive example of the CRUD methods. This example has answer to your question. Long story short, as I demonstrated in this article and screencasts, generated store has all required methods backed by server-side service implementation. There is nothing Direct or CDB specific. You can use store.load, store.add and etc
//Scaffolding
We have something in out minds to add in future releases of CDB.
Keep you eye on project page on Github!
I hope this will help!
Cheers,
ViktorHello firefoxSafari,

//Transaction libraries
By default, Clear Data Builder creates project that could be run on Tomcat without any other dependencies. This is starting point for developer. Tomcat is widely adopted Java WebServer. But Tomcat itself is not full Java EE application server. Which means, some of the important APIs are missing. CDB runtime rely on standard Java Transaction API to translate client side Batch request into server side transactions. For that purpose, CDB ships with JOTM transaction manager library that enables JTA programming model in Tomcat. If you want to run application of WebSphere you need to manually remove jotm libraries. But you need to make sure that your JTA implementation registers java:comp/UserTransaction JNDI resource. Clear Toolkit not choosing a transaction strategy for you, as per Convention over Configuration, only provides a default implementation which works out of the box.

//Direct and CRUD
You can Java Example Project (New -> ClearDataBuilder for ExtJs Project in Eclipse). This project has extensive example of the CRUD methods. This example has answer to your question. Long story short, as I demonstrated in this article and screencasts, generated store has all required methods backed by server-side service implementation. There is nothing Direct or CDB specific. You can use store.load, store.add and etc

//Scaffolding
We have something in out minds to add in future releases of CDB.
Keep you eye on project page on Github!

I hope this will help!

Cheers,
Viktor

]]>Wed, 24 Apr 2013 17:01 GMThttp://www.sencha.com/blog//productive-enterprise-web-development-with-ext-js-and-clear-data-builder#id:33180#date:17:01Comment by firefoxSafariThanks for sharing - many intriguing ideas.
Some comments / questions:
A few of your generated .js files are a little loose with the extra commas.&nbsp; For example, the Ext.container.Viewport subclass I got in a simple test project had a trailing command after align: ‘center’.&nbsp; The HelloController had a trailing comma… there were others.
The tool puts A LOT of stuff in WEB-INF lib, some of which I don’t want and I think could contribute to longer build times.&nbsp; I wouldn’t want the jta jars or jotm or the apache commons connection pool stuff.&nbsp; Might be ok for tomcat depending on what you’re used to, but if you’re deploying to WebSphere or something I’m not really comfortable with these or with the framework choosing a transaction strategy for me.&nbsp; At least get rid of the gson source jars!
An example doing real database access with a persistence provider like hibernate would be useful.
This might be more of an Ext Direct question, but I’m not at all sure from the examples how you’d get data back to the client after a create.&nbsp; Case in point, the example where you create a Person sort of just stops after you see that the server got the request and you’re left staring at a screen where the new Person row still doesn’t have an id.&nbsp; This example would be a lot better if you took it one step further and at least returned a ‘fake’ id so you could see it on the client.
I like the idea of scaffolding, or at least the idea of generating .js from annotated java classes.&nbsp; It seems like there’s much room for innovation here.&nbsp; For example, no reason the paging toolbars had to be added by hand - there could have been some extra annotations that indicated the need for paging.&nbsp; It would also be nice if the framework provided at least a simple means of paging among items already in memory.
Interested to see where this project goes.Thanks for sharing - many intriguing ideas.

Some comments / questions:

A few of your generated .js files are a little loose with the extra commas. For example, the Ext.container.Viewport subclass I got in a simple test project had a trailing command after align: ‘center’. The HelloController had a trailing comma… there were others.

The tool puts A LOT of stuff in WEB-INF lib, some of which I don’t want and I think could contribute to longer build times. I wouldn’t want the jta jars or jotm or the apache commons connection pool stuff. Might be ok for tomcat depending on what you’re used to, but if you’re deploying to WebSphere or something I’m not really comfortable with these or with the framework choosing a transaction strategy for me. At least get rid of the gson source jars!

An example doing real database access with a persistence provider like hibernate would be useful.

This might be more of an Ext Direct question, but I’m not at all sure from the examples how you’d get data back to the client after a create. Case in point, the example where you create a Person sort of just stops after you see that the server got the request and you’re left staring at a screen where the new Person row still doesn’t have an id. This example would be a lot better if you took it one step further and at least returned a ‘fake’ id so you could see it on the client.

I like the idea of scaffolding, or at least the idea of generating .js from annotated java classes. It seems like there’s much room for innovation here. For example, no reason the paging toolbars had to be added by hand - there could have been some extra annotations that indicated the need for paging. It would also be nice if the framework provided at least a simple means of paging among items already in memory.