Réaliser des applications
innovantes avec Symfony2
Symfony2, API REST et Javascript
Qui sommes-nous ?
Alexandre Salomé
Consultant
@alexandresalome
Kévin Dunglas
Co-fondateur
@dunglas
Architecture
API REST
- Exposer les données de l’application
- HTTP + JSON/XML
- Plus léger que SOAP (adapté pour le mobile)
- RESTful
curl -X POST http://example.com/api/user
--data '{"username": "alice", "fullname": "Alice"}'
SPA (Single Page Application)
- Application JavaScript
- S’exécute côté client
- Récupère et modifie les données via l’API
REST
- Seules les données utiles transitent
Application
apps
mobiles
site web
responsive
autres applications et
sites
(ERP, logistique,
partenaires…)
application
Facebook
API REST
Internet
Stockage de données
Application Serveur Web
Internet
Applications tierces
Fichiers
Ecosystème
- PHP 5.3, 5.4, 5.5 (namespaces, traits)
- Composer
- Frameworks / CMS / PSR (PHP-FIG)
- PHPUnit / phpspec / Behat
PHP-FIG : http://www.php-fig.org
Awesome PHP : https://github.com/ziadoz/awesome-php
PHP
- Framework “full stack”
- Découplé en composants
- Axé fiabilité (tests), sécurité et performance
- Design moderne (POO, MVC, DIC, Events…)
- Intègre des bibliothèques tierces reconnues :
Twig, Swiftmailer, Doctrine
http://symfony.com / http://github.com/symfony/symfony
Symfony2
AngularJS
- Framework JavaScript MVC complet
- Maintenu par Google
- Communauté importante
- S’intègre parfaitement avec Symfony
http://angularjs.org/
Backbone.js
- Bibliothèque JavaScript
- Synchronise la couche modèle de l’application
cliente avec une API REST
- S’intègre facilement dans du code JS existant
- S’intègre parfaitement avec Symfony
http://backbonejs.org/
Alternatives
- Ember.js :
http://emberjs.com/
- Chaplin.js :
http://chaplinjs.org/
Et bien d’autres.
Implémentation
Modèle relationnel objet
- Doctrine : http://www.doctrine-project.org/
(ORM + ODM + O*M)
- Propel : http://propelorm.org/
- PHPCR : http://phpcr.github.io/
- ElasticSearch : http://www.elasticsearch.org/guide/en/elasticsearch/client/php-api/current/
Voir aussi https://github.com/ziadoz/awesome-php#orm-and-datamapping
Sérialisation des objets
return new JsonResponse($object->toArray());
Composant Serializer
http://symfony.com/fr/doc/current/components/serializer.html
JMSSerializerBundle
https://github.com/schmittjoh/JMSSerializerBundle
Exposer une API REST
- FOSRestBundle :
https://github.com/FriendsOfSymfony/FOSRestBundle
- NelmioApiDocBundle :
https://github.com/nelmio/NelmioApiDocBundle
- JMSSerializerBundle :
http://jmsyst.com/bundles/JMSSerializerBundle
Envoyer des données
- “Désérialisation” du JSON ou du XML :
JMSSerializerBundle
- Validation des données et mise à jour des
objets :
Symfony Form framework
Gestion des assets
- Less, SASS
- Minify, Uglify, YUI Compressor, …
- Bower
Avec Symfony : Assetic
Sans Symfony : Grunt + Yeoman
Show me the code
Exemple KISS
/**
* @Route(path="/user/{id}", name="user_show")
*/
public function showAction($id)
{
$user = $this
->getDoctrine()
->getRepository('AcmeDemoBundle:User')
->find($id)
;
if (!$user) {
throw $this->createNotFoundException(sprintf('User %s not found.', $id));
}
return new JsonResponse($user->toArray());
}
Exemple (encore plus court)
/**
* @Route(path="/user/{id}", name="user_show")
*/
public function showAction(User $user)
{
return new JsonResponse($user->toArray());
}
Behat-Launcher
Côté serveur (80%)
- Silex
- Composant
Serializer
Côté client (20%)
- Twitter Bootstrap
- AngularJS
- Internationalisation
- Grunthttp://github.com/alexandresalome/behat-launcher
DunglasTodoMVCBundle
Côté serveur (50%)
- Symfony
- FOSRest / JMSSerializer
Côté client (50%)
- Backbone.js et Chaplin.js
- CoffeeScript
http://github.com/dunglas/DunglasTodoMVCBundle
Aller plus loin
Référencement
- Google ne sait pas exécuter le JavaScript
- Les SPA ne sont pas référencées par défaut
Solution : Prerender.io (snapshots)
http://prerender.io
https://github.com/rjanot/YuccaPrerenderBundle
Sécurité
- Protection CSRF d’une SPA
https://github.com/dunglas/DunglasAngularCsrfBundle
- Utilisation de l’objet JsonResponse
JSON Vulnerability
Hypermedia API
Découverte dynamique des serveurs par les
clients :
- HATEOAS (HAL+JSON)
http://hateoas-php.org/
- Hydra / JSON-LD http://www.markus-
lanthaler.com/hydra/
Des questions ?
Une bière !

