I've created a demo to show how Drupal and Sencha Touch can work together. The demo is called "Tea Sencha Network" and it displays information from Sencha's official blog.
Please access:
- the Mobile UI (http://teasencha.net), built on top of Sencha Touch,
- the Green TEAm (http://green.teasencha.net), built on top of Drupal 7,
- the Yellow TEAm (http://yellow.teasencha.net), built on top of Drupal 7.
I followed a Service-Oriented Architecture. The demo uses Drupal as the back-end and Sencha Touch as the front-end. There are actually two Drupal sites being used. While the Drupal sites provide all the data and services, the Sencha Touch interface consumes those data and services and displays them in an innovative way to the user.
Whatever action the user performs in the graph, it's immediately synchronized on the menu. This way, the user can jump from one visualization to the other. Since this interface was specially tailored for mobile devices, only one of the visualizations is available at a time to save screen space. However, it would be interesting to provide both visualizations simultaneously for tablet and desktop users.
The menu provides access to a set of services from different websites. I've used JSONP since both sites are trustful, but it would be a good idea to use CORS for a real-world application. The services layer I've built on top of Drupal already supports CORS. The services are interlinked and use a mechanism I've developed called serviceLink. With serviceLink, it's possible for a user to navigate a Contacts List from a friend, jump to another service, navigate another user's home menu, and come back to the user's own home menu, all this without even noticing that several websites were contacted.
In conclusion, this was a very exciting opportunity to not only create something fun (by the way, the name Tea Sencha Network was inspired by the movie The Social Network), but also something that demonstrates very important concepts regarding social networks and mobile applications.
This site was built in 3 weeks for the Sencha Touch Contest.
Thank you for your attention.
Kind regards,
Nick
P.S.: This demo's only intention is to demonstrate how Drupal and Sencha Touch can work together and the copyright of the aggregated blog entries belong to the original authors.

Comments
P.S.
P.S. 2: Please access from a phone with SVG support (e.g. the iPhone). SVG support for the Android is coming. There is also a version without SVG:
http://teasencha.net/index-no-graph.html
P.S. 3: If you don't have a phone, like me, try using a webkit-based browser (e.g. Safari or Google Chrome). Sencha Touch for now only supports these browsers.
P.S. 4: For a quick look under the hood, try this:
http://yellow.teasencha.net?q=ios&method=user.home&uid=12&debug=1
excellent!
Great demo, Nick, and thanks for bringing Sencha Touch to my attention. Good luck with the contest!
Nice Demo Nick Thnx for
Nice Demo Nick
Thnx for sharing
rajarju
Very very interesting! Thanks
Very very interesting! Thanks for sharing!
This is great. I am doing the
This is great. I am doing the same thing for a site we are planning right now. Doing SOA architecture. Using drupal as backend and leave the front end to something else, that is it can be mobile (like iphone, android or other mobile apps, mobile web) or web. Glad that you have achieve this success with drupal 7. I am considering both drupal 6 and 7, depending on our deadline and some of the drupal 7 contribiute modules.
Thanks
Thank you for the positive feedback everyone! Feel free to contact me if you need more information.
Sencha Touch 1.0
I just completed a proof-of-concept with Sencha Touch RC1 last week and heard 1.0 is out now. I think the next steps for Drupal is to adopt a Sencha add-on to the EXTJS module, and of course maybe some heavy theme layer mods.
Chris Charlton, Author & Drupal Community Leader, Enterprise Level Consultant
I teach you how to build Drupal Themes http://tinyurl.com/theme-drupal and provide add-on software at http://xtnd.us
Sencha Touch 1.0
Hi Chris,
Yes, 1.0 looks good!
I think the best way is to follow a SOA approach.
Let's keep in touch!
Kind regards,
Nick
Code please? :)
Hey
Great job on this. I'm looking for using extjs4 with drupal, and possibly integrate with node.js. But to start off with, i'd like to see how this is done. Would it be possible to get access to the code?
Thanks in advance
Code please? :)
Sure. I used a modified version of the services module:
http://drupal.org/node/477012#comment-2050614
If you want, send me an e-mail and I'll send you the exact code I have running on this site.
Hi Nick :)
Hi Nick, this is so cool!
I was also planning to build mobile site that were build using Sencha and Drupal.
I came across this thread when I googled keyword "Drupal sencha". Thx for sharing this.
Btw, can I have the code also for this? I'd really like to build this with some proper start, instead of digging around from scratch.
Thanks a lot!
Regards,
Ardi
Server Code
Hi Ardi,
Sure. I've sent you an email with the code. If you need further help, let me know.
Kind regards, Nick
Code Request
Dear Nick,
Would you please send me an email too? I'd be very happy to examine the system&code.
Kind regards,
Murat
http://geoperformans.com
Email
To receive the server code, just send me an email:
http://groups.drupal.org/user/9332/contact
Code for Tea Sencha Network
Hi Nick,
Great work and thank you for the code.
Sarat.
the site doesn't work
The site http://teasencha.net/ doesn't work - shoes the stock BlueHost filler page. Do you have plans on reviving it?
Expired
Hi,
Sorry for the delay answering this, I missed your email.
I didn't renew the domain since it was just a demo and I used an old version of sencha touch. But I'm happy to provide anyone with the code if you want to learn.
There is another demo that uses a newer version of sencha touch at:
http://foz.iss.im
Code Request
Hi Nick,
I need your http://foz.iss.im source code. Could you please share your code? My emai-id is: victor.ray22@gmail.com.
ios module
To nick vidal
I read the source code in index.js from pt.foz.iss.im
there is a query: ../?q=ios&method=foz.language
Is the "ios" a module?
Could I get the source code(PHP: ios.module, ios.info, ...) of "IOS" module?
Certainly
Hi Kim,
Certainly, just email me and I'll send you the source, as this is FOSS.
Kind regards,
Nick
Thank You
Thank you for your kindness.
Awesome Work
Hi Nick,
This is most probably the only working example of Drupal + Sencha available. Thank you in advance for the good work. Could you please send me your code (client+server side) at pdesai @@@ androit.com
Thanks.
drupal api
Hi i am confused whether drupal provides extremely powerful apis to access almost every part of data in the site?
For example, i have a drupal site, that contains blogs and few images. So can i get access to these blogs and images through any api in json/jsonP requests, so that i can use it in sencha touch app?
I know you have done the same thing elegantly, but i mean is their any restriction or limit in acessing the data through api?
Thanks.
Data Access
Drupal does provide an API to access almost every part of data. For example: node_load to load information from a node. The API is available here:
http://api.drupal.org/api/drupal
You may also bypass the API entirely and access the data directly from the database using Drupal's database abstraction layer:
http://api.drupal.org/api/drupal/includes%21database%21database.inc/grou...
You might also want to look at some service modules provided here to see how to access the data:
http://drupal.org/project/services
http://drupal.org/project/restws
http://drupal.org/project/webservices
Data acess
Thanks.
I am very happy to hear about the availability of such apis.
Now i am forward to look at it to combine the power of drupal and sencha together.
Thanks Nik.