SlideShare una empresa de Scribd logo
1 de 26
Descargar para leer sin conexión
Novidades Angular 4 e CLI
Loiane Groner
github.com/loiane
loiane.com
loiane.training
• 10+ XP TI
• Java, JavaScript, Sencha,
Phonegap/Ionic, Angular
• Blog: http://loiane.com
• Cursos: http://loiane.training
• Meus livros:
• Disponível (inglês) na amazon.com.br
• Também em português!!!
https://novatec.com.br/livros/estruturas-de-dados-algoritmos-em-javascript/
▸ Angular 3?
▸ Novidades Angular 4
▸ Novidades Angular CLI
AGENDA
Angular 3 ???
🙄
👍
Angular 4
é uma melhoria do
Angular 2
VERSÃO NOVA A CADA 6 MESES
#itsJustAngular
http://angularjs.blogspot.com.br/2016/12/ok-let-me-explain-its-going-to-be.html
http://angularjs.blogspot.com.br/2016/12/ok-let-me-explain-its-going-to-be.html
O que mudou?
▸ 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
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
ANGULAR UNIVERSAL
https://github.com/robwormald/ng-universal-demo/
ANGULAR CLI
▸ Performance
▸ Mobile (PWA) (Experimental)
▸ Eject (Webpack)
Migrando do 2.x para 4.x
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
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
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
MAIS INFORMAÇÕES
▸ http://angularjs.blogspot.com.br/2017/03/
angular-400-now-available.html
▸ angular.io
http://loiane.training
http://loiane.com
facebook.com/loianegroner
twitter.com/loiane
https://github.com/loiane
youtube.com/loianegroner
http://loiane.training

Más contenido relacionado

La actualidad más candente

Novidades do ASP.NET e do Visual Studio 2013
Novidades do ASP.NET e do Visual Studio 2013Novidades do ASP.NET e do Visual Studio 2013
Novidades do ASP.NET e do Visual Studio 2013
Jiéverson Maissiat
 
SharePoint Fest Chicago 2017 - SharePoint Framework, Angular & Azure Functions
SharePoint Fest Chicago 2017 - SharePoint Framework, Angular & Azure FunctionsSharePoint Fest Chicago 2017 - SharePoint Framework, Angular & Azure Functions
SharePoint Fest Chicago 2017 - SharePoint Framework, Angular & Azure Functions
Sébastien Levert
 

La actualidad más candente (20)

Novidades do ASP.NET e do Visual Studio 2013
Novidades do ASP.NET e do Visual Studio 2013Novidades do ASP.NET e do Visual Studio 2013
Novidades do ASP.NET e do Visual Studio 2013
 
Quick introduction to Angular 4 for AngularJS 1.5 developers
Quick introduction to Angular 4 for AngularJS 1.5 developersQuick introduction to Angular 4 for AngularJS 1.5 developers
Quick introduction to Angular 4 for AngularJS 1.5 developers
 
Angular 4 fronts
Angular 4 frontsAngular 4 fronts
Angular 4 fronts
 
Scala on Rails #rakutentech
Scala on Rails #rakutentechScala on Rails #rakutentech
Scala on Rails #rakutentech
 
Vue.js Component Tools
Vue.js Component ToolsVue.js Component Tools
Vue.js Component Tools
 
Building for, perceiving and measuring performance for mobile web
Building for, perceiving and measuring performance for mobile webBuilding for, perceiving and measuring performance for mobile web
Building for, perceiving and measuring performance for mobile web
 
React Native
React NativeReact Native
React Native
 
TuleapCon2017 -Automating Jenkins build with Tuleap trackers
TuleapCon2017 -Automating Jenkins build with Tuleap trackersTuleapCon2017 -Automating Jenkins build with Tuleap trackers
TuleapCon2017 -Automating Jenkins build with Tuleap trackers
 
SharePoint Fest Chicago 2017 - SharePoint Framework, Angular & Azure Functions
SharePoint Fest Chicago 2017 - SharePoint Framework, Angular & Azure FunctionsSharePoint Fest Chicago 2017 - SharePoint Framework, Angular & Azure Functions
SharePoint Fest Chicago 2017 - SharePoint Framework, Angular & Azure Functions
 
