BROWSERIFY



require('module') in the browser
 by bundling up the dependencies

@avidas

  • Software Engineer at Braintree/PayPal
  • Publish paypal client library on npm
  • https://developers.braintreepayments.com

Node AND NPM



  • Node and npm getting rapid growth
  • CommonJS way of defining modules, 'require' to include and 'export' as the public API

Package Manager Traction



https://nodejs.org/api/modules.html

browserify

  • Browserify builds npm modules for client side
  •  Offers much broader options for client side javascript
  • Expands audience for npm module publishers

how it works

  • Traverses dependency tree of modules in  package.json and bundles them into one self contained file that you can include with a script tag
  • Builds abstract syntax tree of code recursively and can find node_modules
  • Supports built in node modules e.g. path and globals e.g. Buffer
  • Thousands of modules that plug into or built on top







Transforms

  • Core Browserify just bundles CommonJS modules
  • Transform Plugin API enables modules that can apply any preprocessing to convert into CommonJS format so that Browserify can build them e.g. Coffeeify, deAMDify, hbsify, debowerify
  • Multiple transforms can be applied but order does matter


Build Tooling

  • Available as a command line tool
  • Works well with Grunt and Gulp
  • Watchify - browserify bundler that watches files for changes and only builds what it needs to

ALternatives


  • Webpack
  • Require.js

Resources


  • http://browserify.org/
  • https://github.com/substack/browserify-handbook
  • https://github.com/substack/browserify-adventure

browserify adventure


[code along]

npm install -g browserify
npm install -g browserify-adventure





@avidas

Browserify

By Ananya Das

Made with Slides.com

Browserify

Nodeschool presentation

  • 357