Lessons learned after 1.5 years of fulltime

By Igor Hlina — @srigi

#1 - No respect for LOC

#2 - Project structure


  angular.module('acme')
          

  angular.module('acme.homepage')
          

  angular.module('acme.trips')
          

  angular.module('acme.trips.planner')
          

  angular.module('acme.trips.planner').controller('TripsPlannerController')
          

  angular.module('acme.trips.planner').service('TripsPlannerRepository')
          

  angular.module('acme')
          

  angular.module('acme', [])
          

  angular.module('acme', [])
          

  angular.module('acme')
          
app/trips/_module.js

  angular.module('acme', [])
          
app/trips/controllers/index.js

  angular.module('acme').controller('TripsController')
          

#3 - AngularJS is all about HTML


  <new-post-portlet submit-fn="ctrl.saveNewPost()" />
          
function(post) {
  var fn = $compile(
    '<new-post-portlet data="postToEdit" submit-fn="savePost()" />'
  );  scope.postToEdit = post;  var editPortlet = fn(scope);  el.after(editPortlet);
  el.hide();
}

#4 - Just use UI-Router!

ngRoute
index.html
app/_shared/layouts/2cols.html

#5 - Login is a issue in SPAs

#6 - scew you CORS

XMLHttpRequest cannot load http://api.localhost:8000/v1/trips. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://api.localhost:8000' is therefore not allowed access.

Scew that

Use reverse-proxy instead

http://api.localhost:8000/v1/trips
http://api.localhost:8000/v1/trips
http://localhost:8000/api/v1/trips
/api/v1
http://localhost:8001/trips

#7

Thanks

@srigi

Questions