Angular2 + New Firebase in Action
Angular2 + New Firebase in ActionAngular2 + New Firebase in Action
Angular2 + New Firebase in Action
 
Building elements and experiences at Net-A-Porter
Building elements and experiences at Net-A-PorterBuilding elements and experiences at Net-A-Porter
Building elements and experiences at Net-A-Porter
 
Testing Your APIs: Postman, Newman, and Beyond
Testing Your APIs: Postman, Newman, and BeyondTesting Your APIs: Postman, Newman, and Beyond
Testing Your APIs: Postman, Newman, and Beyond
 
What angular 13 will bring to the table
What angular 13 will bring to the table What angular 13 will bring to the table
What angular 13 will bring to the table
 
Message Queues in Ruby - An Overview
Message Queues in Ruby - An OverviewMessage Queues in Ruby - An Overview
Message Queues in Ruby - An Overview
 
IVY: an overview
IVY: an overviewIVY: an overview
IVY: an overview
 
What's New in Angular 4 | Angular 4 Features | Angular 4 Changes | Angular Tu...
What's New in Angular 4 | Angular 4 Features | Angular 4 Changes | Angular Tu...What's New in Angular 4 | Angular 4 Features | Angular 4 Changes | Angular Tu...
What's New in Angular 4 | Angular 4 Features | Angular 4 Changes | Angular Tu...
 
What’s new in angular 12[highlights of angular 12 features]
What’s new in angular 12[highlights of angular 12 features]What’s new in angular 12[highlights of angular 12 features]
What’s new in angular 12[highlights of angular 12 features]
 
Firebase Adventures - Going above and beyond in Realtime
Firebase Adventures - Going above and beyond in RealtimeFirebase Adventures - Going above and beyond in Realtime
Firebase Adventures - Going above and beyond in Realtime
 
The Big Wave of Indian Startups - Almost Effortless Entrepreneurship Using Ruby
The Big Wave of Indian Startups - Almost Effortless Entrepreneurship Using RubyThe Big Wave of Indian Startups - Almost Effortless Entrepreneurship Using Ruby
The Big Wave of Indian Startups - Almost Effortless Entrepreneurship Using Ruby
 
Angular Routing - Angular Hack Day Melbourne 2019
Angular Routing - Angular Hack Day Melbourne 2019Angular Routing - Angular Hack Day Melbourne 2019
Angular Routing - Angular Hack Day Melbourne 2019
 

Destacado

[Curso Java Basico] Aula 21: For Each (for melhorado)
[Curso Java Basico] Aula 21: For Each (for melhorado)[Curso Java Basico] Aula 21: For Each (for melhorado)
[Curso Java Basico] Aula 21: For Each (for melhorado)
Loiane Groner
 
Apresentação Competições
Apresentação CompetiçõesApresentação Competições
Apresentação Competições
Loiane Groner
 
PHP e componentes reutilizáveis
PHP e componentes reutilizáveisPHP e componentes reutilizáveis
PHP e componentes reutilizáveis
elliando dias
 
Preparando o Ambiente para Desenvolver em iOS (iPhone e iPad)
Preparando o Ambiente para Desenvolver em iOS (iPhone e iPad)Preparando o Ambiente para Desenvolver em iOS (iPhone e iPad)
Preparando o Ambiente para Desenvolver em iOS (iPhone e iPad)
Loiane Groner
 

Destacado (20)

Angular 2
Angular 2Angular 2
Angular 2
 
How to Become a Thought Leader in Your Niche
How to Become a Thought Leader in Your NicheHow to Become a Thought Leader in Your Niche
How to Become a Thought Leader in Your Niche
 
[Curso Java Básico] Exercícios Aulas 11 12 13
[Curso Java Básico] Exercícios Aulas 11 12 13[Curso Java Básico] Exercícios Aulas 11 12 13
[Curso Java Básico] Exercícios Aulas 11 12 13
 
