SlideShare a Scribd company logo
ANGULARJSTO ANGULAR 2
Alicia Guerra
alicia.developer@aliciaguerra.com
What is Angular 2?
■ A development platform for
building mobile and desktop
web applications.
■ Not a version update of
AngularJS, but a complete
rewrite.
■ Moved into Beta in December
2015, first release candidate was
published May 2016.
How is Angular 2 Different From AngularJS?
■ Mobile Development
■ Modern
■ Component-Based
■ TypeScript
■ Improved Dependency Injection
■ Dynamic Loading
■ AsynchronousTemplate
Compilation
■ Diary.js Logging
What isTypeScript?
■ Free and open-source programming
language.
■ Developed and maintained by
Microsoft.
■ Strict superset of JavaScript.
■ First made public in October 2012.
■ Supported on IDEs.
How isTypeScript Different from JavaScript?
■ Type Annotations
■ Declaration Files
■ Classes
■ Generics
■ Namespaces
■ Tuples
AngularJS to Angular 2
Angular 2 Migration Plan
■ 1. Use Style Guide
■ 2. Update to LatestVersion of Angular 1
■ 3. All New DevelopmentWith Components
■ 4. Switch Controllers to Components
■ 5. Switch Component Directives to Components
■ 6. Switch Component Directives to Components
■ 7. Implement Manual Bootstrapping
■ 8. AddTypeScript and a Build
■ 9. Start Using ES6
■ 10. Switch Controllers to ES6 Classes
■ 11. Switch Services to ES6 Classes
Contact Me
Alicia Guerra
Email: alicia.developer@aliciaguerra.com
Twitter: @skepchick92

More Related Content

What's hot (20)

How do we test nodejs apps?
How do we test nodejs apps?
Michal Juhas
 
Publishing Android Wear 2.0 Apps
Publishing Android Wear 2.0 Apps
Kenichi Kambara
 
Ionic 2 - Introduction
Ionic 2 - Introduction
Stiliyan Kanchev
 
Android O (Picture In Picture)入門+実装例
Android O (Picture In Picture)入門+実装例
Kenichi Kambara
 
Android O (Beta) Topics
Android O (Beta) Topics
Kenichi Kambara
 
45 Tools to Boost Your Front-End
45 Tools to Boost Your Front-End
Nicolas PENNEC
 
Continuous integration for androids
Continuous integration for androids
Kirill Zotin
 
Android build process (1)
Android build process (1)
Shubham Goyal
 
Continuous delivery journey - Montgomery county JUG
Continuous delivery journey - Montgomery county JUG
Raphaël Brugier
 
Agile coding dojo session #3 (2014 09-20)
Agile coding dojo session #3 (2014 09-20)
Lê Trọng-Hiệp
 
JavaScript - The Universal Platform?
JavaScript - The Universal Platform?
Jonas Bandi
 
Introducing Ubuntu SDK
Introducing Ubuntu SDK
Shuduo Sang
 
Getting Started With AngularJS
Getting Started With AngularJS
Omnia Helmi
 
Groovy on Android (as of 2016)
Groovy on Android (as of 2016)
Kevin H.A. Tan
 
React Typescript for beginners: Translator app with Microsoft cognitive services
React Typescript for beginners: Translator app with Microsoft cognitive services
Fabio Biondi
 
My experience as Eclipse Contributor - ECE 2015
My experience as Eclipse Contributor - ECE 2015
Patrik Suzzi
 
TypeScript Presentation
TypeScript Presentation
Patrick John Pacaña
 
TDD with Python and App Engine
TDD with Python and App Engine
Ricardo Bánffy
 
Gwt kickoff - Alberto Mancini & Francesca Tosi
Gwt kickoff - Alberto Mancini & Francesca Tosi
firenze-gtug
 
React Nativeアプリをリリースし続けるために、最初に行う8つの取り組み
React Nativeアプリをリリースし続けるために、最初に行う8つの取り組み
Yukiya Nakagawa
 
How do we test nodejs apps?
How do we test nodejs apps?
Michal Juhas
 
Publishing Android Wear 2.0 Apps
Publishing Android Wear 2.0 Apps
Kenichi Kambara
 
Android O (Picture In Picture)入門+実装例
Android O (Picture In Picture)入門+実装例
Kenichi Kambara
 
45 Tools to Boost Your Front-End
45 Tools to Boost Your Front-End
Nicolas PENNEC
 
Continuous integration for androids
Continuous integration for androids
Kirill Zotin
 
Android build process (1)
Android build process (1)
Shubham Goyal
 
Continuous delivery journey - Montgomery county JUG
Continuous delivery journey - Montgomery county JUG
Raphaël Brugier
 
