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
組織改革から開発効率向上まで！ - 成功事例から見えたAI活用のポイント - / 20251016 Tetsuharu Kokaki
Avatar for SHIFT EVOLVE shift_evolve
PRO
1
170
事業開発におけるDify活用事例
Avatar for KentaroFujii kentarofujii
3
730
Contract One Engineering Unit 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
0
8.9k
名刺メーカーDevグループ 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
0
940
Biz職でもDifyでできる！ 「触らないAIワークフロー」を実現する方法
Avatar for kanacan igarashikana
3
860
フレームワークを意識させないワークショップづくり
Avatar for Keigo Suda keigosuda
0
210
Wasmのエコシステムを使った ツール作成方法
Avatar for asuka askua
0
220
ビズリーチ求職者検索におけるPLMとLLMの活用 / Search Engineering MEET UP_2-1
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
1
170
Railsの話をしよう
Avatar for Yasuo Honda yahonda
0
170
AIエージェント入門 〜基礎からMCP・A2Aまで〜
Avatar for Shu Kobuchi shukob
0
110
プロダクトのコードから見るGoによるデザインパターンの実践 #go_night_talk
Avatar for 弁護士ドットコム bengo4com
1
2.7k
WEBサービスを成り立たせるAWSサービス
Avatar for Takano takano0131
1
180

Featured

See All Featured
Understanding Cognitive Biases in Performance Measurement
Avatar for Philip Tellis bluesmoon
31
2.7k
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
231
53k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
Avatar for Chris Coyier chriscoyier
508
140k
RailsConf 2023
Avatar for Aaron Patterson tenderlove
30
1.3k
Faster Mobile Websites
Avatar for Dean Hume deanohume
310
31k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
697
190k
Helping Users Find Their Own Way: Creating Modern Search Experiences
Avatar for Dan Newman danielanewman
30
2.9k
Building Applications with DynamoDB
Avatar for Matt Wood mza
96
6.7k
Making Projects Easy
Avatar for Brett Harned brettharned
120
6.4k
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
791
250k
Optimizing for Happiness
Avatar for Tom Preston-Werner mojombo
379
70k
Docker and Python
Avatar for Tania Allard trallard
46
3.6k

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