une api web en webapps firefox os - drupalfr

19
 Meetup Drupal Paris Mai 2015 Une API Web en WebApps Christophe Villeneuve @hellosct1 @neuros_paris & @drupalfr @firefoxosfr

Upload: christophe-villeneuve

Post on 29-Jul-2015

295 views

Category:

Internet


0 download

TRANSCRIPT

Page 1: Une api web en webapps firefox os - drupalfr

   

Meetup Drupal Paris Mai 2015

Une API Web en WebApps

Christophe Villeneuve@hellosct1 

@neuros_paris

&

@drupalfr @firefoxosfr

Page 2: Une api web en webapps firefox os - drupalfr

Meetup Drupal Paris Mai 2015

Firefox OS, c'est ?

● Architecture 3 niveaux

 → Gonk / Gecko / Gaia

● Formats ouverts du Web● Boutique ouverte

 → Market Place

 → 100 % le contrôle● Besoin de contrôler ses données / contenus

● Lancé en 2013

● Mozilla

● Le WEB sur Smartphone

● WebAPPs

Page 3: Une api web en webapps firefox os - drupalfr

Meetup Drupal Paris Mai 2015

Compétences

● Web

● Techniques

https://developer.mozilla.org/en­US/docs/Web/Tutorials

Page 4: Une api web en webapps firefox os - drupalfr

Meetup Drupal Paris Mai 2015

Contrôle APPs

­ Multitouch­ WebTelephony­ WebSMS­ Geolocalisation­ Battery API­ WebNFC­ WebVibration

­ WebContacts­ FullScreen API­ Settings API­ WebUSB­ Camera­ WebBluetooth­ WebGL

Page 5: Une api web en webapps firefox os - drupalfr

Meetup Drupal Paris Mai 2015

Exemple

www.drupalfr.org

Page 6: Une api web en webapps firefox os - drupalfr

   

Meetup Drupal Paris Mai 2015

Appareils mobiles (Quelques modèles)

Alcatel One TouchFlame

ZTE Open C

GeeksPhone Intex Cloud FX

Et beaucoup d'autres disponibles : 

https://www.mozilla.org/fr/firefox/os/devices/

Page 7: Une api web en webapps firefox os - drupalfr

   

Meetup Drupal Paris Mai 2015

Icônes

Ex : Firefox OS 2.x Pour nous

● icone­16.png

● icone­32.png

● icone­48.png

● icone­64.png

● icone­128.png

● icone­512.png

Page 8: Une api web en webapps firefox os - drupalfr

   

Meetup Drupal Paris Mai 2015

{

  "version": "1.0",

  "name": "DrupalFR",

  "description": "Drupal France et Francophonie",

  "launch_path": "/index.html",

  "icons": {

    "48": "/img/icons/drupalfr­48.png",

    "128": "/img/icons/drupalfr­128.png",

    "512": "/img/icons/drupalfr­512.png"

  },

  "developer": {

    "name": "Christophe Villeneuve",

    "url": "http://www.hello­design.fr"

  },

    "installs_allowed_from": [

    "*"

  ],

  "appcache_path": "/cache.manifest",

  "locales": {

    "fr": {

      "description": "Drupal France et Francophonie",

      "developer": {

        "url": "http://www.hello­design.fr"

      }

    }

  },

  "default_locale": "en"

}

Manifest.webapp

https://developer.mozilla.org/en­US/Apps/Build/Manifest

Options possibles : ­ Fullscreen­ Permission­ Orientation­ Serveur­ Etc.

Page 9: Une api web en webapps firefox os - drupalfr

   

Meetup Drupal Paris Mai 2015

CACHE MANIFEST

# Version 1.0

CACHE:

/css/all.css

/js/lib/all.js

/js/all.js

/index.html

Manifest.appcache

Page 10: Une api web en webapps firefox os - drupalfr

   

Meetup Drupal Paris Mai 2015

<!DOCTYPE html>

<html>

<head>

<meta charset="utf­8">

<title>Drupal France et Francophonie</title>

<meta name="description" content="">

<meta name="viewport" content="width=device­width">   

<meta http­equiv="refresh" content="5;url=http://www.drupalfr.org">   

</head>

<body>

<p>Drupal France et Francophonie</p>

<p>Loading...</p>

</body>

</html> 

Index.html

Page 11: Une api web en webapps firefox os - drupalfr

   

Meetup Drupal Paris Mai 2015

Structure (1/2)

Firefox OSWeb

Page 12: Une api web en webapps firefox os - drupalfr

   

Meetup Drupal Paris Mai 2015

Structure (2/2)

Drupal

/!\ Apache

Page 13: Une api web en webapps firefox os - drupalfr

   

Meetup Drupal Paris Mai 2015

Résultat Simulateur (WebIDE Firefox)

Page 14: Une api web en webapps firefox os - drupalfr

   

Meetup Drupal Paris Mai 2015https://marketplace.firefox.com/developers/

Page 15: Une api web en webapps firefox os - drupalfr

   

Meetup Drupal Paris Mai 2015

https://marketplace.firefox.com/developers/validator

Validateur

Page 16: Une api web en webapps firefox os - drupalfr

   

Meetup Drupal Paris Mai 2015

Déployer votre API

https://marketplace.firefox.com/developers/submit/

Page 17: Une api web en webapps firefox os - drupalfr

   

Meetup Drupal Paris Mai 2015https://marketplace.firefox.com/

Marketplace

Page 18: Une api web en webapps firefox os - drupalfr

   

Meetup Drupal Paris Mai 2015

En  résumé

● Pas de modules (pour l'instant)● Respecter les formats ouverts et les standards● Faites le Web comme vous... 

Page 19: Une api web en webapps firefox os - drupalfr

Meetup Drupal Paris Mai 2015

Merci

● Présentation de

Christophe Villeneuve

<<

@hellosct1

● Liens : 

http://firefoxos.mozfr.org

https://www.mozilla.org/fr/firefox/os/