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

Browserify all the things

Browserify all the things

8607d86bc3aad23fbcaabf27d4295b4c?s=128

Maxime Thirouin

January 30, 2014
Tweet

Transcript

  1. BROWSERIFY ALL THE THINGS 1

  2. J'AI BESOIN D'UN COMPOSANT JAVASCRIPT POUR MA PAGE WEB... ...Je

    cherche un plugin jquery pardis ! 2
  3. Send me an awesome responsive jQuery slider/carousel! I want to

    use it for MDN. — David Walsh (@davidwalshblog) January 29, 2014 3
  4. COMMENT FAIRE DES COMPOSANTS JAVASCRIPT POUR LE BROWSER ? Avec

    un plugin jQuery bien sur ! 4
  5. LA DÉPENDANCE PEUT ÊTRE LOURDE indicateur de chargement avec sémaphore

    plugin qui ouvre les liens externes avec du target blank automatique 5
  6. COMMENT ÉCRIRE DES MODULES AVEC DE PETITES DÉPENDANCES ? 6

  7. En attendant ... PRENNONS EXEMPLE SUR NODE Faisons de petits

    composants la gestion de modules via ES6 mkdir -p rm -rf 7
  8. require() IN DA BROWZER 8

  9. BROWSERIFY TO THE RESCUE ! $ npm install ­g browserify

    $ npm install dep var dep = require('dep') exports.myExample = function () { return dep.truc({blah}) } $ browserify main.js ­o bundle.js 9
  10. ET AMD ? REQUIREJS TOUSSA ? Bof. 10

  11. ECRIRE UN COMPOSANT BULLETPROOF C'EST POSSIBLE ? 11

  12. (function (root, factory) { if (typeof exports === 'object') {

    // CommonJS module.exports = factory(require('b')); } else if (typeof define === 'function' && define.amd) { // AMD define(['b'], function (b) { return (root.returnExportsGlobal = factory(b)); }); } else { // Global Variables root.returnExportsGlobal = factory(root.b); } }(this, function (b) { exemple 12
  13. LES CERISES SUR LE GATEAU LES TRANSFORMATIONS debowerify decomponentify deamdify

    deglobalify jadeify hbsify es6ify uglifyify ... 13
  14. $ npm install debowerify decomponentify deamdify deglobalify e browserify ­t

    debowerify ­t decomponentify ­t deamdify ­t degl 14
  15. DES QUESTIONS ? 15

  16. MERCI ! @MOOX SUR & MAXIME THIROUIN / Version longue

    sur putaindecode.fr TWITTER GITHUB MOOX.IO 16