Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Angular as an Integrated Development Platform
Search
Minko Gechev
November 10, 2019
Programming
0
340
Angular as an Integrated Development Platform
Minko Gechev
November 10, 2019
Tweet
Share
More Decks by Minko Gechev
See All by Minko Gechev
Change the World With Open Source Software
mgechev
0
190
Fast Angular Apps from End to End
mgechev
1
190
The State of Angular
mgechev
1
200
The State of Angular
mgechev
1
370
Software Engineering as a Superpower
mgechev
1
190
Introduction to Angular
mgechev
1
210
Internals of the Angular CLI
mgechev
2
1.3k
The State of Angular
mgechev
1
210
The State of Angular Deployment, SSR, and Prerendering, ng-conf keynote
mgechev
2
2.9k
Other Decks in Programming
See All in Programming
iOS開発スターターキットの作り方
akidon0000
0
230
PHPカンファレンス関西2025 基調講演
sugimotokei
6
1.1k
SwiftでMCPサーバーを作ろう!
giginet
PRO
2
220
Comparing decimals in Swift Testing
417_72ki
0
160
新世界の理解
koriym
0
130
AWS Summit Japan 2024と2025の比較/はじめてのKiro、今あなたは岐路に立つ
satoshi256kbyte
1
260
Understanding Kotlin Multiplatform
l2hyunwoo
0
250
中級グラフィックス入門~効率的なメッシュレット描画~
projectasura
4
2.4k
Claude Code と OpenAI o3 で メタデータ情報を作る
laket
0
110
DMMを支える決済基盤の技術的負債にどう立ち向かうか / Addressing Technical Debt in Payment Infrastructure
yoshiyoshifujii
5
740
GUI操作LLMの最新動向: UI-TARSと関連論文紹介
kfujikawa
0
220
Git Sync を超える!OSS で実現する CDK Pull 型デプロイ / Deploying CDK with PipeCD in Pull-style
tkikuc
4
520
Featured
See All Featured
Visualization
eitanlees
146
16k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Raft: Consensus for Rubyists
vanstee
140
7k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
48
2.9k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.8k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
126
53k
The Cost Of JavaScript in 2023
addyosmani
51
8.7k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
35
2.5k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
420
Six Lessons from altMBA
skipperchong
28
3.9k
Transcript
ngular github.com/mgechev twitter.com/mgechev blog.mgechev.com Integrated Development Platform
agenda
What is Angular
None
None
Mobile • Web apps • Ionic • NativeScript
None
Desktop • Web apps • Electron
core (zones, di, abstractions, etc.)
core (zones, di, abstractions, etc.) animations
compiler core (zones, di, abstractions, etc.) animations
http compiler core (zones, di, abstractions, etc.) animations
forms http compiler core (zones, di, abstractions, etc.) animations
forms http compiler core (zones, di, abstractions, etc.) router animations
forms http compiler core (zones, di, abstractions, etc.) router i18n
animations
forms http compiler core (zones, di, abstractions, etc.) router ngUpgrade
i18n animations
PWA forms http compiler core (zones, di, abstractions, etc.) router
ngUpgrade i18n animations
Universal PWA forms http compiler core (zones, di, abstractions, etc.)
router ngUpgrade i18n animations
components Universal PWA forms http compiler core (zones, di, abstractions,
etc.) router ngUpgrade i18n animations
CLI components Universal PWA forms http compiler core (zones, di,
abstractions, etc.) router ngUpgrade i18n animations
language services CLI components Universal PWA forms http compiler core
(zones, di, abstractions, etc.) router ngUpgrade i18n animations
angularfire2 language services CLI components Universal PWA forms http compiler
core (zones, di, abstractions, etc.) router i18n ngUpgrade animations
angularfire2 language services CLI components Universal PWA forms http compiler
core (zones, di, abstractions, etc.) router i18n ngUpgrade animations
angular-cli
$ npm i -g @angular/cli $ ng new hello-world
$ cd hello-world $ ng serve
None
Angular Core
Core • Components • Ultrafast Change Detection • More abstractions
as you need them
@Component({ selector: 'hello-world', template: '<h1>Hello, {{user.name}}!</h1>' }) class HelloWorldComponent {
getData() { fetch('https://example.com/data.json') .then(response => response.json()) .then(data => this.user = data); } } Hello world in Angular
Compiler
“Compiles your templates to JavaScript instructions”
template.html <section> Howdy! Here’s a list: <ul> <li>First</li> <li>Second</li> </ul>
</section>
compiled.js elementStart(0, "section"); text(1, " Howdy! Here's a list: ");
elementStart(2, "ul"); elementStart(3, "li"); text(4, "First"); elementEnd(); elementStart(5, "li"); text(6, "Second"); elementEnd(); elementEnd(); elementEnd();
compiled.js e(0, "section"); t(1, " Howdy! Here's a list: ");
e(2, "ul"); e(3, "li"); t(4, "First"); n(); e(5, "li"); t(6, "Second"); n(); n(); n();
compiled.js e(0,"section"),t(1,"Howdy! Here's a list: "),e(2,"ul"),e(3,"li"),t(4,"First"),n(),e(5,"l i"),t(6,"Second"),n(),n(),n();
Development experience
Typical JavaScript experience
Angular is… • Built with TypeScript • Compile-time type checking
• Great IDE/text editors support • Analyzable templates
Type-checking and IntelliSense in templates
None
None
codelyzer
“codelyzer is a project which aims to enforce common style
and verify correctness of your program”
None
None
Client Server
Client Server
Client Server GET / GET * loop
Client Server GET / GET * loop Running JavaScript
Client Server GET / GET * loop GET * loop
Client Server GET / GET * loop GET * loop
server-side rendering
Client Server
Client Server
Client Server GET /
Client Server GET / Running JavaScript
Client Server GET / GET * loop
Client Server GET / GET * loop Running JavaScript
Client Server GET / GET * loop
❤ Angular Community ❤
ngAtlanta " ngIndia # Angular NL $ ng-conf " ngVikings
% Angular Day & Angular in Depth ' ngDenver " NG-MY ( ng-japan ) NG-DE * ng-SriLanka + Angular Connect , ngSpain - NGRome & NG Honduras . ngTaiwan / ngTalks ' NG-BE 0 ngBolivia 1 AngularMix " ngPoland 2 AngularUP 3 ngChina 4
Thank you! github.com/mgechev twitter.com/mgechev blog.mgechev.com