Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Todo App Angular 2

Avatar for Andres Osorio Plata Andres Osorio Plata
August 21, 2015
Technology
1
170

Todo App Angular 2

We will talk about:
Angular 1
Angular 2
Angular 1 and ES6
Code of a Todo App in Angular 2
Avatar for Andres Osorio Plata

Andres Osorio Plata

August 21, 2015
Tweet

More Decks by Andres Osorio Plata

See All by Andres Osorio Plata
Reactive Programming in Javascript
Avatar for Andres Osorio Plata codeandrop
0
120
Material Design Lite
Avatar for Andres Osorio Plata codeandrop
0
130

Other Decks in Technology

See All in Technology
5min GuardDuty Extended Threat Detection EKS
Avatar for takakuni takakuni
0
180
American airlines ®️ USA Contact Numbers: Complete 2025 Support Guide
Avatar for markhor64456 airhelpsupport
0
240
B2C＆B2B＆社内向けサービスを抱える開発組織におけるサービス価値を最大化するイニシアチブ管理
Avatar for Belong inc. belongadmin
1
5.6k
Tech-Verse 2025 Keynote
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
1.7k
赤煉瓦倉庫勉強会｢Databricksを選んだ理由と、絶賛真っ只中のデータ基盤移行体験記｣
Avatar for 株式会社IVRy（社員登壇資料） ivry_presentationmaterials
2
290
モバイル界のMCPを考える
Avatar for naoto33 naoto33
0
410
第４回Snowflake 金融ユーザー会 Snowflake summit recap
Avatar for Makoto tamaoki
0
200
低レイヤを知りたいPHPerのためのCコンパイラ作成入門 完全版 / Building a C Compiler for PHPers Who Want to Dive into Low-Level Programming - Expanded
Avatar for HASEGAWA Tomoki tomzoh
4
3.4k
CI/CD/IaC 久々に0から環境を作ったらこうなりました
Avatar for Kaz Watanabe kaz29
1
220
無意味な開発生産性の議論から抜け出すための予兆検知とお金とAI
Avatar for Masato Ishigaki / 石垣雅人 i35_267
3
11k
American airlines®️ USA Contact Numbers: Complete 2025 Support Guide
Avatar for Nitish oliversmith12
0
100
面倒な作業はAIにおまかせ。Flutter開発をスマートに効率化
Avatar for Rui ruideengineer
0
120

Featured

See All Featured
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
Avatar for Stéphanie Walter stephaniewalter
281
13k
Fireside Chat
Avatar for paigeccino paigeccino
37
3.5k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
Avatar for Vitaly Friedman smashingmag
252
21k
Bash Introduction
Avatar for André Augusto Costa Santos 62gerente
614
210k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
34
5.9k
Imperfection Machines: The Place of Print at Facebook
Avatar for Scott Boms scottboms
267
13k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
524
40k
Bootstrapping a Software Product
Avatar for Garrett Dimon garrettdimon
PRO
307
110k
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k
[RailsConf 2023 Opening Keynote] The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
29
9.5k
Faster Mobile Websites
Avatar for Dean Hume deanohume
307
31k
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
332
24k

Transcript

  1. Todo App Angular 2 Andres Osorio @codeandrop

  2. Agenda • Angular 1 • Angular 2 • Angular 1

    and ES6 • Demo time!

  3. Angular 1 • The code base for Angular dates back

    to 2009 • Angular2 is 5x faster than Angular 1* • Angular 1.x has many concepts • Concepts have a learning curve

  4. Angular 1 Concepts • Controller • Factory • Service •

    Provider • Directive • Transclusion • Module

  5. Angular 2 • Work in progress • ES5, ES6, Dart

    or Typescript • Everything is a component • Components: Break UI into reusable pieces • Tree of components • Possible migration from Angular 1.5.x

  6. Angular 2 - Component Syntax

  7. Angular 2 - Component Syntax Annotation Controller

  8. Angular 2 - Controller

  9. Angular 2 - Template Syntax • Local Variables - #localvar

    • Event Handlers - (click) • Property Bindings - [innerText]

  10. Angular 2 - Template Syntax

  11. Angular 1 and ES6 http://www.michaelbromley.co.uk/blog/350/exploring-es6-classes-in-angularjs-1-x https://github.com/Swiip/generator-gulp-angular

  12. Demo time!

  13. THE END