Your SlideShare is downloading. ×
0
WebApps eFrameworks Javascript     por Henrique Netto
Javascript
AprendaJavascriptem 10 dias.
Funcional, Prototipado,e outras coisas
function Account(name) {  this.id = this.generateId();  this.name = name;}
function Account(name) {  this.id = this.generateId();  this.name = name;}                             construtor
function Account(name) {  this.id = this.generateId();  this.name = name;}                             construtorAccount.p...
function Account(name) {  this.id = this.generateId();  this.name = name;}                             construtorAccount.p...
function Account(name) {  this.id = this.generateId();  this.name = name;}                             construtorAccount.p...
A WEB evoluiu.
Normalização por código
Normalização por código
Bibliotecas Javascript
AccDC              Foobar.js                  MooTools          Spry frameworkAJS                FUEL                     ...
Complexidade
Model View Controller        (1978)
Model View Presenter        (1990)
WebModel View Controller
<HTML>
Model View ViewModel        (2006)
Model View *
{    "id": 25,    "name": "James",    "state": "active"}
{    "id": 25,    "name": "James",    "state": "active"}<div id="user-25" class="active">  <span class="name">James</span>...
{    "id": 25,    "name": "James",    "state": "active"}<div id="user-25" class="active">  <span class="name">James</span>...
{    "id": 25,    "name": "James",    "state": "active"}<div id="user-25" class="active">  <span class="name">James</span>...
{    "id": 25,    "name": "James",    "state": "active"}<div id="user-25" class="active">  <span class="name">James</span>...
{    "id": 25,    "name": "James",    "state": "active"}<div id="user-25" class="active">  <span class="name">James</span>...
Quando usar?
URL
URL
URL      Controle de Histórico        app#view        app/view (html5)
create   POSTread     GETupdate   PUTdelete   DELETE
Spine        Knockback.js
Reflexão
Spine
Como escolher?
TodoMVC
Quais pontos analisar?
CapacidadesUsado em ProduçãoDocumentaçãoComunidadeNão-intrusivo
Aplicações WEB    são a soma depequenos componentes.
microjs140byt.es
Usar MVC client-side gera 2 code bases
Common JS
NodeJS
Meteor
É saudávelessa quantidade de   frameworks?
Obrigado
WebApps e Frameworks Javascript
WebApps e Frameworks Javascript
WebApps e Frameworks Javascript
WebApps e Frameworks Javascript
WebApps e Frameworks Javascript
WebApps e Frameworks Javascript
WebApps e Frameworks Javascript
WebApps e Frameworks Javascript
WebApps e Frameworks Javascript
Upcoming SlideShare
Loading in...5
×

WebApps e Frameworks Javascript

784

Published on

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

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
784
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
14
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "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
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×