Gerenciando Front-End vendors no Rails

Transcript

1. GERENCIANDO FRONT-END VENDORS No Rails

2. SÉRGIO VILAR Senior Software Engineer

3. PORQUE NÃO VERSIONAR VENDORS?

4. • 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
5. None

6. • 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
7. None

8. • 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

9. NPM + ASSET PIPELINE

10. $ npm init

11. $ npm i --save jquery $ npm i --save backbone

12. 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 }

13. $ npm i --save-dev concat-files

14. 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 }

15. 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 })

16. 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 }

17. SÓ SUCESSO

18. VALEU! vilar.cc twitter.com/feelsen github.com/sergiovilar