The document discusses the new features of Angular 4 and the Angular CLI. It provides an overview of updates in Angular 4 including improvements to NgIf and NgFor, form validations, and new animations and universal modules. It also discusses changes in TypeScript and the Angular CLI, including performance improvements and support for Progressive Web Apps. Finally, it provides instructions for migrating projects from Angular 2 to Angular 4.

1. Novidades Angular 4 e CLI
Loiane Groner
github.com/loiane
loiane.com
loiane.training

2. • 10+ XP TI
• Java, JavaScript, Sencha,
Phonegap/Ionic, Angular
• Blog: http://loiane.com
• Cursos: http://loiane.training

3. • Meus livros:
• Disponível (inglês) na amazon.com.br

4. • Também em português!!!
https://novatec.com.br/livros/estruturas-de-dados-algoritmos-em-javascript/

5. ▸ Angular 3?
▸ Novidades Angular 4
▸ Novidades Angular CLI
AGENDA

6. Angular 3 ???

7. 🙄

8. 👍

9. Angular 4
é uma melhoria do
Angular 2

10. VERSÃO NOVA A CADA 6 MESES

11. #itsJustAngular

12. http://angularjs.blogspot.com.br/2016/12/ok-let-me-explain-its-going-to-be.html

13. http://angularjs.blogspot.com.br/2016/12/ok-let-me-explain-its-going-to-be.html

14. O que mudou?

15. ▸ NgIf e NgFor melhorado
▸ Validações para Formulários
▸ Renderer (depreciado)
▸ Novo Módulo de animações (depreciado)
▸ TypeScript 2.1
▸ Angular Universal
▸ Build menor e mais rápido
NOVIDADES E MUDANÇAS

16. TYPESCRIPT 1.8 -> 2.1
▸ Support for Mix-in classes
▸ object type
▸ Support for new.target
▸ Better checking for null/
undefined in operands of
expressions
▸ Dotted property for types with
string index signatures
▸ keyof and Lookup Types
▸ Mapped Types
▸ Partial, Readonly, Record, and
Pick
▸ Object Spread and Rest
▸ Downlevel Async Functions
▸ Support for external helpers
library (tslib)
▸ Untyped imports
▸ Support for --target ES2016, --
target ES2017 and --target
ESNext
▸ Improved any Inference
▸ Implicit any errors
▸ Better inference for literal types
https://github.com/Microsoft/TypeScript/wiki/What%27s-new-in-TypeScript

17. ANGULAR UNIVERSAL
https://github.com/robwormald/ng-universal-demo/

18. ANGULAR CLI
▸ Performance
▸ Mobile (PWA) (Experimental)
▸ Eject (Webpack)

19. Migrando do 2.x para 4.x

20. MIGRANDO DO 2.X -> 4.X
> npm install @angular/{common,compiler,compiler-
cli,core,forms,http,platform-browser,platform-
browser-dynamic,platform-server,router,animations}
@latest typescript@latest --save
▸ Linux ou Mac OS

21. MIGRANDO DO 2.X -> 4.X
> npm install @angular/common@latest @angular/
compiler@latest @angular/compiler-cli@latest
@angular/core@latest @angular/forms@latest @angular/
http@latest @angular/platform-browser@latest
@angular/platform-browser-dynamic@latest @angular/
platform-server@latest @angular/router@latest
@angular/animations@latest typescript@latest --save
▸ Windows

22. SE CRIOU PROJETO COM CLI (BETA)
▸ Criar um branch (git) nova
▸ Criar um projeto com CLI (final) novo
▸ Copiar do antigo projeto para o novo projeto:
▸ diretório src/app
▸ configs de scripts e styles do .angular-cli.json
▸ Verificar index.html para import de css ou fontes
▸ Verificar arquivo styles.css

23. MAIS INFORMAÇÕES
▸ http://angularjs.blogspot.com.br/2017/03/
angular-400-now-available.html
▸ angular.io

24. http://loiane.training

26. http://loiane.com
facebook.com/loianegroner
twitter.com/loiane
https://github.com/loiane
youtube.com/loianegroner
http://loiane.training