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 COISAS
BOAS 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-se
algo simples
++ANIMATIONS
Criar e integrar animações para sua
aplicaçã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 nossos
módulos?
http://bower.io
http://ngmodules.org
APRENDEMOS QUE PROJETOS
GRANDES SE PREOCUPAM COM
SEUS USUÁRIOS
NÃO ESCONDEMOS O PROBLEMA
Facilidade para integrar bibliotecas
Externas como jQuery, Lodash, Moment e
outras
ONDE PODEMOS MELHORAR
Alterações bruscas sempre são avisadas
com 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 dos
bindings
Aprender a sintaxe “like AngularJS”
NOVOS DESAFIOS
NOVAS NECESSIDADES
2.0
Removendo dependências externas para
manipulaçõ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 JS
ecosystem in my opinion, because it is designed
for and written in JS, rather than ClojureScript. The
API 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 dados
imutáveis e observers por padrão
++performance
++render
EM ALGUNS MOMENTOS
JAVASCRIPT PODE SE
TORNAR O VILÃO
* Typescript
#codetime
http://angular.io
#obrigado
Wilson Mendes
@willmendesneto

O futuro dos WebApps com AngularJS 2.0