Introducao ao Ionic 2 na pratica
Introducao ao Ionic 2 na praticaIntroducao ao Ionic 2 na pratica
Introducao ao Ionic 2 na pratica
 
Iniciando com desenvolvimento híbrido de aplicações mobile com HTML5
Iniciando com desenvolvimento híbrido de aplicações mobile com HTML5Iniciando com desenvolvimento híbrido de aplicações mobile com HTML5
Iniciando com desenvolvimento híbrido de aplicações mobile com HTML5
 
Campus Party Brasil 2017: Angular 2 #cpbr10
Campus Party Brasil 2017: Angular 2 #cpbr10Campus Party Brasil 2017: Angular 2 #cpbr10
Campus Party Brasil 2017: Angular 2 #cpbr10
 
Exercicios Pilhas (Stacks) - Estruturas de dados e algoritmos com Java
Exercicios Pilhas (Stacks) - Estruturas de dados e algoritmos com JavaExercicios Pilhas (Stacks) - Estruturas de dados e algoritmos com Java
Exercicios Pilhas (Stacks) - Estruturas de dados e algoritmos com Java
 
[Curso Java Basico] Exercicios Aula 20
[Curso Java Basico] Exercicios Aula 20[Curso Java Basico] Exercicios Aula 20
[Curso Java Basico] Exercicios Aula 20
 
[Curso Java Basico] Exercicios Aulas 14 15
[Curso Java Basico] Exercicios Aulas 14 15[Curso Java Basico] Exercicios Aulas 14 15
[Curso Java Basico] Exercicios Aulas 14 15
 
Exercicios Vetores (Arrays) - Estruturas de dados e algoritmos com Java
Exercicios Vetores (Arrays) - Estruturas de dados e algoritmos com JavaExercicios Vetores (Arrays) - Estruturas de dados e algoritmos com Java
Exercicios Vetores (Arrays) - Estruturas de dados e algoritmos com Java
 
[Curso Java Basico] Exercicios Aula 19
[Curso Java Basico] Exercicios Aula 19[Curso Java Basico] Exercicios Aula 19
[Curso Java Basico] Exercicios Aula 19
 
[Curso Java Basico] Aula 21: For Each (for melhorado)
[Curso Java Basico] Aula 21: For Each (for melhorado)[Curso Java Basico] Aula 21: For Each (for melhorado)
[Curso Java Basico] Aula 21: For Each (for melhorado)
 
[Curso Java Basico - Orientacao a Objetos] Aula 36: Relacionamento tem um
[Curso Java Basico - Orientacao a Objetos] Aula 36: Relacionamento tem um[Curso Java Basico - Orientacao a Objetos] Aula 36: Relacionamento tem um
[Curso Java Basico - Orientacao a Objetos] Aula 36: Relacionamento tem um
 
Apresentação Competições
Apresentação CompetiçõesApresentação Competições
Apresentação Competições
 
Conquistando seu lugar ao sol
Conquistando seu lugar ao solConquistando seu lugar ao sol
Conquistando seu lugar ao sol
 
PHP e componentes reutilizáveis
PHP e componentes reutilizáveisPHP e componentes reutilizáveis
PHP e componentes reutilizáveis
 
Preparando o Ambiente para Desenvolver em Android
Preparando o Ambiente para Desenvolver em AndroidPreparando o Ambiente para Desenvolver em Android
Preparando o Ambiente para Desenvolver em Android
 
Preparando o Ambiente para Desenvolver em iOS (iPhone e iPad)
Preparando o Ambiente para Desenvolver em iOS (iPhone e iPad)Preparando o Ambiente para Desenvolver em iOS (iPhone e iPad)
Preparando o Ambiente para Desenvolver em iOS (iPhone e iPad)
 
Vi Editor Cheat Sheet
Vi Editor Cheat SheetVi Editor Cheat Sheet
Vi Editor Cheat Sheet
 
Sencha touch
Sencha touchSencha touch
Sencha touch
 

Similar a Novidades Angular 4.x e CLI

