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

Desenvolvimento ágil com AngularJS

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on.

Desenvolvimento ágil com AngularJS

Avatar for Ciro Nunes

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?