View Full Version : Drupal 7 and Sencha Touch

31 Oct 2010, 6:18 AM
I've created a demo to show how Drupal (http://drupal.org) and Sencha Touch (http://www.sencha.com/products/touch) can work together. The demo is called "Tea Sencha Network" (http://teasencha.net) and it displays information from Sencha's official blog (http://www.sencha.com/blog/).

Please access:

the mobile UI ((http://teasencha.net (http://teasencha.net)), built on top of Sencha Touch,
the Green TEAm (http://green.teasencha.net), built on top of Drupal 7, and
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 (http://thesocialnetwork-movie.com)), 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 (http://www.sencha.com/contest/).

Thank you for your attention.

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.

31 Oct 2010, 6:33 AM
For a quick look under the hood, try this:

16 Mar 2011, 4:25 AM
could you please tell us more about how you

a) configured drupal 7 and
b) what modules did you use
c) how you configured the sencha proxy/store to fetch the data?
(o.k. - this you can see from here: http://teasencha.net/tsn.js)

that would be great!

16 Mar 2011, 6:06 AM
Sure. I used a modified version of the services module:

If you want, send me an e-mail and I'll send you the exact code I have running on this site.

11 Dec 2011, 12:49 PM
Hi Nick Vidal (http://nick.iss.im/),
I want to develop a mobile site who's back end will be drupal and exactly the main drupal site for desktop.
I'm using Mobile Tools module currently to switch theme depending on user agent.
Main target is to develop the mobile theme with the Sencha js.
As i'm new in sencha , i would like to have the code example you are running.
Can you please let me see the codes ?
It would be really helpful if you suggest any better idea or any tricks as well.

Nizam Uddin

11 Dec 2011, 1:40 PM
Sure. Email me: [email protected]

30 Dec 2011, 1:28 AM
Drupal with Sencha Touch, very interesting combination. I am developing an ecommerce site in Drupal. Will it be appropriate to use Sencha Touch?

30 Dec 2011, 4:51 AM
Certainly. You would only need to build the appropriate web services around Drupal Commerce.

22 Jan 2012, 3:47 AM

How to connect sencha touch to drupal website and retrive the modules.

9 Mar 2012, 11:00 PM
It's really interesting post about the combination of Sencha Touch and Drupal. Nice sharing. Thanks for sharing such useful thread.