Better Angular

At VividCortex we love Angular! It abstracts away the need to directly modify the DOM. It provides an excellent set of methods to help bring structure to your code. Also it's packed with conviance methods to help work with JavaScript objects.

Intro

• Frontend Brainiac at VividCortex
• Fairly new to AngularJS
• Team members

Keeping it tidy with JSLint

• JS needs good oversight
• Helps you find bugs
• Easy way to enforce coding style

Coding Style

• Using self closing functions

Application folder structure

• Divide your code modules by view
• Utilites to share
• Working to support async deps
• Breaking components into seperate project

Keep your eye on $watch

• Don't use recursive $watch
• Use hashes to monitor change
• Double and triple check your changes
• Keep the code simple

Scope

• Click on element $0 ng.element
• Using MainCtrl to create a shared scope. Future is scope inhertiance.

Templating

• Script tag template

Directives

• Use webstorm edit html fragment
• AngularJS 1.2 private memebers
• Keep directives composable - keep functionaility simple.
• When to use element vs classes - http://egghead.io/lessons/angularjs-components-and-containers

IDE

• angularjs webstorm plugin
• zen coding
• Karam

Testing

• Test Services First
• Easier to test
• Angular Services are Singletons

Future Reading

• Mastering Web Application Development with AngularJS http://amzn.to/1hOLbvs
• A Better Way to Learn AngularJS http://bit.ly/1b0GyuE
• JavaScript The Good Parts
• http://stackoverflow.com/questions/9682092/databinding-in-angularjs
• http://egghead.io/lessons/angularjs-experimental-controller-as-syntax
• http://egghead.io/lessons/angularjs-templatecache
• http://docs.emmet.io/