AngularJS is Javascript Framework supported by google.

1. Mengenal
by @jeguwaskito

2. Yanuar Galih Waskito
●
SMA 3 Yogyakarta 2007-2009
●
IT Telkom (sekarang Telkom University) 2009-2013
●
Front-end Web Developer @ Qiscus 2013-sekarang
Twitter: @jeguwaskito
Github: http://github.com/waskito

3. JavaScript ?

4. JavaScript
is a dynamic computer programming language
most commonly used as part of web browsers,
whose implementations allow client-side
scripts to “interact with the user” . . . . .
It's for better user experience

5. Note! Note!
Client-Side Server-Side

6. Contoh

7. Perkembangan Javascript
Library Framework

9. Apa itu angularJS ?
MVW [Model View Wathever] Javascript
Framework untuk membuat 'web apps'
khususnya Single Page Application

10. History
●
Created by Miško Hevery
●
Open source since 2009
●
Supported by Google
●
Large & fast-growing

11. Kenapa milih ?

12. Well Documented

13. Modular
http://ngmodules.org

14. Trending Topic

15. Many Tutorials

16. Angular Main Concepts
●
2 Way Data Binding
●
Directive
●
Expression
●
Model
●
View / Template
●
Controller
●
Filter

17. 2 Way Data Binding
ViewView
TemplateTemplate
ModelModel
Continuous updates
Model is Single-Source-of-Truth
Compile
Changes to Model updates ViewChanges to View updates Model
Two-WayDataBinding

18. Directive
Directive : angular marker pada element DOM (cth: html attribute,
html element, comment, atau CSS class)
Digunakan sesuai fungsi directive yang dideklarasikan, bisa untuk:
- manipulasi DOM,
- manipulasi data di angular

19. Expression
●
Kode Javascript seperti biasanya yang ditempatkan dalam curly-
brackets {{ expression }}
●
Dapat berupa:
- angular variable
- filter
- function

20. Model
●
Data yang ditampilkan kepada user dimana
user tersebut berinteraksi

21. View / Templates
●
Di angular, template ditulis dengan format HTML, dan dapat
mengandung directive, expression, atau filter
index.html
partials/template1.html

22. Controller
●
Fungsi konstruktor javascript untuk mengolah
data ($scope)

23. Filter
Memformat value dari expression yang
diperlihatkan ke user

24. Warning
●
Angular tidak direkomendasikan untuk SEO
●
Butuh trik khusus: http://prerender.io
●
Jangan buka di IE7

25. Get Started
●
Go to angularjs.org
●
Download angular
●
Extract it
●
Open on text editor/IDE (e.g Sublime Text)
●
Open in Browser (e.g Chrome, Firefox)

26. Other Recommended Tool
●
Sublime Text
●
Git
●
Bower (http://bower.io)
●
Gulpjs (http://gulpjs.com)
●
Twitter Bootstrap / Foundation

27. Thank You