Drupal comme vous ne l’avez jamais vu

Drupal et de manière générale PHP sont souvent utilisés dans un écosystème limité. Nous proposons de défricher avec vous de multiples modèles d’intégration permettant d’accélérer les développements tout en améliorant les performances et l'industrialisation, ainsi que d’apporter de nouveaux usages (moteurs à facettes, temps réel, graphiques, stockage documentaire).

Du prototype fonctionnel jusqu’à son industrialisation, l’intégration judicieuse avec des briques externes peut résoudre simplement des tâches complexes. Cette présentation montrera comment, par des actes concrets, on peut tirer partie de briques techniques tierces depuis PHP. La session s'appuiera sur des retours d'expérience et des exemples de cas réels.

Transcript

1. Drupal comme vous ne
   l’avez jamais vu
   

   View Slide

2. Bastien Jaillot (bastnic) – JoliCode
   Simon Perdrisat (gagarine) - cloud33
   

   View Slide

3. Évolution des usages
   

   View Slide

4. View Slide

5. ...rendre les projets Drupal plus excitant
   

   View Slide

6. ...rendre les projets Drupal plus excitant
   PHP
   

   View Slide

7. ...rendre les projets web plus excitant
   

   View Slide

8. Libre
   Hautement configurable (multiples variantes)
   Multilingue
   Multi-sites
   Hautement intégrable
   Projet pilote – Open Gouvernement dans la
   francophonie
   

   View Slide

9. http://www.le-couteau-suisse.com/exclusivites-wenger/wenger-giant-knife-p-352.html
   

   View Slide

10. Quel outils choisir ??!
    

    View Slide

11. View Slide

12. PHP !!!
    Fiable, répandu, mature*
    Connu au seins des administrations
    * En version 8.2
    le choix Drupal
    

    View Slide

13. — There is a module for that —
    

    View Slide

14. Une API complète pour des modules basé sur
    PHP/MySQL.
    Écrire son module
    

    View Slide

15. ... il faut coder puis maintenir
    http://www.jedessine.com/c_6565/coloriage/coloriage-
    fetes/coloriage-halloween/coloriage-momie-
    halloween/coloriage-d-une-momie
    

    View Slide

16. ?
    

    View Slide

17. A nice duct tape fix
    Making a
    square fit into
    a round hole.
    Credit: NASA
    

    View Slide

18. Ne pas utiliser (que) Drupal
    

    View Slide

19. Améliorer le
    développement de thème
    Chapitre 1/6
    

    View Slide

20. Rendu d'un champs (field)*
    * nous vous épargnons le rendu de la page complète.
    

    View Slide

21. View Slide

22. m t h e r s h i p – séparation couche drupal
    

    View Slide

23. m t h e r s h i p – Sémantique (HTML5)
    VS
    

    View Slide

24. m t h e r s h i p – Sémantique (HTML5)
    VS
    

    View Slide

25. m o t h e r s h i p – Sémantique (HTML5)
    VS
    Indigestion de class
    Éléments HTML5
    

    View Slide

26. View Slide

27. m o t h e r s h i p
    Libère votre thème de l'HTML/CSS spécifique à
    Drupal pour une normalisation du code.
    

    View Slide

28. Utiliser des composants standards
    

    View Slide

29. View Slide

30. Notre design !
    

    View Slide

31. Hum...
    

    View Slide

32. twitter.github.com
    

    View Slide

33. View Slide

34. Less.css – The One dynamic stylesheet language
    

    View Slide

35. réglages de bootstr
    Désactiver les
    composants non
    utilisé
    mixins
    import composant
    

    View Slide

36. m o t h e r s h i p + bootstrap + less
    --- love ---
    

    View Slide

37. Utiliser des composants
    PHP externes PSR-0 FTW
    Chapitre 2/6
    

    View Slide

38. Ryan Weaver, dec. 2011
    « Lack of sharing means
    duplicated efforts »
    http://www.slideshare.net/weaverryan/a-php-christmas-miracle-3-frameworks-1-app
    

    View Slide

