Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Drupal comme vous ne l’avez jamais vu

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.

Simon Perdrisat

June 06, 2012
Tweet

More Decks by Simon Perdrisat

Other Decks in Programming

Transcript

  1. Drupal comme vous ne
    l’avez jamais vu

    View full-size slide

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

    View full-size slide

  3. Évolution des usages

    View full-size slide

  4. ...rendre les projets Drupal plus excitant

    View full-size slide

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

    View full-size slide

  6. ...rendre les projets web plus excitant

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  9. Quel outils choisir ??!

    View full-size slide

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

    View full-size slide

  11. — There is a module for that —

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  15. Ne pas utiliser (que) Drupal

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  22. 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 full-size slide

  23. Utiliser des composants standards

    View full-size slide

  24. Notre design !

    View full-size slide

  25. twitter.github.com

    View full-size slide

  26. Less.css – The One dynamic stylesheet language

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  31. 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 full-size slide

  32. 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 full-size slide

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

    View full-size slide

  34. 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 full-size slide

  35. 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 full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  39. Git Submodule ?
    Phar ?

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  42. $ 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 full-size slide

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

    View full-size slide

  44. $ 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 full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  49. // 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 full-size slide

  50. // 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 full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  56. Temps réel
    Chapitre 4/6

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  59. HTTP c'est lent

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  62. // 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 full-size slide

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

    View full-size slide

  64. Drupal – intégration node.js

    View full-size slide

  65. Tests
    Chapitre 5/6

    View full-size slide

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

    View full-size slide

  67. SimpleTest est uniquement maintenu
    PHPUnit
    Atoum

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  71. 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 full-size slide

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

    View full-size slide

  73. 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 full-size slide

  74. Crédits : 20minutes.fr

    View full-size slide

  75. À vous de jouer !

    View full-size slide

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

    View full-size slide

  77. 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 full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  81. ● 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 full-size slide

  82. 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 full-size slide

  83. 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 full-size slide