Construction d'une application reliée à WordPress avec le Plugin WP-AppKit

1. 40 minutes pour construire une application mobile
reliée à WordPress avec WP-AppKit
Atelier WordCamp Lyon
5 juin 2015

2. Prérequis technique :
connaissez-vous les fortune cookies ?

3. A Lyon, on connaît ça
avec la papillote ;)
En poursuivant votre écoute de cet atelier, vous acceptez l’utilisation des fortune cookies.

4. Notre volonté :
Übériser le marché des fortune cookies
Un usage des
smartphones de plus en
plus présent
3 milliards de biscuits
fabriqués chaque année
Chaque village de France
possède un PMU... et un
restaurant chinois

5. WordPress pour les contenus : chaque
message est un post de type “Fortune
Cookie”.
Plugin WP-AppKit : définition des
composants et du thème de l’appli, gestion
des web services et export pour
Cordova/PhoneGap
Cordova / Phonegap / Phonegap Build :
compilation pour téléphones iOS et
Android.

6. Cordova / PhoneGap / PhoneGap Build
Applications mobiles hybrides
● Cordova = la techno (Apache) | PhoneGap = le produit (Adobe)
● PhoneGap Build = PhoneGap dans le cloud
Application Hybride :
● WebApp HTML/CSS/JS encapsulée dans une coque native
● API Javascript pour accéder aux fonctionnalités du téléphone (photos, géoloc …)
● Compilation > exécutable (.apk, .ipa) prêt pour distribution sur App Stores
WebApp
HTML
CSS
Javascript (accès
téléphone par
l’API JS Cordova )
Cordova / PhoneGap
Icônes
SplashScreen
Plugins
Méta données de l’app
Compilation
Téléphone
Android
iOS
...

7. WP-AppKit
Construire des applications mobiles connectées à WordPress
● Plugin WordPress open source d’UncatCrea (version beta 0.3)
● https://github.com/uncatcrea/wp-appkit et bientôt sur le repo WordPress.org
● Construction de l’application en BO, à partir des contenus du WordPress.
● Mise à disposition des web services de récupération de ces contenus.
● Noyau applicatif de type WebApp (HTML / CSS / JS, pas de PHP) basé
sur BackboneJS et RequireJS.
● Logique de thèmes HTML / CSS / JS indépendants des thèmes
WordPress, avec mini framework JS pour dialoguer avec le noyau de l’app
depuis les thèmes.
● Export sous forme d’un projet Cordova/PhoneGap

8. L’application Fortune Cookies
Tu secoues, t’as un cookie, tu partages...
Principe de l’application
1. Récupération des
messages
2. Secouage = affichage
du message
3. Partage du message
via les applis disponibles

9. C’est parti !

10. Le thème de l’appli de cette démo est disponible ici :
https://github.com/uncatcrea/wpak-theme-fortune-cookie
Slides de la présentation :
http://uncategorized-creations.com/presentations/wordcamps/lyon-20150605/
Merci ! :)
Collectif UncatCrea
http://uncategorized-creations.com
https://github.com/uncatcrea/wp-appkit
Lionel Pointet @lpointet
Mathieu Le Roi @mat_lr
Benjamin Lupu @benjaminlupu