34
Broccoli EmberConf 2014

Broccoli

  • Upload
    joliss

  • View
    1.472

  • Download
    2

Embed Size (px)

Citation preview

Page 1: Broccoli

BroccoliEmberConf 2014

Page 2: Broccoli

@jo_liss

Page 3: Broccoli

Background

Page 4: Broccoli

packages: Bower

Page 5: Broccoli

build tool: ???packages: Bower

Page 6: Broccoli

grunt watch

Page 7: Broccoli

.coffee

.scss

concat

minify

.handlebars

Page 8: Broccoli

...

Page 9: Broccoli

10 sec

Page 10: Broccoli

O_O

Page 11: Broccoli

Broccoli

Page 12: Broccoli

3 parts

will not talk about design choices

Page 13: Broccoli

PART 1build definitions:

Brocfile.js current syntax will change slightly

Page 14: Broccoli

yayvaporware :p

Page 15: Broccoli

editor time

Page 16: Broccoli

PART 2plugin API

Page 17: Broccoli

Broccoli only knowstrees

tree of files

string or obj

Page 18: Broccoli

{ read: function() { ... }, cleanup: function() { ... }}

Page 19: Broccoli

tree.read()

must return a directory

Page 20: Broccoli

.read()

.read()

.read().cleanup()

Page 21: Broccoli

tiny API

big helper packages

Page 22: Broccoli

broccoli-transformfor 1 input tree

Page 23: Broccoli

broccoli-transform:

transform = function(srcDir, destDir)

Page 24: Broccoli

broccoli-filter

for 1:1 file relationshipson top of broccoli-transform

e.g. CoffeeScript

Page 25: Broccoli

broccoli-filter:

processString = function (string) { return newString }

Page 26: Broccoli

broccoli-filterhas cache :)

Page 27: Broccoli

doesn’t work forSass

Page 28: Broccoli

PART 3

integration

Page 29: Broccoli

Broccoli is asmall library

Page 30: Broccoli

Broccoli <3 Grunt

Page 32: Broccoli

Integrate with backends

Page 33: Broccoli

Pairing anyone?