Développer une application pour son smartphone avec firefox

De Sciencinfolycee
Révision datée du 18 juin 2014 à 11:43 par Vthierry (discussion | contributions) (Tester une application pour se familiariser avec l'outil)
Aller à : navigation, rechercher

Développer une application pour son smartphone avec firefox

Quoi de plus cool quand on apprend à programmer de pouvoir faire sa propre application pour son smartphone, ou sa tablette, ou son ordinateur et bien entendu ceux de nos proches ?

Pas si simple : entre les systèmes très fermés d'Apple, les variantes des différents systèmes Android dont le système de développement n'est pas immédiat, et le fait qu'il faut finalement redévelopper l'application autant de fois que de plateformes … ah mais il y a une solution : développer l'application en HTML5/JavaScript elle tournera alors dans un navigateur donc sera disponible partout (et pourra même être encapsulée dans une vraie application avec un outil comme phonegap). La fondation mozilla propose même une solution toute simple:

en voici la description.

Installer ses outils

Il y a deux gestes à faire

  1. Choisir son éditeur pour créer les fichier: un simple éditeur comme brackets ou un environnement plus complexe de développement comme Eclipse.
  2. Installer un navigateur, dans les faits il vaut mieux utiliser firefox dans ce contexte et son App Manager

Tester une application pour se familiariser avec l'outil

  1. Récupérer les sources [ICI] (dézipper le fichier) ils serviront de modèle pour les applications suivantes:
AppFirefoxTutoriel-2.png
  1. Dans firefox : lancer le manager d'application
AppFirefoxTutoriel-1.png
  1. Puis effectuer les quatres opérations suivantes
    1. Ajouter l'application en ouvrant tout simplement le répertoire "battery-quickstart-starter-template-complete" qui a été dézipper
    2. Démarrer le simulateur
    3. Choisir l'OS par défaut
    4. Cliquer sur update pour charger l'application dans le simulateur
AppFirefoxTutoriel-3.png

et vous voilà avec un smartphome simulé qui exécute votre application

AppFirefoxTutoriel-4.png
  1. Et alors ?

Ref: App quickstart

Utiliser les technos HTML5/JS

  • Le point clé est avant toute implémentation de réfléchir au design de l'application: que voulons nous faire ? pour quel usage et usagers ? etc
  • On utilise ensuite deux groupes de technos
    • HTML et CSS pour créer les pages et les documents de l'application,
    • JavaScript et toutes les interfaces pour accéder à toutes les ressources que l'on souhaite (géolocalisation, caméras, …),
    • sans oublier les objets graphiques,

y compris pour des jeux. https://developer.mozilla.org/fr/docs/Web/HTML https://developer.mozilla.org/fr/docs/CSS