39. PSR – PHP Standard Reference
    PSR-0 : accord sur une “norme” d'autoloading
    Symfony2, Zend Framework 2, Lithium, PEAR, Drupal, eZ,
    CakePHP, Doctrine, Propel, Composer, Agavi, Joomla,
    phpBB, … like this.
    

    View Slide

40. PSR-0 : deux possibilités
    namespaces
    class : Symfony\Component\HttpFoundation\Request
    path : vendor/src/Symfony/Component/HttpFoundation/Request.
    php
    underscores
    class : Twig_Extension_Core
    path : vendor/twig/lib/Twig/Extension/Core.php
    

    View Slide

41. View Slide

42. Composants PHP standalones
    Serializer – Guzzle –
    autoloader – twig – Imagine –
    Gaufrette – Exporter – Buzz –
    PHPParser – Symfony2
    Components – Zend Framework 2
    components - Lythium
    components – Mink – Behat –
    Goutte …
    

    View Slide

43. Drupal 8 – PSR-0 ready
    Empruntés à Symfony2
    HttpKernel, HttpFoundation (Request et Response objects),
    EventDispatcher (remplace avangeteusement les hook),
    ClassLoader, Yaml, DependencyInjection
    Et bientôt : Routing, Session,…
    http://www.garfieldtech.com/blog/wscci-kernel-merge
    

    View Slide

