Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

WebApps e Frameworks Javascript

1,178 views

Published on

Visão geral sobre frameworks javascript populares e o uso para desenvolvimento de aplicações web ricas.

  • Be the first to comment

  • Be the first to like this

WebApps e Frameworks Javascript

  1. 1. WebApps eFrameworks Javascript por Henrique Netto
  2. 2. Javascript
  3. 3. AprendaJavascriptem 10 dias.
  4. 4. Funcional, Prototipado,e outras coisas
  5. 5. function Account(name) { this.id = this.generateId(); this.name = name;}
  6. 6. function Account(name) { this.id = this.generateId(); this.name = name;} construtor
  7. 7. function Account(name) { this.id = this.generateId(); this.name = name;} construtorAccount.prototype .generateId = function () { return parseInt( Math.random() * 100 ); };
  8. 8. function Account(name) { this.id = this.generateId(); this.name = name;} construtorAccount.prototype .generateId = function () { return parseInt( Math.random() * 100 ); }; métodos da classe
  9. 9. function Account(name) { this.id = this.generateId(); this.name = name;} construtorAccount.prototype .generateId = function () { return parseInt( Math.random() * 100 ); }; métodos da classevar account = new Account(Netto);
  10. 10. A WEB evoluiu.
  11. 11. Normalização por código
  12. 12. Normalização por código
  13. 13. Bibliotecas Javascript
  14. 14. AccDC Foobar.js MooTools Spry frameworkAJS FUEL My Library SylvesterAlly FuncJS Nano SWFObjectAmple SDK Glow Node.js Taffy DBAmplifyJS Google Closure Library Pdf.js Three.jsAngularJS Google Web Toolkit PlotKit typeface.jsArtisan JS iX Framework Plum.js Underscore.jsBanana Banana JS Jelly PottisJS Uize uize.comBackbone.js Joose Processing.js Wakanda FrameworkBlackbird jQuery Prototype WijmoCappuccino jQuery UI Protovis X LibraryClean AJAX jQWidgets PURE YUI Librarycufón JayData Qfox Zeleos web toolkitCupQ jsDraw2D qooxdoo ZreshkD3js jsPHP QuipoJSDatejs JuiceUI RaphaëlDHTMLX JWee JavaScript Rialto ToolkitDojo Toolkit Toolkit RicoDraw2D Kendo UI RSenceEmber.js Knockout scaleAppEaselJS List.js Script.aculo.usEcho Lively Kernel SmartClientEnyo localStorageDB Socket.ioExt JS Microsofts Ajax library SoundManager 2Flot midori SparkFly.js Mochikit SproutCore
  15. 15. Complexidade
  16. 16. Model View Controller (1978)
  17. 17. Model View Presenter (1990)
  18. 18. WebModel View Controller
  19. 19. <HTML>
  20. 20. Model View ViewModel (2006)
  21. 21. Model View *
  22. 22. { "id": 25, "name": "James", "state": "active"}
  23. 23. { "id": 25, "name": "James", "state": "active"}<div id="user-25" class="active"> <span class="name">James</span></div>
  24. 24. { "id": 25, "name": "James", "state": "active"}<div id="user-25" class="active"> <span class="name">James</span></div>
  25. 25. { "id": 25, "name": "James", "state": "active"}<div id="user-25" class="active"> <span class="name">James</span></div>
  26. 26. { "id": 25, "name": "James", "state": "active"}<div id="user-25" class="active"> <span class="name">James</span></div>
  27. 27. { "id": 25, "name": "James", "state": "active"}<div id="user-25" class="active"> <span class="name">James</span></div>
  28. 28. Quando usar?
  29. 29. URL
  30. 30. URL
  31. 31. URL Controle de Histórico app#view app/view (html5)
  32. 32. create POSTread GETupdate PUTdelete DELETE
  33. 33. Spine Knockback.js
  34. 34. Reflexão
  35. 35. Spine
  36. 36. Como escolher?
  37. 37. TodoMVC
  38. 38. Quais pontos analisar?
  39. 39. CapacidadesUsado em ProduçãoDocumentaçãoComunidadeNão-intrusivo
  40. 40. Aplicações WEB são a soma depequenos componentes.
  41. 41. microjs140byt.es
  42. 42. Usar MVC client-side gera 2 code bases
  43. 43. Common JS
  44. 44. NodeJS
  45. 45. Meteor
  46. 46. É saudávelessa quantidade de frameworks?
  47. 47. Obrigado

×