Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Desenvolvimento ágil com AngularJS

Desenvolvimento ágil com AngularJS

Ciro Nunes

August 03, 2013
Tweet

More Decks by Ciro Nunes

Other Decks in Programming

Transcript

  1. - front-end engineer ~4 anos - agile coach - javascript,

    angular.js, tools & workflow @cironunesdev / cironunes.github.io
  2. agenda - olá angular.js - introdução ao mundo ágil -

    user stories - por que testar meu código? - workflow ágil - cart-app
  3. hello world index.html 1. <!doctype html> 2. <html ng-app="frontinbh" >

    3. <head> 4. <meta charset="utf-8"> 5. <title>Hello World</title> 6. </head> 7. <body ng-controller="HelloCtrl" > 8. <p>Hello {{ name }} !</p> 9. <script src="//ajax.(...)/angular.min.js"></script> 10. <script src="app.js"> 11. </body> 12. </html>
  4. 1. angular.module( 'frontinbh' , []) 2. .controller('HelloCtrl' , function( $scope

    ) { 3. $scope.name = 'world'; 4. }); app.js (plunker) hello world
  5. 1. interpretar a user story 2. escrever um teste 3.

    fazer o teste passar 4. refatorar 5. repetir a partir do #2 6. declarar os templates workflow
  6. #1 - como usuário - quero ver a lista de

    produtos - para escolher qual vou comprar - nome, preço, imagem, qtde* - busca pelo nome
  7. #2 - como usuário - quero adicionar produtos no carrinho

    - para saber o valor total da compra - atualizar o carrinho - calcular o valor total da compra
  8. #3 - como usuário - quero remover produtos do carrinho

    - atualizar o carrinho - calcular o valor total da compra
  9. #4 - como usuário - quero finalizar a compra -

    limpar o carrinho - mostrar mensagem de carrinho vazio
  10. - fundamentos do angular.js - introdução aos métodos ágeis -

    um workflow simples e poderoso - incríveis ferramentas - como testar aplicações angular.js com persistência no mongodb o que aprendemos?