O futuro dos WebApps com

Wilson Mendes@willmendesneto

2.0

Wilson Mendes@willmendesneto

#developer

#opensource

#ThoughtWorker

#GDE AngularJS

Wilson Mendes@willmendesneto

Era uma vez...

Marco inicial: 2009

Primeiro produto: Double Click

Conceitos

Programação: imperativa x declativa

1.0

Projetos

Issues

Pull Requests

++ 1600

Projetos

Issues

Pull Requests

++ 1600

50%

Comunidade

Vem da

Github

DESCOBRIMOS MUITAS COISASBOAS DESDE A CRIAÇÃO DO

ANGULARJS

JS EVERYWHERE

CHROME DEVTOOLS

MOBILE

INTERNET OF THINGS

#codetime

https://github.com/willmendesneto/social-share

ROTAS

NG-ROUTER X UI-ROUTER

https://medium.com/angularjs-meetup-south-london/angular-just-another-introduction-to-ngnewrouter-vs-ui-router-72bfcb228017

INTERNACIONALIZAÇÃO

FORMULÁRIOS

DIRETIVAS

Componentizar sua aplicação tornou-sealgo simples

++ANIMATIONS

Criar e integrar animações para suaaplicação tornou-se algo simples

NÃO QUER COMEÇAR DO ZERO?

Podemos ajudar

;)

Macgyver

Angular-ui

Angularstrap

NgTasty

Keepr

++MODULARIZAÇÃO

angular.modules();

Modularizar é a alma do negócio

Porque não compartilharmos nossosmódulos?

http://bower.io

http://ngmodules.org

APRENDEMOS QUE PROJETOSGRANDES SE PREOCUPAM COM

SEUS USUÁRIOS

NÃO ESCONDEMOS O PROBLEMA

Facilidade para integrar bibliotecasExternas como jQuery, Lodash, Moment e

outras

ONDE PODEMOS MELHORAR

Alterações bruscas sempre são avisadascom antecedência

UPDATES? NO PROBLEM

https://docs.angularjs.org/guide/migration

Projetos grandes precisam de organização

ONDE PODEMOS MELHORAR

John Papa + Todd Motto

=

AngularJs Style guide

Testes são fáceis, mas onde encontro:

Boas práticas?Exemplos?

Dicas?

ONDE PODEMOS MELHORAR

Wilson Mendes + Ciro Nunes

=

AngularJs Testing Recipes

...ainda faltava algo

COMEÇAMOS BEM, MAS...

#WHAT ??

!==

Performance

Injeção de dependência

Facilidade para alterar comportamentos dosbindings

Aprender a sintaxe “like AngularJS”

NOVOS DESAFIOSNOVAS NECESSIDADES

2.0

Removendo dependências externas paramanipulações do DOM

* jQuery/jQlite/etc

MANIPULAÇÃO DE DOM

New router

Correções de bugs das rotas

Nested routers

ROTAS NO ANGULAR 2.0

Melhorias no algoritmo

(DOM virtual? Não utilizamos)

TWO WAY DATA BINDING 2.0

Web Components

Shadow DOM spec

Agora a brincadeira começa a ficar séria

DIRECTIVES 2.0

$scope is the glue

$scope is dead

this is the glue

++Javascript like

$scope

Immutable Data

Estado não pode ser alterado após criação

Thread safe (sem alterações)

Bons para se usar como chave hash

Mori.js

Baseada em ClojureScript’s

Imutabilidade

Immutable.js

Immutable.js fits better with the rest of the JSecosystem in my opinion, because it is designed

for and written in JS, rather than ClojureScript. TheAPI follows the native Array API where possible,

so it's a lot easier to switch between the two.“Lee Byron, Interactive Information Designer at Facebook

Angular-immutable

http://blog.mgechev.com/2015/03/02/immutability-in-angularjs-immutablejs/

Ng immutable data

AngularJS 2.0 vai possuir estrutura de dadosimutáveis e observers por padrão

++performance++render

EM ALGUNS MOMENTOSJAVASCRIPT PODE SE

TORNAR O VILÃO

* Typescript

#codetime

http://angular.io

#obrigado

Wilson Mendes@willmendesneto