Agile coding dojo session #3 (2014 09-20)
Agile coding dojo session #3 (2014 09-20)
Lê Trọng-Hiệp
 
JavaScript - The Universal Platform?
JavaScript - The Universal Platform?
Jonas Bandi
 
Introducing Ubuntu SDK
Introducing Ubuntu SDK
Shuduo Sang
 
Getting Started With AngularJS
Getting Started With AngularJS
Omnia Helmi
 
Groovy on Android (as of 2016)
Groovy on Android (as of 2016)
Kevin H.A. Tan
 
React Typescript for beginners: Translator app with Microsoft cognitive services
React Typescript for beginners: Translator app with Microsoft cognitive services
Fabio Biondi
 
My experience as Eclipse Contributor - ECE 2015
My experience as Eclipse Contributor - ECE 2015
Patrik Suzzi
 
TDD with Python and App Engine
TDD with Python and App Engine
Ricardo Bánffy
 
Gwt kickoff - Alberto Mancini & Francesca Tosi
Gwt kickoff - Alberto Mancini & Francesca Tosi
firenze-gtug
 
React Nativeアプリをリリースし続けるために、最初に行う8つの取り組み
React Nativeアプリをリリースし続けるために、最初に行う8つの取り組み
Yukiya Nakagawa
 

Viewers also liked (12)

2000 2010
2000 2010
Enfants de l'Espoir
 
Regiones culturales de Panamá.
Regiones culturales de Panamá.
Karla Guerra
 
React Native
React Native
Alicia G
 
Beneficial Role Of Dietary Phytoestrogens In Obesity And Diabetes
Beneficial Role Of Dietary Phytoestrogens In Obesity And Diabetes
gratisyokel741
 
AQP 2011
AQP 2011
Enfants de l'Espoir
 
Ciberassetjament
Ciberassetjament
elreflejodetimismo
 
Battery Maintenance Management
Battery Maintenance Management
Alvaro Palacios
 
DocSet.ECM - Integrated Document Management for SAP and SharePoint
DocSet.ECM - Integrated Document Management for SAP and SharePoint
IntelliDocX
 
Universidad Central del Ecuador Posesivos
Universidad Central del Ecuador Posesivos
Vanne
 
effects of Oxidation in daily life
effects of Oxidation in daily life
Bhawna Vohra
 
Regiones culturales de Panamá.
Regiones culturales de Panamá.
Karla Guerra
 
React Native
React Native
Alicia G
 
Beneficial Role Of Dietary Phytoestrogens In Obesity And Diabetes
Beneficial Role Of Dietary Phytoestrogens In Obesity And Diabetes
gratisyokel741
 
Battery Maintenance Management
Battery Maintenance Management
Alvaro Palacios
 
DocSet.ECM - Integrated Document Management for SAP and SharePoint
DocSet.ECM - Integrated Document Management for SAP and SharePoint
IntelliDocX
 
Universidad Central del Ecuador Posesivos
Universidad Central del Ecuador Posesivos
Vanne
 
effects of Oxidation in daily life
effects of Oxidation in daily life
Bhawna Vohra
 
Ad

Similar to AngularJS to Angular 2 (20)

Angular 2
Angular 2
Travis van der Font
 
Angular2 tutorial
Angular2 tutorial
HarikaReddy115
 
Angular.ppt
Angular.ppt
Mytrux1
 
Angular 2 with typescript
Angular 2 with typescript
Tayseer_Emam
 
New World of Angular (v2+)
New World of Angular (v2+)
Rahat Khanna a.k.a mAppMechanic
 
Adventures with Angular 2
Adventures with Angular 2
Dragos Ionita
 
Angular
Angular
Mouad EL Fakir
 
5 Key Benefits of Migration
5 Key Benefits of Migration
Happiest Minds Technologies
 
Moving From AngularJS to Angular 2
Moving From AngularJS to Angular 2
Exilesoft
 
Angular
Angular
TejinderMakkar
 
Angular 2... so can I use it now??
Angular 2... so can I use it now??
Laurent Duveau
 
Migrating an Application from Angular 1 to Angular 2
Migrating an Application from Angular 1 to Angular 2
Ross Dederer
 
Reason to choose Angular JS for your Web Application
Reason to choose Angular JS for your Web Application
Priyanka Verma
 
Angular 2 interview questions and answers
Angular 2 interview questions and answers
Anil Singh
 
Angular 2.0
Angular 2.0
Mallikarjuna G D
 
An afternoon with angular 2
An afternoon with angular 2
Mike Melusky
 
Dive into Angular, part 4: Angular 2.0
Dive into Angular, part 4: Angular 2.0
Oleksii Prohonnyi
 
Angular, the New Angular JS
Angular, the New Angular JS
Kenzan
 
Angular2
Angular2
Oswald Campesato
 
The advantage of developing with TypeScript
The advantage of developing with TypeScript
Corley S.r.l.
 
Angular.ppt
Angular.ppt
Mytrux1
 
Angular 2 with typescript
Angular 2 with typescript
Tayseer_Emam
 
Adventures with Angular 2
Adventures with Angular 2
Dragos Ionita
 
Moving From AngularJS to Angular 2
Moving From AngularJS to Angular 2
Exilesoft
 
Angular 2... so can I use it now??
Angular 2... so can I use it now??
Laurent Duveau
 
Migrating an Application from Angular 1 to Angular 2
Migrating an Application from Angular 1 to Angular 2
Ross Dederer
 
Reason to choose Angular JS for your Web Application
Reason to choose Angular JS for your Web Application
Priyanka Verma
 
Angular 2 interview questions and answers
Angular 2 interview questions and answers
Anil Singh
 
An afternoon with angular 2
An afternoon with angular 2
Mike Melusky
 
Dive into Angular, part 4: Angular 2.0
Dive into Angular, part 4: Angular 2.0
Oleksii Prohonnyi
 
Angular, the New Angular JS
Angular, the New Angular JS
Kenzan
 
The advantage of developing with TypeScript
The advantage of developing with TypeScript
Corley S.r.l.
 
Ad

Recently uploaded (20)

cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
AmirStern2
 
Providing an OGC API Processes REST Interface for FME Flow
Providing an OGC API Processes REST Interface for FME Flow
Safe Software
 
Oracle Cloud and AI Specialization Program
Oracle Cloud and AI Specialization Program
VICTOR MAESTRE RAMIREZ
 
PyData - Graph Theory for Multi-Agent Integration
PyData - Graph Theory for Multi-Agent Integration
barqawicloud
 
Murdledescargadarkweb.pdfvolumen1 100 elementary
Murdledescargadarkweb.pdfvolumen1 100 elementary
JorgeSemperteguiMont
 
MuleSoft for AgentForce : Topic Center and API Catalog
MuleSoft for AgentForce : Topic Center and API Catalog
shyamraj55
 
Agentic AI: Beyond the Buzz- LangGraph Studio V2
Agentic AI: Beyond the Buzz- LangGraph Studio V2
Shashikant Jagtap
 
Floods in Valencia: Two FME-Powered Stories of Data Resilience
Floods in Valencia: Two FME-Powered Stories of Data Resilience
Safe Software
 
FIDO Seminar: Authentication for a Billion Consumers - Amazon.pptx
FIDO Seminar: Authentication for a Billion Consumers - Amazon.pptx
FIDO Alliance
 
Your startup on AWS - How to architect and maintain a Lean and Mean account J...
Your startup on AWS - How to architect and maintain a Lean and Mean account J...
angelo60207
 
Bridging the divide: A conversation on tariffs today in the book industry - T...
Bridging the divide: A conversation on tariffs today in the book industry - T...
BookNet Canada
 
“Why It’s Critical to Have an Integrated Development Methodology for Edge AI,...
“Why It’s Critical to Have an Integrated Development Methodology for Edge AI,...
Edge AI and Vision Alliance
 
Introduction to Typescript - GDG On Campus EUE
Introduction to Typescript - GDG On Campus EUE
Google Developer Group On Campus European Universities in Egypt
 
Down the Rabbit Hole – Solving 5 Training Roadblocks
Down the Rabbit Hole – Solving 5 Training Roadblocks
Rustici Software
 
Integration of Utility Data into 3D BIM Models Using a 3D Solids Modeling Wor...
Integration of Utility Data into 3D BIM Models Using a 3D Solids Modeling Wor...
Safe Software
 
FME for Good: Integrating Multiple Data Sources with APIs to Support Local Ch...
FME for Good: Integrating Multiple Data Sources with APIs to Support Local Ch...
Safe Software
 
FIDO Seminar: New Data: Passkey Adoption in the Workforce.pptx
FIDO Seminar: New Data: Passkey Adoption in the Workforce.pptx
FIDO Alliance
 
Analysis of the changes in the attitude of the news comments caused by knowin...
Analysis of the changes in the attitude of the news comments caused by knowin...
Matsushita Laboratory
 
vertical-cnc-processing-centers-drillteq-v-200-en.pdf
vertical-cnc-processing-centers-drillteq-v-200-en.pdf
AmirStern2
 
