Suggestions from Jeff Browning at Pinecone on improving my skills at AngularJS and Rails.

advice.md

AngularJS

• Build custom directives. Basic controllers and templates are great, but anything beyond basic interactivity usually requires custom directives. The learning curve for custom directives can be challenging, so just take it one step at a time.
• Inter-directive communication via controllers.
• Become very familiar with scope usage, best practices, and pitfalls. Scope inheritance, and encapsulation are some of the areas where Angular can drive you insane, but this knowledge is essential in order to build large-scale, maintainable Angular apps.
• Explore the differences between Services, Factories, and Providers.
• Become a testing expert. One thing that I like about the Angular community is that tests are expected and encouraged.

Here are some resources to help:

• http://egghead.io
• http://www.yearofmoo.com/
• http://codetunnel.com/
• http://www.angularjshub.com/

Ruby/Rails

• Build a good foundation to your knowledge by becoming familiar with software design patterns and antipatterns. This knowledge really helps when we're building large apps. Some great resources to learn more are:
  • http://sourcemaking.com/
  • http://www.confreaks.com/videos/240-goruco2009-solid-object-oriented-design
  • http://www.confreaks.com/videos/656-rubyconf2011-writing-solid-ruby-code
• Become familiar with web API design
• Become very familiar with other web app best practices such as REST

Finally, help out in the community. Answer StackOverflow questions. Find open source projects that you're interested in and help out with issues.

How do I "think in AngularJS" if I have a jQuery background?

Understanding Isolate Scope

The isolate scope differs from normal scope in that it does not prototypically inherit from the parent scope.

• https://egghead.io/lessons/angularjs-understanding-isolate-scope
• https://egghead.io/lessons/angularjs-isolate-scope-attribute-binding
• https://egghead.io/lessons/angularjs-isolate-scope-two-way-binding
• https://egghead.io/lessons/angularjs-isolate-scope-expression-binding
• https://egghead.io/lessons/angularjs-isolate-scope-review
• https://code.angularjs.org/1.2.25/docs/api/ng/service/$compile#-scope-
• http://codetunnel.com/isolate-scopes-explained/
• http://codepen.io/dwayne/pen/wfqev?editors=101

Here's a reusable directive that isn't using an isolate scope, explain why it maybe better to use an isolate scope. It's even heralded as a great solution on Stack Overflow.

TODO: Explain why it isn't a great solution and provide an alternative.

Here's my solution:

.directive('onEnter', function () {
  var ENTER_KEY = 13;

  return {
    scope: {
      expressionFn: '&onEnter'
    },
    link: function (scope, element) {
      element.on('keypress', function (e) {
        if (e.which === ENTER_KEY) {
          scope.$apply(function () {
            scope.expressionFn({ $event: e });
          });
        }
      });
    }
  };
});

AngularJS - Demystifying Directives

Power up Angular's $http service with caching

AngularJS Tutorial: A Comprehensive 10,000 Word Guide

The Top 10 Mistakes AngularJS Developers Make

AngularJS and scope.$apply

TODO: Write a directive that can be used for password confirmation.

Here's my implementation:

.directive('match', function () {
  return {
    restrict: 'A',
    require: ['^form', 'ngModel'],
    link: function (scope, element, attrs, ctrls) {
      var formCtrl = ctrls[0],
          inputCtrl = ctrls[1];

      var testForMatch = function (value, confirmation) {
        inputCtrl.$setValidity('match', value === confirmation);
      };

      scope.$watch(attrs.ngModel, function (confirmation) {
        testForMatch(scope.$eval(attrs.match), confirmation);
      });

      scope.$watch(attrs.match, function (value) {
        testForMatch(value, scope.$eval(attrs.ngModel));
      });
    }
  };
});