Lock in $30 Savings on PRO—Offer Ends Soon! ⏳

Turbinando seu workflow para o desenvolvimento ...

Turbinando seu workflow para o desenvolvimento de webapps

A área de desenvolvimento front-end é cheia de grandes desafios, sejam eles voltados para mobile, web ou desktop. Sendo assim quais frameworks, ferramentas e bibliotecas são relevantes? e quanto a performance? Venha conhecer dicas de como encarar seu dia-a-dia, amando seu workflow.

Davidson Fellipe

July 28, 2013
Tweet

More Decks by Davidson Fellipe

Other Decks in Programming

Transcript

  1. TURBINANDO SEU WORKFLOW PARA O DESENVOLVIMENTO DE WEBAPPS por davidson

    fellipe www.fellipe.com http://blog.stalker.com.br/wp-content/uploads//2013/04/tools.jpg
  2. Who Killed My Battery: Analyzing Mobile Browser Energy Consumption CONSUMO

    ENERGIA DOS COMPONENTES outros - incluem conexões 3G e text rendering css e js - maior consumo relacionado a transmissão e rendering
  3. BITBUCKET VS GITHUB repos privados ilimitados preço baseado no número

    de colaboradores número de colaboradores ilimitado preço baseado no número de repositórios privados
  4. O QUE É O GRUNT? É um task runner baseado

    em linha de comando para projetos javascript
  5. O QUE É O GRUNT? Testes JS linting Concatenando e

    Minificando Otimizando imagens Watches para Pré-processadores
  6. Por que usar o GRUNT? Facil de usar Grande número

    de plugins Imensa comunidade Open source
  7. Instalados e gerenciados via NPM (node.js) Adiciona grunt command no

    system path INICIANDO COM GRUNT $ npm install -g grunt-cli
  8. gruntfile.js module.exports = function( grunt ) { grunt.initConfig({ // configuracoes

    }); //plugins grunt.loadNpmTasks( 'plugin-name' ); //tarefas grunt.registerTask( 'default', [ 'watch' ] ); };
  9. INSTALANDO GRUNT $ npm install grunt --save-dev Instala a ultima

    versão no seu folder Adiciona ao package.json
  10. PRINCIPAIS CUIDADOS • Minificar CSS, JavaScript e HTML • Inline

    images, CSS, e JavaScript • Cache de assets • Defer JavaScript • Concatenar CSS e JavaScript • Compressão de imagens & resizing