enspiral-dev-academy/angular-workshop

angular-workshop

This is a sample angular app to demonstrate some of the core concepts and tools and is designed to give people familiar with javascript their first introduction to angular.

Each branch introduces a new concept and are designed to be followed sequentually.

Setup

• Install node, bower, grunt then

npm install
bower install
grunt serve

Tests

both the grunt server and the selenium server (webdriver-manager start) need to be running before you can run your tests with grunt protractor

You may need to run sudo npm install -g webdriver-manager if you get a permission error when running selenium.

Links

• Angular blog http://blog.angularjs.org/ - good for news etc.
• Angular modules directory http://ngmodules.org/
• Setting up a fresh angular install with Yeoman (note you will need npm install --save karma-jasmine karma-chrome-launcher for tests to pass)
• Protractor for e2e tests
• Protractor syntax
• Restangular - an improved version of the built-in $resource
• Angular UI is recommended if you application has anything other than very basic routing needs
• Angular and Rails: angular-js-rails-resource recommended if you are using rails
• Conceptual overview of Angular for Jquery folks
• Good Angular style guide - note that this differs from how the yeoman angular generator sets up your app.

DOM Notes

• If you are touching the DOM, always use a directive - directive docs, Simple Diretive, Directive tutorial
• You can get by without understanding the scope digest cycle initially but eventually it will bite you Simple Overview - Complex Overview
• always use angular.element to access the DOM
• Gotchya: ng-include expects an expression, strings must be explicit

Auth

• hosted services can save you a ton of time when prototyping but be ready to switch them out for your own backend Firebase would be our main pick though Hoist is a local alternative
• if rolling your own consider token based authentication

Contributors

• Joshua Vial