20

AngularJS UTOSC

Embed Size (px)

DESCRIPTION

 

Citation preview

Page 1: AngularJS UTOSC
Page 2: AngularJS UTOSC

WHO AM I?

Rob TaylorSoftware Engineer & Technologist

• 16 years in the field

• Browser Applications• Server Applications• Mobile Applications• Architecture

• Training

• Trends • New Technologies

• Luv learning new things

Page 3: AngularJS UTOSC

THE JOURNEY

Page 4: AngularJS UTOSC

WHAT HAS HAPPENED RECENTLY?

PLUGINS

Page 5: AngularJS UTOSC

A NEW ERA…

Page 6: AngularJS UTOSC

WEB APPS ARE GETTING MORE INTELLIGENT

Page 7: AngularJS UTOSC

WHAT’S NEXT?

Page 8: AngularJS UTOSC

WEB APPLICATIONS

Page 9: AngularJS UTOSC

HTML CHALLENGES

Designed around building web sites

Developers want

• Single page applications• No page refresh• Separation of code• Structure (MVC)• Application design patterns• Service Integration (RESTful Web Services)

Yes, it really is time to move

on…

Page 10: AngularJS UTOSC

WE WANT TO BUILD APPS IN THE BROWSER

Page 11: AngularJS UTOSC

WEB APP SOLUTIONS?

Emergence of many JavaScript Frameworks

• Backbone• Knockout• Batman• Sencha Ext• SproutCore• Spine• Sammy• Ember• Cappuccino• and the list goes on…

Ooooh. So many

choices!

Page 12: AngularJS UTOSC

AND NOW…

YAJF (Yet Another JavaScript Framework)?

Not really…

Page 13: AngularJS UTOSC

MY LITMUS TEST

1. Low barrier to entry

2. Intuitive API and Syntax

3. MVC (Model-View-Controller)

4. Code Organization

5. Data Binding

6. Event Dispatching

7. Templates

8. Still leverages HTML and CSS (doesn’t try to hide it)

9. Single code base for desktop browsers and mobile device

10. Team collaboration

11. Can be used with other solutions (jQuery, jQuery Mobile, other 3rd party JavaScript libraries and widgets)

12. Active community and/or commercial support

Page 14: AngularJS UTOSC

MY LITMUS TEST (SIMPLIFIED)

Can I build the same application on these devices with the same client code base?

Browser TabletSmart Phone

Page 15: AngularJS UTOSC

MY RESULTSI had eventually settled on Backbone.js

Shortcomings

• Hard to separate view from controller

• No data binding• Templates replaced entire

sections on events

With Knockout.js in a very close second Shortcomings

• Data-binding required some setup

• MVVM approach vs. MVC approach

• Syntax is not as approachable as others frameworks

Page 16: AngularJS UTOSC

THEN I FOUND…

It passed the my litmus test even though it was in early beta.

And now that it is at a 1.0, it has gotten even better!

Page 17: AngularJS UTOSC

MY LITMUS TEST

Low barrier to entry

Intuitive API and Syntax

MVC (Model-View-Controller)

Code Organization

Data Binding

Event Dispatching

Templates

Still leverages HTML and CSS (doesn’t try to hide it)

Single code base for desktop browsers and mobile device

Team collaboration

Can be used with other solutions (jQuery, jQuery Mobile, other 3rd party JavaScript libraries and widgets)

Active community and/or commercial support

Could improve

Page 18: AngularJS UTOSC

WHAT YOU WILL SEE TODAY

Breakdown of MVC (Model-View-Controller) Data Binding Use of templates Routing Shared Data Web service connectivity to a database

QUESTIONS WILL BE ANSWERED AT THE END

Page 19: AngularJS UTOSC

QUESTIONS?

Rob [email protected]: @roboncodehttp://roboncode.com

Page 20: AngularJS UTOSC

THANK YOU!

Rob [email protected]: @roboncodehttp://roboncode.com