Edge-banding-machines-edgeteq-s-200-en-.pdf
Edge-banding-machines-edgeteq-s-200-en-.pdf
AmirStern2
 
cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
AmirStern2
 
Providing an OGC API Processes REST Interface for FME Flow
Providing an OGC API Processes REST Interface for FME Flow
Safe Software
 
Oracle Cloud and AI Specialization Program
Oracle Cloud and AI Specialization Program
VICTOR MAESTRE RAMIREZ
 
PyData - Graph Theory for Multi-Agent Integration
PyData - Graph Theory for Multi-Agent Integration
barqawicloud
 
Murdledescargadarkweb.pdfvolumen1 100 elementary
Murdledescargadarkweb.pdfvolumen1 100 elementary
JorgeSemperteguiMont
 
MuleSoft for AgentForce : Topic Center and API Catalog
MuleSoft for AgentForce : Topic Center and API Catalog
shyamraj55
 
Agentic AI: Beyond the Buzz- LangGraph Studio V2
Agentic AI: Beyond the Buzz- LangGraph Studio V2
Shashikant Jagtap
 
Floods in Valencia: Two FME-Powered Stories of Data Resilience
Floods in Valencia: Two FME-Powered Stories of Data Resilience
Safe Software
 
FIDO Seminar: Authentication for a Billion Consumers - Amazon.pptx
FIDO Seminar: Authentication for a Billion Consumers - Amazon.pptx
FIDO Alliance
 
Your startup on AWS - How to architect and maintain a Lean and Mean account J...
Your startup on AWS - How to architect and maintain a Lean and Mean account J...
angelo60207
 
Bridging the divide: A conversation on tariffs today in the book industry - T...
Bridging the divide: A conversation on tariffs today in the book industry - T...
BookNet Canada
 
“Why It’s Critical to Have an Integrated Development Methodology for Edge AI,...
“Why It’s Critical to Have an Integrated Development Methodology for Edge AI,...
Edge AI and Vision Alliance
 
Down the Rabbit Hole – Solving 5 Training Roadblocks
Down the Rabbit Hole – Solving 5 Training Roadblocks
Rustici Software
 
Integration of Utility Data into 3D BIM Models Using a 3D Solids Modeling Wor...
Integration of Utility Data into 3D BIM Models Using a 3D Solids Modeling Wor...
Safe Software
 
FME for Good: Integrating Multiple Data Sources with APIs to Support Local Ch...
FME for Good: Integrating Multiple Data Sources with APIs to Support Local Ch...
Safe Software
 
FIDO Seminar: New Data: Passkey Adoption in the Workforce.pptx
FIDO Seminar: New Data: Passkey Adoption in the Workforce.pptx
FIDO Alliance
 
Analysis of the changes in the attitude of the news comments caused by knowin...
Analysis of the changes in the attitude of the news comments caused by knowin...
Matsushita Laboratory
 
vertical-cnc-processing-centers-drillteq-v-200-en.pdf
vertical-cnc-processing-centers-drillteq-v-200-en.pdf
AmirStern2
 
Edge-banding-machines-edgeteq-s-200-en-.pdf
Edge-banding-machines-edgeteq-s-200-en-.pdf
AmirStern2
 

AngularJS to Angular 2

  • 2. What is Angular 2? ■ A development platform for building mobile and desktop web applications. ■ Not a version update of AngularJS, but a complete rewrite. ■ Moved into Beta in December 2015, first release candidate was published May 2016.
  • 3. How is Angular 2 Different From AngularJS? ■ Mobile Development ■ Modern ■ Component-Based ■ TypeScript ■ Improved Dependency Injection ■ Dynamic Loading ■ AsynchronousTemplate Compilation ■ Diary.js Logging
  • 4. What isTypeScript? ■ Free and open-source programming language. ■ Developed and maintained by Microsoft. ■ Strict superset of JavaScript. ■ First made public in October 2012. ■ Supported on IDEs.
  • 5. How isTypeScript Different from JavaScript? ■ Type Annotations ■ Declaration Files ■ Classes ■ Generics ■ Namespaces ■ Tuples
  • 7. Angular 2 Migration Plan ■ 1. Use Style Guide ■ 2. Update to LatestVersion of Angular 1 ■ 3. All New DevelopmentWith Components ■ 4. Switch Controllers to Components ■ 5. Switch Component Directives to Components ■ 6. Switch Component Directives to Components ■ 7. Implement Manual Bootstrapping ■ 8. AddTypeScript and a Build ■ 9. Start Using ES6 ■ 10. Switch Controllers to ES6 Classes ■ 11. Switch Services to ES6 Classes