diaporama du sfpot lillois du 20 mars 2014

Réaliser des applications innovantes avec Symfony2Symfony2, API REST et Javascript

Qui sommes-nous ?Alexandre Salomé

Consultant

@alexandresalome

Kévin DunglasCo-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 webresponsive

autres applications et sites

(ERP, logistique, partenaires…)

applicationFacebook

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.orgAwesome 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, Doctrinehttp://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 objetsreturn new JsonResponse($object->toArray());

Composant Serializerhttp://symfony.com/fr/doc/current/components/serializer.html

JMSSerializerBundlehttps://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 : AsseticSans 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-LauncherCô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.iohttps://github.com/rjanot/YuccaPrerenderBundle

Sécurité

- Protection CSRF d’une SPAhttps://github.com/dunglas/DunglasAngularCsrfBundle

- Utilisation de l’objet JsonResponseJSON 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 !