SlideShare a Scribd company logo
1 of 13
X-Plat Development of
Angular 2 with TypeScript
@JeremyLikness
Swag!
• For chance to win …
• Retweet an @iVisionAtl session reminder, or
• Take a picture of this session and tweet with #CodeStock
and @ivisionAtl, or
• Retweet this video
About iVision
A privately held, IT consulting firm headquartered in Midtown, Atlanta.
At iVision, we seek to understand our clients’ business first. We work with clients to
architect, transform and support their technology — enabling them to realize their
vision of a better tomorrow.
Jeremy Likness| Director of App Dev
https://github.com/JeremyLikness
http://bit.ly/coderblog
The iVision Difference
 Engineering Expertise
 White Glove Service
 Delivery Assurance
 Flexible Business Model
 Proven Partner Ecosystem
 Culture & People
About iVision
Agenda
• Pre-requisites
• Getting Started / Angular-CLI
• Why?
• Demo
• Q&A
Getting Started
https://nodejs.org/
https://code.visualstudio.com/
https://angular.io/
Angular-CLI
npm install -g angular-cli
ng new my-project
cd my-project
ng serve
Why Angular?
• Three D’s of Web
Development:
http://bit.ly/3dofweb
• Declarative vs. Imperative
• Data-binding
• Dependency Injection
• Components and
Templates
• Code Reuse
• Parallel Development
• Testability
• Performance
Source: http://stackoverflow.com/research/developer-survey-2016
Why Angular 2?
• Small footprint (45k – smaller than Angular 1.x)
• Easy to read, understand, and learn declarative interface
• Improved performance (5x rendering in all scenarios over
Angular 1.x)
• Great CSS management (CSS per component)
• Module prefixing (easier to move related files in large
projects)
• Server-side rendering with Angular universal
• Testing support
• Advanced scaffolding with Angular-CLI
• TypeScript (stay tuned…)
Why TypeScript? (1 of 2)
• “I cannot say I have ever been a Microsoft fan but
TypeScript has ‘softened’ me, it is easily one of the best
web technologies to arrive in the past 3 years.” -
https://tedpatrick.com/2013/06/25/7-months-with-typescript/
• “Overall, TypeScript is wonderful to work with. It helps
developers catch errors quickly, adds types and type-
checking, and documents your progress so that if someone
else wants to contribute, or you need to return to your work
months later, you can easily pick up where you left off.” -
http://www.livetiles.nyc/blog/typescript-a-digital-workplace-success-story/
• “… we use TypeScript not because we’re part of Microsoft,
but because we find tremendous value by improving our
productivity and keeping our quality high which together
allow us to move much faster.” - https://medium.com/@delveeng/why-we-
love-typescript-bec2df88d6c2#.pzp9xp7an
Why TypeScript? (2 of 2)
http://bit.ly/typescriptvid
What time is it?
• Serve, Test, E2E, & Build
• Generate a service
• DI
• View models
• Bindings
• Local variables
• Events
• CSS
• Components
• Directives
• Added module
Questions?
http://ivision.com/author/jlikness
https://twitter.com/jeremylikness
https://linkedin.com/in/jeremy.likness
http://stackoverflow.com/users/228918/jeremy-likness
https://github.com/JeremyLikness
http://csharperimage.jeremylikness.com/

More Related Content

What's hot

SoftServe - "ASP.NET MVC як наступний крок у розвитку технології розробки Web...
SoftServe - "ASP.NET MVC як наступний крок у розвитку технології розробки Web...SoftServe - "ASP.NET MVC як наступний крок у розвитку технології розробки Web...
SoftServe - "ASP.NET MVC як наступний крок у розвитку технології розробки Web...
SoftServe
 
Documentation-driven development for Python web APIs
Documentation-driven development for Python web APIsDocumentation-driven development for Python web APIs
Documentation-driven development for Python web APIs
José Haro Peralta
 

What's hot (20)

