emberjs + spa
DESCRIPTION
Apresentação sobre EmberJS e Single Pages Applications (SPA)TRANSCRIPT
![Page 1: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/1.jpg)
EmberJS + SPARodolfo Fadino
![Page 2: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/2.jpg)
![Page 3: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/3.jpg)
Single Page Aplication
![Page 4: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/4.jpg)
Single Page Aplication
![Page 5: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/5.jpg)
Single Page Aplication
![Page 6: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/6.jpg)
Aplicações com uma grande interação client-side (Html5, CSS3 e JavaScript)
Navegação sem refresh Logica da aplicação client-site Carregar dados sobre demanda
Single Page Aplication
![Page 7: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/7.jpg)
Arquitetura
![Page 8: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/8.jpg)
Microsoft◦ Web API◦ Templates◦ Padrões Web => Windows◦ TypeScript◦ Node.JS
ASP.NET Single Page Application
![Page 9: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/9.jpg)
Demo
![Page 10: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/10.jpg)
![Page 11: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/11.jpg)
Biblioteca MVC pattern Core:
◦ TEMPLATES◦ VIEWS◦ CONTROLLERS◦ MODELS◦ ROUTER
Ember.js
![Page 12: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/12.jpg)
Template◦ Handlebars templating language◦ Application user interface.
Model ◦ Application data that it gets from the server
Controller ◦ Stores application state.◦ Present model data to the corresponding templates.
View◦ Translates primitive events from the application◦ and passes these to the controller.
Router ◦ Manages application state◦ URLs and templates in sync.
Ember.js
![Page 13: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/13.jpg)
Scripts em oito camadas:◦webapi_adapter.js, webapi_serializer.js:◦Scripts/helpers.js:◦Scripts/app.js:◦Scripts/app/models/*.js◦Scripts/app/views/*.js◦Scripts/app/controllers/*.js◦Scripts/app/routes, Scripts/app/router.js◦Templates/*.html
Ember.js SPA Template
![Page 14: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/14.jpg)
Models
![Page 15: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/15.jpg)
Models
![Page 16: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/16.jpg)
Models
![Page 17: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/17.jpg)
Models
![Page 18: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/18.jpg)
Views
![Page 19: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/19.jpg)
Controllers
![Page 20: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/20.jpg)
Controllers
![Page 21: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/21.jpg)
Routes
![Page 22: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/22.jpg)
Routes
![Page 23: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/23.jpg)
Templates
![Page 24: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/24.jpg)
Templates
![Page 25: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/25.jpg)
Templates
![Page 26: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/26.jpg)
Demo
![Page 27: EmberJS + SPA](https://reader036.vdocuments.pub/reader036/viewer/2022081413/54800ba7b4af9fc4298b45bf/html5/thumbnails/27.jpg)
have a nice
CODE