Gerenciando Front-End vendors no Rails

Slide 1

Slide 1 text

GERENCIANDO FRONT-END VENDORS No Rails

Slide 2

Slide 2 text

SÉRGIO VILAR Senior Software Engineer

Slide 3

Slide 3 text

PORQUE NÃO VERSIONAR VENDORS?

Slide 4

Slide 4 text

• Difícil upgrade e downgrade • Arquivos no projeto que não serão alterados (ou pelo menos não deveriam) • Permite desenvolvedores escreverem monkey-patchs nos vendors fora do processo fork-PR-release • Atualizar dependências das dependências se torna um pesadelo

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

• Já faz parte do rails-way • Não é necessário adicionar uma dependência para versionar apenas os vendors do front-end • Pouca variedade de front-end vendors • Geralmente são ports com frequência de atualização duvidosa

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

• Gerenciador de pacotes do node.js • Contém a maioria do front-end vendors • Tendência absoluta na comunidade para gerenciamento de pacotes node e front-end vendors • Os que ainda não estão no npm estão sendo migrados aos poucos do Bower • Permite usar npm scripts • Tem como dependência o node.js

Slide 9

Slide 9 text

NPM + ASSET PIPELINE

Slide 10

Slide 10 text

$ npm init

Slide 11

Slide 11 text

$ npm i --save jquery $ npm i --save backbone

Slide 12

Slide 12 text

package.json   1 { 2 "name": "jampa-ruby", 3 "version": "1.0.0", 4 "description": "Jampa Ruby App", 5 "main": "index.js", 6 "scripts": { 7 "test": "echo \"Error: no test specified\" && exit 1" 8 }, 9 "author": "Sergio Vilar", 10 "license": "ISC", 11 "dependencies": { 12 "backbone": "^1.3.3", 13 "jquery": "^3.0.0" 14 } 15 }

Slide 13

Slide 13 text

$ npm i --save-dev concat-files

Slide 14

Slide 14 text

package.json 1 { 2 "name": "jampa-ruby", 3 "version": "1.0.0", 4 "description": "Jampa Ruby App", 5 "main": "index.js", 6 "js-vendor": [ 7 "jquery/dist/jquery", 8 "backbone/backbone" 9 ], 10 "scripts": { 11 "test": "echo \"Error: no test specified\" && exit 1" 12 }, 13 "author": "Sergio Vilar", 14 "license": "ISC", 15 "dependencies": { 16 "backbone": "^1.3.3", 17 "jquery": "^3.0.0" 18 }, 19 "devDependencies": { 20 "concat-files": "^0.1.0" 21 } 22 }

Slide 15

Slide 15 text

concat.js   1 var concat = require('concat-files') 2 , path = require('path') 3 , pkg = require('./package.json') 4 , target_dir = path.resolve('app/assets/javascripts/bundle.js') 5 , fixed_directories = pkg['js-vendor'].map(function(file){ 6 return 'node_modules/' + file + '.js' 7 }) 8 9 concat(fixed_directories, target_dir, function(err) { 10 if(err) throw new Error(err) 11 })

Slide 16

Slide 16 text

package.json 1 { 2 "name": "jampa-ruby", 3 "version": "1.0.0", 4 "description": "Jampa Ruby App", 5 "main": "index.js", 6 "js-vendor": [ 7 "jquery/dist/jquery", 8 "backbone/backbone" 9 ], 10 "scripts": { 11 "install": "node concat.js" 12 }, 13 "author": "Sergio Vilar", 14 "license": "ISC", 15 "dependencies": { 16 "backbone": "^1.3.3", 17 "jquery": "^3.0.0" 18 }, 19 "devDependencies": { 20 "concat-files": "^0.1.0" 21 } 22 }