PyBCN 2020
PyBCN 2020PyBCN 2020
PyBCN 2020
 
Build HTML5 Sites/Apps with Kendo UI Core
Build HTML5 Sites/Apps with Kendo UI CoreBuild HTML5 Sites/Apps with Kendo UI Core
Build HTML5 Sites/Apps with Kendo UI Core
 
SoftServe - "ASP.NET MVC як наступний крок у розвитку технології розробки Web...
SoftServe - "ASP.NET MVC як наступний крок у розвитку технології розробки Web...SoftServe - "ASP.NET MVC як наступний крок у розвитку технології розробки Web...
SoftServe - "ASP.NET MVC як наступний крок у розвитку технології розробки Web...
 
SPFx (SharePoint Framework)
SPFx (SharePoint Framework)SPFx (SharePoint Framework)
SPFx (SharePoint Framework)
 
SilverStripe ♥︎ Mautic
SilverStripe ♥︎ MauticSilverStripe ♥︎ Mautic
SilverStripe ♥︎ Mautic
 
Delivering successful API integrations with documentation-driven development
Delivering successful API integrations with documentation-driven developmentDelivering successful API integrations with documentation-driven development
Delivering successful API integrations with documentation-driven development
 
Instant app Intro
Instant app IntroInstant app Intro
Instant app Intro
 
Why angular?
Why angular?Why angular?
Why angular?
 
Documentation-driven development for Python web APIs
Documentation-driven development for Python web APIsDocumentation-driven development for Python web APIs
Documentation-driven development for Python web APIs
 
Integrate Videos & Photos With Ease in ASP.NET
Integrate Videos & Photos With Ease in ASP.NETIntegrate Videos & Photos With Ease in ASP.NET
Integrate Videos & Photos With Ease in ASP.NET
 
React js vs angularjs
React js vs angularjsReact js vs angularjs
React js vs angularjs
 
Leaping Forward: Finding The Future of Your API Docs
Leaping Forward: Finding The Future of Your API DocsLeaping Forward: Finding The Future of Your API Docs
Leaping Forward: Finding The Future of Your API Docs
 
Interactive web prototyping
Interactive web prototypingInteractive web prototyping
Interactive web prototyping
 
Getting Started with ASP.NET vNext
Getting Started with ASP.NET vNextGetting Started with ASP.NET vNext
Getting Started with ASP.NET vNext
 
Lessons Learned from Revamping Our Doc Site
Lessons Learned from Revamping Our Doc SiteLessons Learned from Revamping Our Doc Site
Lessons Learned from Revamping Our Doc Site
 
10 Customizations in VSTS
10 Customizations in VSTS10 Customizations in VSTS
10 Customizations in VSTS
 
React vs Angular, who wins the competition?
React vs Angular, who wins the competition?React vs Angular, who wins the competition?
React vs Angular, who wins the competition?
 
Introduction to SharePoint Framework
Introduction to SharePoint FrameworkIntroduction to SharePoint Framework
Introduction to SharePoint Framework
 
Integration day brussels-mr-ashwinprabhu
Integration day brussels-mr-ashwinprabhuIntegration day brussels-mr-ashwinprabhu
Integration day brussels-mr-ashwinprabhu
 
Mobilizing Your SAP Data with Kendo UI Mobile
Mobilizing Your SAP Data with Kendo UI MobileMobilizing Your SAP Data with Kendo UI Mobile
Mobilizing Your SAP Data with Kendo UI Mobile
 

Similar to Cross Platform Angular 2 and TypeScript Development

QCon'17 talk: CI/CD at scale - lessons from LinkedIn and Mockito
QCon'17 talk: CI/CD at scale - lessons from LinkedIn and MockitoQCon'17 talk: CI/CD at scale - lessons from LinkedIn and Mockito
QCon'17 talk: CI/CD at scale - lessons from LinkedIn and Mockito
Szczepan Faber
 