44. module Drupal – Composants externes
    $ cat README.txt
    INSTALLATION
    ============
    1) Install behat on your machine following these instructions:
    http://docs.behat.org/quick_intro.html#installation
    2) Copy file "behat.yml" and directory "features" to
    site root directory.
    3) Customize the path to "behat/bootstrap" in behat.yml
    if the behat module isn't located at "sites/all/modules/behat"
    4) Set $base_url in settings.php if your site is not
    accessible at http://localhost/
    (otherwise drupalPost() won't work)
    

    View Slide

45. autoloading ??!
    dépendance ?
    version ??
    mise à jour ?
    

    View Slide

46. Installation (comme un pro)
    PEAR – PHP Extension and Application
    Repository ?
    

    View Slide

47. So 2005!
    w.st-guilhem-le-desert.fr/legendes_diable_pauvre_paysan-p129.htm
    

    View Slide

48. Git Submodule ?
    Phar ?
    

    View Slide

49. So 2011!
    

    View Slide

50. Composer !
    Gestionnaire de dépendance
    Installeur / autoloader
    http://getcomposer.org
    http://packagist.org
    

    View Slide

51. Composer.json
    {
    "require": {
    "php": ">=5.3.0",
    "behat/mink": "1.4.0",
    "behat/mink-goutte-driver": "dev-master"
    }
    }
    So easy!
    

    View Slide

52. $ curl http://getcomposer.org/installer | php
    $ php composer.phar install
    Installing dependencies
    - Installing symfony/event-dispatcher (dev-master)
    Cloning d9ef2afd0218415a8c04ea48a2c83bb5b8f0f51c
    - Installing behat/mink-goutte-driver(dev-master)
    Cloning a9dbd268659d19eabcc8285ca4622b232f55aa91
    […]
    symfony/http-kernel suggests installing symfony/event-dispatcher (dev-
    master)
    symfony/http-kernel suggests installing behat/mink-goutte-driver(dev-master)
    […]
    Writing lock file
    Generating autoload files
    

    View Slide

53. Bam!
    

    View Slide

54. Be lazy
    $ drush dl composer # once
    $ drush composer install
    https://drupal.org/project/composer
    

    View Slide

55. $ cat minktest.module
    /**
    * Implements hook_init()
    */
    function minktest_init() {
    // the autoloader file is generated by composer
    require(__DIR__ . '/vendor/autoload.php');
    }
    /**
    * Non useful function
    */
    function minktest_toto() {
    $mink = new Behat\Mink\Mink();
    $driver = new \Behat\Mink\Driver\GoutteDriver();
    // […]
    }
    

    View Slide

56. Dénormalisation
    de données
    Chapitre 3/6
    

    View Slide

57. Les “fields” dans Drupal
    - gestion de révisions
    - multilangue
    - cardinalité
    - valeurs par défaut
    - validation
    - …
    … Mais la lecture en masse est coûteuse
    

    View Slide

58. Stocker vos calculs
    Stocker des données pré-calculées
    Gain de performance !
    Portabilité des données
    Utilisable directement sans repasser par
    Drupal
    

    View Slide

59. Alternatives de stockage
    NoSQL
    Cassandra
    CouchDB
    MongoDB
    Indexation des données
    solr
    elasticsearch
    xapian
    sphynx
    Cache : redis, memcache
    

    View Slide

60. View Slide

61. // Connect
    $mongo = new Mongo();
    // Créer / Sélectionner la DB
    $db = $mongo->testDB;
    // Créer / Sélectionner la collection (=table)
    $collection = $db->nodes;
    // Charger un node
    $node = (array)node_load($nid);
    // Stocker dans MongoDB
    $collection->save($node);
    PHP
    Insertion
    

    View Slide

62. // Connection
    $mongo = new Mongo();
    // Filtre sur le nid
    $filter = array(
    'nid' => 3,
    );
    // Run! mongo->DB->collection->
    $res = $mongo->testDB>nodes->find($filter);
    // Print
    print $res[0]['title'];
    PHP
    Requête
    

    View Slide

63. Shell mongoDB
    > use testDB;
    > db.nodes.find( {nid: 3} , {title: true});
    { "_id" : ObjectId("5430304500"), "title" : "Mon
    titre" }
    

    View Slide

64. Intégration – Drupal
    drupal.org/project/mongodb
    

    View Slide

65. Search API
    

    View Slide

66. Entity
    Metadata
    Search API
    Solr MongoDB
    bdd, sphynx,
    elasticsearch
    xapian, ...
    Views
    Node
    Utilisateur
    Fields
    Fichier
    Données
    indexers
    Drupal +
    Search API
    

    View Slide

67. Entity
    Metadata
    Search API
    Solr MongoDB
    bdd, sphynx,
    elasticsearch
    xapian, ...
    Views
    Node
    Utilisateur
    Fields
    Fichier
    Données
    indexers
    Node.js
    Python
    

    View Slide

68. Search API c'est encore !
    Multiples indexes
    Altération des données
    Jointures à la création
    Interface graphique
    Extensible
    

    View Slide

69. Temps réel
    Chapitre 4/6
    

    View Slide

70. Requête HTTP
    timeout(500)
    Drupal (Full bootstrap)
    Client
    Server
    Réponse HTTP
    

    View Slide

71. Requête HTTP
    timeout(500ms)
    node.js + mongo
    Client
    Server
    Réponse HTTP
    

    View Slide

72. HTTP c'est lent
    

    View Slide

73. socket.io
    

    View Slide

74. http://www.websocket.org/quantum.html
    

    View Slide

75. http://www.websocket.org/quantum.html
    WooT!
    

    View Slide

76. // Client (index.html)
    
    <br/>var socket = io.connect('http://localhost');<br/>socket.on('news', function (data) {<br/>console.log(data);<br/>socket.emit('my other event', { my: 'data' });<br/>});<br/>
    // Server (app.js)
    io.sockets.on('connection', function (socket) {
    socket.emit('news', { hello: 'world' });
    socket.on('my other event', function (data) {
    console.log(data);
    });
    });
    

    View Slide

77. Requête HTTP
    client1
    Drupal
    Client
    Server
    Réponse HTTP
    node.js
    client2
    client2 ...
    Socket!
    Broadcast
    

    View Slide

78. Drupal – intégration node.js
    

    View Slide

79. Tests
    Chapitre 5/6
    

    View Slide

80. n'évoluera plus
    lenteur
    Test fonctionnel utilise un client HTTP
    "propriétaire" (open source mais utilisé nul part ailleurs)
    Drupal utilise SimpleTest (patché)
    

    View Slide

81. SimpleTest est uniquement maintenu
    PHPUnit
    Atoum
    

    View Slide

82. Briques supérieures
    - Mink : navigateur sous forme de driver
    selenium, sahi, goutte
    - Behat : BDD (Behavior driven development)
    - Atoum
    

    View Slide

83. View Slide

84. Monitoring applicatif /
    statistiques
    Chapitre 6/100*
    * courage, plus que 94 chapitres
    

    View Slide

85. Collecte de données / graphes
    Le module statistics est une catastrophe
    Alternatives :
    - graphite / statsd (by Etsy/Flickr)
    - new relic (SaaS)
    - cacti
    

    View Slide

86. Métriques ?
    - état serveur (mémoire, cpu, etc.)
    - nombre d'utilisateurs (connectés / déconnectés)
    - temps de génération de page
    - nombre de requêtes sql
    - ratio page en cache / page non en cache
    - nombre de scripts css / js généré
    Il devient très facile d'en ajouter, donc on se
    retrouve à en avoir beaucoup et c'est BIEN.
    

    View Slide

87. Code PHP
    applicatif
    Serveur StatsD
    agrège et envoi
    Graphite stocke
    Graphite
    visualise les
    métriques
    UDP
    

    View Slide

88. function etsy_statsd_shutdown_real() {
    // time page
    $time = timer_read('page');
    StatsD::timing("drupal.page.totaltime.ogos",
    $time);
    // query count
    $queries = Database::getLog('etsy_statsd',
    'default');
    StatsD::updateStats("drupal.mysql.querycount.
    ogos", count($queries));
    }
    

    View Slide

89. View Slide

90. Crédits : 20minutes.fr
    

    View Slide

91. Miam !!
    

    View Slide

92. À vous de jouer !
    

    View Slide

93. Gestionnaire de queue : zeromq, rabbitmq
    Outil de mailing : intégration avec un mailer
    (mailchimp)
    Interface offline : Services + backbone.js
    ...
    Pistes à explorer
    

    View Slide

94. Cas concret – projet Drupal
    qa.drupal.org travisci
    drush composant sf2 Console
    drush make composer
    stack git github
    registry PSR-0
    Concentrer les efforts sur la valeur
    ajoutée du projet
    construire le meilleur CMS au monde
    

    View Slide

95. Drupal 8 est prêt dans
    2 ans (on est pessimiste réaliste)
    Pourquoi attendre ?
    

    View Slide

96. Réutiliser le travail des autres, contribuer,
    partager – travailler moins mieux
    

    View Slide

97. https://joind.in/talk/view/6455
    Questions ?
    

    View Slide

98. ● Ryan Weaver (KNP Labs USA)
    “A PHP Christmas Miracle - 3 Frameworks, 1 app”
    http://www.slideshare.net/weaverryan/a-php-christmas-
    miracle-3-frameworks-1-app
    ● Matthieu Guillermin et Nicolas Chambrier
    “Mettez du temps réel dans votre Drupal avec
    NodeJS”
    http://lyon2012.drupalcamp.fr/fr/mettez-du-temps-r-el-
    dans-votre-drupal-avec-node-js
    ● Larry Garfield – “The Kernel has landed”
    http://www.garfieldtech.com/blog/wscci-kernel-merge
    Sources
    

    View Slide

99. Sources / Pour aller plus loin
    ● Kenny Dits – “Performances php chez M6Web”
    http://www.slideshare.net/kennydee/performances-php-
    chez-m6web
    ● Morten dk
    “HTML 4S – while we are waiting for the revolution”
    https://dl.dropbox.com/u/51287/2012-drupalcon-denver-
    html4s.pdf
    ● Timothée Peignier – “Un site web mobile en Django”
    https://speakerdeck.com/u/tim/p/un-site-web-mobile-en-
    django
    

    View Slide

100. Sources / Pour aller plus loin
     ● Shashikant Jagtap – « ATDD with Behat and Selenium »
     http://www.slideshare.net/Shashikant86/atdd-with-behat-
     and-selenium-ldnse6
     ● Jean-Marc Fontaine
     « La gestion des dépendances dans un projet PHP »
     http://www.slideshare.net/JMF/gestion-des-dpendances-
     dans-un-projet-php-forum-php-2012
     

     View Slide