Angularjs [Bahasa Indonesia]

2,032
-1

Published on

AngularJS is Javascript Framework supported by google.

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,032
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
193
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Angularjs [Bahasa Indonesia]

  1. 1. Mengenal by @jeguwaskito
  2. 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. 3. JavaScript ?
  4. 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. 5. Note! Note! Client-Side Server-Side
  6. 6. Contoh
  7. 7. Perkembangan Javascript Library Framework
  8. 8. Apa itu angularJS ? MVW [Model View Wathever] Javascript Framework untuk membuat 'web apps' khususnya Single Page Application
  9. 9. History ● Created by Miško Hevery ● Open source since 2009 ● Supported by Google ● Large & fast-growing
  10. 10. Kenapa milih ?
  11. 11. Well Documented
  12. 12. Modular http://ngmodules.org
  13. 13. Trending Topic
  14. 14. Many Tutorials
  15. 15. Angular Main Concepts ● 2 Way Data Binding ● Directive ● Expression ● Model ● View / Template ● Controller ● Filter
  16. 16. 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
  17. 17. 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
  18. 18. Expression ● Kode Javascript seperti biasanya yang ditempatkan dalam curly- brackets {{ expression }} ● Dapat berupa: - angular variable - filter - function
  19. 19. Model ● Data yang ditampilkan kepada user dimana user tersebut berinteraksi
  20. 20. View / Templates ● Di angular, template ditulis dengan format HTML, dan dapat mengandung directive, expression, atau filter index.html partials/template1.html
  21. 21. Controller ● Fungsi konstruktor javascript untuk mengolah data ($scope)
  22. 22. Filter Memformat value dari expression yang diperlihatkan ke user
  23. 23. Warning ● Angular tidak direkomendasikan untuk SEO ● Butuh trik khusus: http://prerender.io ● Jangan buka di IE7
  24. 24. 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)
  25. 25. Other Recommended Tool ● Sublime Text ● Git ● Bower (http://bower.io) ● Gulpjs (http://gulpjs.com) ● Twitter Bootstrap / Foundation
  26. 26. Thank You
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×