Angular js introduction and learning resources
Angular js introduction and learning resourcesAngular js introduction and learning resources
Angular js introduction and learning resources
Wei-Lin Chen
 

Similar a Novidades Angular 4.x e CLI (20)

AngularJs advanced Topics
AngularJs advanced TopicsAngularJs advanced Topics
AngularJs advanced Topics
 
Angular4 tutorial
Angular4 tutorialAngular4 tutorial
Angular4 tutorial
 
SMX Munich 2018 - Current State of JavaScript SEO
SMX Munich 2018 - Current State of JavaScript SEOSMX Munich 2018 - Current State of JavaScript SEO
SMX Munich 2018 - Current State of JavaScript SEO
 
Angular for rookies MS TechDays 2017
Angular for rookies MS TechDays 2017Angular for rookies MS TechDays 2017
Angular for rookies MS TechDays 2017
 
Front-end for Java developers Devoxx France 2018
Front-end for Java developers Devoxx France 2018Front-end for Java developers Devoxx France 2018
Front-end for Java developers Devoxx France 2018
 
Popularity career growth and salary of angular covered in an angular certifi...
Popularity career growth and salary  of angular covered in an angular certifi...Popularity career growth and salary  of angular covered in an angular certifi...
Popularity career growth and salary of angular covered in an angular certifi...
 
Brief introduction to Angular 2.0 & 4.0
Brief introduction to Angular 2.0 & 4.0Brief introduction to Angular 2.0 & 4.0
Brief introduction to Angular 2.0 & 4.0
 
Introduction to angular 2
Introduction to angular 2Introduction to angular 2
Introduction to angular 2
 
What’s new in Angular 5 JavaScript Framework?
What’s new in Angular 5 JavaScript Framework?What’s new in Angular 5 JavaScript Framework?
What’s new in Angular 5 JavaScript Framework?
 
Evolution and History of Angular as Web Development Platform.pdf
Evolution and History of Angular as Web Development Platform.pdfEvolution and History of Angular as Web Development Platform.pdf
Evolution and History of Angular as Web Development Platform.pdf
 
Angular Js Advantages - Complete Reference
Angular Js Advantages - Complete ReferenceAngular Js Advantages - Complete Reference
Angular Js Advantages - Complete Reference
 
Deep crawl the chaotic landscape of JavaScript
Deep crawl the chaotic landscape of JavaScript Deep crawl the chaotic landscape of JavaScript
Deep crawl the chaotic landscape of JavaScript
 
Introduction to Angular 2
Introduction to Angular 2Introduction to Angular 2
Introduction to Angular 2
 
Meetup AngularJS Rio - Testes e2e para apps AngularJS com Protractor
Meetup AngularJS Rio - Testes e2e para apps AngularJS com ProtractorMeetup AngularJS Rio - Testes e2e para apps AngularJS com Protractor
Meetup AngularJS Rio - Testes e2e para apps AngularJS com Protractor
 
El viaje de Angular1 a Angular2
El viaje de Angular1 a Angular2El viaje de Angular1 a Angular2
El viaje de Angular1 a Angular2
 
Heading towards the great release of angular 8.0 development observe the uno...
Heading towards the great release of angular 8.0 development  observe the uno...Heading towards the great release of angular 8.0 development  observe the uno...
Heading towards the great release of angular 8.0 development observe the uno...
 
Angular 1.X Community and API Decissions
Angular 1.X Community and API DecissionsAngular 1.X Community and API Decissions
Angular 1.X Community and API Decissions
 
Angular js introduction and learning resources
Angular js introduction and learning resourcesAngular js introduction and learning resources
Angular js introduction and learning resources
 
What’s New in Angular 14?
What’s New in Angular 14?What’s New in Angular 14?
What’s New in Angular 14?
 
Angular, the New Angular JS
Angular, the New Angular JSAngular, the New Angular JS
Angular, the New Angular JS
 

Último

Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Victor Rentea
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Victor Rentea
 

Último (20)

Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
 
Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
 
Six Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal OntologySix Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal Ontology
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodPolkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
 
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistan
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 

Novidades Angular 4.x e CLI