Sencha Touch: framework HTML5 pour application mobile

Introduction:

Sencha est un framework HTML5 pour créer des application mobiles multiplateformes. L’intérêt de celui-ci est de faire, à partir d’un projet HTML et de code JSON, une même application mobile sur plusieurs plateformes, un gain de temps incroyable si le code s’y tient. Nous allons voir les premiers pas d’une application à partir de Sencha.

Installation:

Il vous faudra télécharger Sencha Touch 2 SDK et le SDK Tools. Le premier correspond aux outils de développement que nous allons mettre en place, le deuxième correspond à l’outil permettant de générer nos applications par la suite en interprétant notre code. Il faut que la documentation Sencha Touch soit installé dans un dossier accessible via le web (http://localhost/Sencha/sencha-touch-2.1.0-gpl/docs/).

Vous pouvez installer Sencha Cmd, un toolkit qui s’utilise en ligne de commande pour différentes taches (générer un projet, le compiler, etc.).

Un serveur web local ainsi qu’un navigateur web sont obligatoires pour l’utilisation de ce framework.

Ces différents outils une fois installés, nous allons vérifier notre environnement en tappant la commande “sencha” dans un terminal. Voici mon résultat:

On voit que la commande existe, on nous retourne la version de Sencha Cmd, ainsi que différentes aides pour d’autres commandes.

En cas d’erreur, je vous conseille la documentation Sencha Touch très complète: documentation.

Nouveau projet:

Nous allons installer un nouveau projet. Pour cela, je me suis placé dans mon dossier de développement Sencha via l’invité de commande. Entrez ensuite la commande suivante:

Cela me génère un dossier WeatherApp avec tout le contenu d’une application par défaut. Si j’accède au dossier via mon navigateur web, cela me renvoie un premier resultat:

Le dossier se structure avec 3 parties:

• app: c’est là où nous travaillerons principalement, on reconnait la structure MVC (Modèle-Vue-Controleur). Il intègre deux autres parties supplémentaires  “Store” et “Profile”.
• resources: c’est ici que vous ajouterez toutes vos ressources (images, vidéos, css).
• touch: c’est le dossier des sources Sencha, il permet de faire les rendus html entre autres.

Et voici mon résultat:

Conclusion:

Sencha Touch est assez intéressant à première vue, mais ce ne sont pas des applications natives qu’il génère, il embarque tous les outils Sencha et rend l’application plus lourde qu’une native.

De plus, les requêtes dans le store sont limitées, il ne peut avoir qu’une source gérée automatiquement, soit une base de donnée locale, soit un appel de service web. Pour pouvoir en gérer plusieurs il faudra faire le traitement par soi même.

Enfin, l’idée d’une application hybride, en intégrant du code natif et Sencha Touch est fortement déconseillé.

Cependant ce framework respecte ces différents engagements à savoir le portage sur les différents systèmes pour mobile. Il possède une documentation détaillée, une forte communauté ainsi que certaines mises en avant intéressantes comme un concours basé sur Sencha, jusqu’à 10 000€ à gagner ainsi que le dernier péripherique pour chaque plateforme.