AngularJS Workshop Kit

I’ve recently had the opportunity to give a 3 hour AngularJS workshop. We build a (yet) another weather application with AngularJS, ui-router and Angular Animate. The workshop covers the following core concepts

  • Structuring an Angular application (ng-app)
  • Dependency injection
  • What can you inject
  • Controllers (ng-controller)
  • Model View View-Model
  • Loops as in ng-repeat
  • Applying classes (ng-class)
  • Conditional display (ng-if)
  • Animations (.ng-enter, .ng-leave)
  • Filtering expressions
  • Abstraction with service
  • Partial views ($stateProvider, $urlRouterProvider)
  • Navigation between views (#/hashtag, $state)
  • Parameterizing routes ($stateParams)
  • Consuming RESTful web services ($http and promise)

The workshop is available for download at http://bit.ly/angularjs_workshop. The workshop consists of the following items

  • A presentation; the workshop is broken up into 6 distinct steps, each step introducing core concepts. The slides with the ‘Men at work’ image is the workshop
  • Promotion material
  • Prerequisite – what the participants should know before attending the workshop
  • angularworkshop zip – snapshots of the 6 steps
  • A completed weather application

I’ll *probably* do a screencast of the workshop sometime in the future.

If you’re a programming/hackers (in the good sense of the word) club, Java User Group, open source community and you’re in Singapore and you want to run the workshop for your event, drop me a note. If I’m free I’ll be glad to run a workshop for you (free!). Make sure you have ample supply of Coke and chips!

Till next time.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: