AngularJS, Angular 2 e Ionic: Casos de Uso

Slide 1

Slide 1 text

Caso de Uso Paulo Heber Gentilin @hgentillin [email protected] TS ionic 2 AngularJS 2 TypeScript & &

Slide 2

Slide 2 text

Accurate Software Parceira ORACLE ● Oracle Platinum Partner ● Oracle Excellence Award - 2015 Serviços ● Oracle Fusion Middleware - SOA, BPM, Portais & Conteúdos ● Projetos e-Commerce em Java e .Net ● BI e Data Warehouse multi vendor, com foco em SAS

Slide 3

Slide 3 text

Caso de Uso I - AngularJS + Spring Caso de Uso II - Angular2 + ionic 2

Slide 4

Slide 4 text

> Caso de Uso I - AngularJS + Spring Caso de Uso II - Angular2 + ionic 2

Slide 5

Slide 5 text

Cliente

Slide 6

Slide 6 text

Arquitetura restful Web Service SOA

Slide 7

Slide 7 text

Aprendizado

Slide 8

Slide 8 text

Lições Aprendidas ● Regras de negócio na camada do cliente ● Queda de performance na manipulação de grandes arrays ● Produtividade ● Encapsulamento, melhora o design do software

Slide 9

Slide 9 text

Caso de Uso I - AngularJS + Spring > Caso de Uso II - Angular2 + ionic 2

Slide 10

Slide 10 text

Cliente

Slide 11

Slide 11 text

Arquitetura restful Web Service 2

Slide 12

Slide 12 text

Novas Tecnologias & Conceitos TS

Slide 13

Slide 13 text

Pontos Principais em relação ao AngularJS 1 ● 5x mais rápido ● orientado a componentes ● melhor produtividade ● bootstrap diferente de acordo com a arquitetura (mobile ou desktop) ● sintaxe parecida ao .Net e Java (TypeScript) ● novas features a cada versão (até a versão oficial) ● lançamento recente (bugs) ● pouco know how da comunidade e consequentemente poucos plugins ● curva de aprendizado maior, devido as tecnologias envolvidas

Slide 14

Slide 14 text

Algumas Diferenças function ($scope) { $scope.evento = “Caso de Uso em AngularJS” } constructor () { this.evento = “Caso de Uso em Angularjs”; } AngularJS 1 AngularJS 2 $scope this

Slide 15

Slide 15 text

1. @Component({ 2. selector: IndexContent' 3. }) 4. @View({ 5. templateUrl: './components/example/IndexContent.ht ml' 6. }) 7. export class IndexContent { 8. constructor () { 9. this.conteudo = “Contéudo”; 10. } 11. } Algumas Diferenças controllers components AngularJS 2

angular.module('myApp', []).controller('IndexController', ['$scope', function ($scope) { $scope.conteudo = 'Conteúdo'; }]); AngularJS 1