Marwa_Ezzatt_Ahmed_CV
Marwa_Ezzatt_Ahmed_CVMarwa_Ezzatt_Ahmed_CV
Marwa_Ezzatt_Ahmed_CV
Marwa Ezzat
 

Similar to Cross Platform Angular 2 and TypeScript Development (20)

CI/CD: Lessons from LinkedIn and Mockito
CI/CD: Lessons from LinkedIn and MockitoCI/CD: Lessons from LinkedIn and Mockito
CI/CD: Lessons from LinkedIn and Mockito
 
DevOpsGuys FutureDecoded 2016 - is DevOps the Answer
DevOpsGuys FutureDecoded 2016 - is DevOps the AnswerDevOpsGuys FutureDecoded 2016 - is DevOps the Answer
DevOpsGuys FutureDecoded 2016 - is DevOps the Answer
 
August 2018: DevSecOps - London Gathering
August 2018: DevSecOps - London GatheringAugust 2018: DevSecOps - London Gathering
August 2018: DevSecOps - London Gathering
 
SharePoint Wednesday Port Elisabeth - Introduction to AngularJS with the Micr...
SharePoint Wednesday Port Elisabeth - Introduction to AngularJS with the Micr...SharePoint Wednesday Port Elisabeth - Introduction to AngularJS with the Micr...
SharePoint Wednesday Port Elisabeth - Introduction to AngularJS with the Micr...
 
What's new in Angular 2?
What's new in Angular 2?What's new in Angular 2?
What's new in Angular 2?
 
QCon'17 talk: CI/CD at scale - lessons from LinkedIn and Mockito
QCon'17 talk: CI/CD at scale - lessons from LinkedIn and MockitoQCon'17 talk: CI/CD at scale - lessons from LinkedIn and Mockito
QCon'17 talk: CI/CD at scale - lessons from LinkedIn and Mockito
 
Microservices, Microfrontends and Feature Teams
Microservices, Microfrontends and Feature TeamsMicroservices, Microfrontends and Feature Teams
Microservices, Microfrontends and Feature Teams
 
Marwa_Ezzatt_Ahmed_CV
Marwa_Ezzatt_Ahmed_CVMarwa_Ezzatt_Ahmed_CV
Marwa_Ezzatt_Ahmed_CV
 
Is Being Agile a Good Thing?
Is Being Agile a Good Thing?Is Being Agile a Good Thing?
Is Being Agile a Good Thing?
 
From Monoliths to Services: Paying Your Technical Debt
From Monoliths to Services: Paying Your Technical DebtFrom Monoliths to Services: Paying Your Technical Debt
From Monoliths to Services: Paying Your Technical Debt
 
Microservices
MicroservicesMicroservices
Microservices
 
SharePoint Fest Chicago - Introduction to AngularJS with the Microsoft Graph
SharePoint Fest Chicago - Introduction to AngularJS with the Microsoft GraphSharePoint Fest Chicago - Introduction to AngularJS with the Microsoft Graph
SharePoint Fest Chicago - Introduction to AngularJS with the Microsoft Graph
 
Making sense of microservices, service mesh, and serverless
Making sense of microservices, service mesh, and serverlessMaking sense of microservices, service mesh, and serverless
Making sense of microservices, service mesh, and serverless
 
Kku2011
Kku2011Kku2011
Kku2011
 
How to create awesome customer experiences
How to create awesome customer experiencesHow to create awesome customer experiences
How to create awesome customer experiences
 
Sps toronto introduction to azure functions microsoft flow
Sps toronto introduction to azure functions microsoft flowSps toronto introduction to azure functions microsoft flow
Sps toronto introduction to azure functions microsoft flow
 
Engage 2019: The good, the bad and the ugly: a not so objective view on front...
Engage 2019: The good, the bad and the ugly: a not so objective view on front...Engage 2019: The good, the bad and the ugly: a not so objective view on front...
Engage 2019: The good, the bad and the ugly: a not so objective view on front...
 