Diaporama du sfPot Lillois du 20 mars 2014

  • 1.
    Réaliser des applications innovantesavec Symfony2 Symfony2, API REST et Javascript
  • 2.
    Qui sommes-nous ? AlexandreSalomé Consultant @alexandresalome Kévin Dunglas Co-fondateur @dunglas
  • 3.
  • 4.
    API REST - Exposerles données de l’application - HTTP + JSON/XML - Plus léger que SOAP (adapté pour le mobile) - RESTful curl -X POST http://example.com/api/user --data '{"username": "alice", "fullname": "Alice"}'
  • 5.
    SPA (Single PageApplication) - Application JavaScript - S’exécute côté client - Récupère et modifie les données via l’API REST - Seules les données utiles transitent
  • 6.
    Application apps mobiles site web responsive autres applicationset sites (ERP, logistique, partenaires…) application Facebook API REST Internet
  • 7.
    Stockage de données ApplicationServeur Web Internet Applications tierces Fichiers
  • 8.
  • 9.
    - PHP 5.3,5.4, 5.5 (namespaces, traits) - Composer - Frameworks / CMS / PSR (PHP-FIG) - PHPUnit / phpspec / Behat PHP-FIG : http://www.php-fig.org Awesome PHP : https://github.com/ziadoz/awesome-php PHP
  • 10.
    - Framework “fullstack” - Découplé en composants - Axé fiabilité (tests), sécurité et performance - Design moderne (POO, MVC, DIC, Events…) - Intègre des bibliothèques tierces reconnues : Twig, Swiftmailer, Doctrine http://symfony.com / http://github.com/symfony/symfony Symfony2
  • 11.
    AngularJS - Framework JavaScriptMVC complet - Maintenu par Google - Communauté importante - S’intègre parfaitement avec Symfony http://angularjs.org/
  • 12.
    Backbone.js - Bibliothèque JavaScript -Synchronise la couche modèle de l’application cliente avec une API REST - S’intègre facilement dans du code JS existant - S’intègre parfaitement avec Symfony http://backbonejs.org/
  • 13.
    Alternatives - Ember.js : http://emberjs.com/ -Chaplin.js : http://chaplinjs.org/ Et bien d’autres.
  • 14.
  • 15.
    Modèle relationnel objet -Doctrine : http://www.doctrine-project.org/ (ORM + ODM + O*M) - Propel : http://propelorm.org/ - PHPCR : http://phpcr.github.io/ - ElasticSearch : http://www.elasticsearch.org/guide/en/elasticsearch/client/php-api/current/ Voir aussi https://github.com/ziadoz/awesome-php#orm-and-datamapping
  • 16.
    Sérialisation des objets returnnew JsonResponse($object->toArray()); Composant Serializer http://symfony.com/fr/doc/current/components/serializer.html JMSSerializerBundle https://github.com/schmittjoh/JMSSerializerBundle
  • 17.
    Exposer une APIREST - FOSRestBundle : https://github.com/FriendsOfSymfony/FOSRestBundle - NelmioApiDocBundle : https://github.com/nelmio/NelmioApiDocBundle - JMSSerializerBundle : http://jmsyst.com/bundles/JMSSerializerBundle
  • 18.
    Envoyer des données -“Désérialisation” du JSON ou du XML : JMSSerializerBundle - Validation des données et mise à jour des objets : Symfony Form framework
  • 19.
    Gestion des assets -Less, SASS - Minify, Uglify, YUI Compressor, … - Bower Avec Symfony : Assetic Sans Symfony : Grunt + Yeoman
  • 20.
  • 21.
    Exemple KISS /** * @Route(path="/user/{id}",name="user_show") */ public function showAction($id) { $user = $this ->getDoctrine() ->getRepository('AcmeDemoBundle:User') ->find($id) ; if (!$user) { throw $this->createNotFoundException(sprintf('User %s not found.', $id)); } return new JsonResponse($user->toArray()); }
  • 22.
    Exemple (encore pluscourt) /** * @Route(path="/user/{id}", name="user_show") */ public function showAction(User $user) { return new JsonResponse($user->toArray()); }
  • 23.
    Behat-Launcher Côté serveur (80%) -Silex - Composant Serializer Côté client (20%) - Twitter Bootstrap - AngularJS - Internationalisation - Grunthttp://github.com/alexandresalome/behat-launcher
  • 24.
    DunglasTodoMVCBundle Côté serveur (50%) -Symfony - FOSRest / JMSSerializer Côté client (50%) - Backbone.js et Chaplin.js - CoffeeScript http://github.com/dunglas/DunglasTodoMVCBundle
  • 25.
  • 26.
    Référencement - Google nesait pas exécuter le JavaScript - Les SPA ne sont pas référencées par défaut Solution : Prerender.io (snapshots) http://prerender.io https://github.com/rjanot/YuccaPrerenderBundle
  • 27.
    Sécurité - Protection CSRFd’une SPA https://github.com/dunglas/DunglasAngularCsrfBundle - Utilisation de l’objet JsonResponse JSON Vulnerability
  • 28.
    Hypermedia API Découverte dynamiquedes serveurs par les clients : - HATEOAS (HAL+JSON) http://hateoas-php.org/ - Hydra / JSON-LD http://www.markus- lanthaler.com/hydra/
  • 29.