AWS Community Day: From Monolith to Microservices - What Could Go Wrong?
AWS Community Day: From Monolith to Microservices - What Could Go Wrong?AWS Community Day: From Monolith to Microservices - What Could Go Wrong?
AWS Community Day: From Monolith to Microservices - What Could Go Wrong?
 
Performance Metrics Driven CI/CD - Introduction to Continuous Innovation and ...
Performance Metrics Driven CI/CD - Introduction to Continuous Innovation and ...Performance Metrics Driven CI/CD - Introduction to Continuous Innovation and ...
Performance Metrics Driven CI/CD - Introduction to Continuous Innovation and ...
 
The dev ops drumbeat reinventing the iron triangle
The dev ops drumbeat reinventing the iron triangleThe dev ops drumbeat reinventing the iron triangle
The dev ops drumbeat reinventing the iron triangle
 

Recently uploaded

+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
?#DUbAI#??##{{(☎️+971_581248768%)**%*]'#abortion pills for sale in dubai@
 
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
 
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
 
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
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
WSO2
 

Recently uploaded (20)

+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
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
 
Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..
 
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
 
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
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
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
 
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
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot ModelMcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
 
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 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
 
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 

Cross Platform Angular 2 and TypeScript Development

  • 1. X-Plat Development of Angular 2 with TypeScript @JeremyLikness
  • 2. Swag! • For chance to win … • Retweet an @iVisionAtl session reminder, or • Take a picture of this session and tweet with #CodeStock and @ivisionAtl, or • Retweet this video
  • 3. About iVision A privately held, IT consulting firm headquartered in Midtown, Atlanta. At iVision, we seek to understand our clients’ business first. We work with clients to architect, transform and support their technology — enabling them to realize their vision of a better tomorrow. Jeremy Likness| Director of App Dev https://github.com/JeremyLikness http://bit.ly/coderblog The iVision Difference  Engineering Expertise  White Glove Service  Delivery Assurance  Flexible Business Model  Proven Partner Ecosystem  Culture & People About iVision
  • 4. Agenda • Pre-requisites • Getting Started / Angular-CLI • Why? • Demo • Q&A
  • 6. Angular-CLI npm install -g angular-cli ng new my-project cd my-project ng serve
  • 7. Why Angular? • Three D’s of Web Development: http://bit.ly/3dofweb • Declarative vs. Imperative • Data-binding • Dependency Injection • Components and Templates • Code Reuse • Parallel Development • Testability • Performance Source: http://stackoverflow.com/research/developer-survey-2016
  • 8. Why Angular 2? • Small footprint (45k – smaller than Angular 1.x) • Easy to read, understand, and learn declarative interface • Improved performance (5x rendering in all scenarios over Angular 1.x) • Great CSS management (CSS per component) • Module prefixing (easier to move related files in large projects) • Server-side rendering with Angular universal • Testing support • Advanced scaffolding with Angular-CLI • TypeScript (stay tuned…)
  • 9. Why TypeScript? (1 of 2) • “I cannot say I have ever been a Microsoft fan but TypeScript has ‘softened’ me, it is easily one of the best web technologies to arrive in the past 3 years.” - https://tedpatrick.com/2013/06/25/7-months-with-typescript/ • “Overall, TypeScript is wonderful to work with. It helps developers catch errors quickly, adds types and type- checking, and documents your progress so that if someone else wants to contribute, or you need to return to your work months later, you can easily pick up where you left off.” - http://www.livetiles.nyc/blog/typescript-a-digital-workplace-success-story/ • “… we use TypeScript not because we’re part of Microsoft, but because we find tremendous value by improving our productivity and keeping our quality high which together allow us to move much faster.” - https://medium.com/@delveeng/why-we- love-typescript-bec2df88d6c2#.pzp9xp7an
  • 10. Why TypeScript? (2 of 2) http://bit.ly/typescriptvid
  • 12. • Serve, Test, E2E, & Build • Generate a service • DI • View models • Bindings • Local variables • Events • CSS • Components • Directives • Added module