John W. Matthews Blog

Collection of articles on ember.js that have helped me learn:

• Good Resources for learning Ember
• http://www.programwitherik.com/questions-with-erik-good-ember-resources/ 

• Ember Addons
• http://www.emberaddons.com/
  
• Explanation of 'Data Down Actions Up' pattern
• https://emberway.io/ember-js-goodbye-mvc-part-1-21777ecfd708#.n3y620b1a
  
• Ember.js Components
• http://www.programwitherik.com/ember-js-components-examples/
  
• Typeahead Component
• https://github.com/aupac/ember-aupac-typeahead

• Ember Run Loop
• https://teamgaslight.com/blog/a-beginners-guide-to-the-ember-run-loop
  

• Ember Data
• http://www.toptal.com/emberjs/a-thorough-guide-to-ember-data
• Good example of: "has_many :users through: :ownerships or Representing Intermediate Models"
• http://www.toptal.com/emberjs/a-thorough-guide-to-ember-data#embeddedRecordsMixin
  
• Section on using EmbeddedRecordsMixin for many-to-many
• Calling non-standard REST APIs with ember-data
• http://emberigniter.com/non-standard-rest-actions-ember-data/
  

• Promise/RSVP articles
• http://www.barelyknown.com/blog/2014/12/14/understanding-ember-data-and-rsvp-promise-chaining
  

• Examples Ember Apps
• See -> https://gist.github.com/rwjblue/8816372
• See https://github.com/EmberSherpa/open-source-ember-apps
• At time of writing this post I explored Ember 2.2.x apps below
• https://github.com/szines/bookstore-client
  
• https://github.com/szines/library-app
  
• git clone https://github.com/szines/contacts-app-client.git
• git clone https://github.com/TryGhost/Ghost.git
• git clone https://github.com/ember-cli/ember-twiddle.git
• git clone https://github.com/HospitalRun/hospitalrun-frontend.git
• https://github.com/gaslight/mastering-ember
  
• Ember Workshop
• https://github.com/bazzel/ember2-workshop
  
• User Auth
• https://www.emberscreencasts.com/tags/user-auth
  
• Article on injecting currentUser into routes/controllers:
• http://miguelcamba.com/blog/2015/06/18/how-to-inject-the-current-user-using-ember-simple-auth/
  

• Questions/Problems
• Sub-components and actions not bubbling up automatically
• http://discuss.emberjs.com/t/sub-component-action-not-bubbling-up/6739/7
  
• Closure Actions
• http://emberjs.com/blog/2015/06/12/ember-1-13-0-released.html#toc_closure-actions
• How to call an action on a route using closure actions
• http://stackoverflow.com/questions/31101296/how-to-call-an-action-on-a-route-using-closure-actions
• What should a REST API return for ember-data
• Helped me fix a problem with PUT/POST where I was returning plural in http-mocks, should have been singular.
• http://discuss.emberjs.com/t/what-should-an-api-compatible-rest-server-return/779
• Binding element attributes in a template
• https://guides.emberjs.com/v2.2.0/templates/binding-element-attributes/
• Examining a select box with Ember 2.0
• http://balinterdi.com/2015/08/29/how-to-do-a-select-dropdown-in-ember-20.html
  
• https://gist.github.com/rtablada/280778b093768172cf43
  
• Bootstrap active links with <li active=true>{{link-to}}</li>
• set parent <li> to be active with a child {{link-to}}
• Issue is that ember will mark the {{link-to}} active for you for free based on the router, but bootstrap styling wants the parent, the <li> to be set to active.
• You could do a {{link-to tagName="li"}} this 'works'...but styling is broken since bootstrap expects "li > a"
• So..we need a solution of setting 'active' on the parent <li> based on the active attribute of the child <a> (<a> is {{link-to}}
• http://discuss.emberjs.com/t/bootstrap-active-links-and-lis/5018/4
  
• ember-cli-active-link-wrapper
  
• http://emberobserver.com/addons/ember-cli-active-link-wrapper
  
• https://github.com/alexspeller/ember-cli-active-link-wrapper
  
• Scroll to top of page on each ember route
• https://spin.atomicobject.com/2016/06/06/ember-scroll-to-top
  
• Components
• Building an auto-complete component
• http://balinterdi.com/2015/09/10/complex-component-design-in-ember-intro.html
  
• Notes/Checklist for building your own component
• 
  

• General Ember Blogs
• http://emberigniter.com/
  
• Conference Talks
• EmberConf 2015 Opening Keynote
• https://www.youtube.com/watch?v=o12-90Dm-Qs&feature=youtu.be&t=47m21s
  

• Screencasts
• https://www.emberscreencasts.com/
  

• Podcasts:
• http://ember.land/ 
  

• Helpers:
• Ember Truth Helpers (provides 'eq' helper)
• https://github.com/jmurphyau/ember-truth-helpers

• Javascript Links
• Javascript Inheritance, Prototypal Inheritance
• https://medium.com/javascript-scene/common-misconceptions-about-inheritance-in-javascript-d5d9bab29b0a#.8c0vwyqi3
• Wizard
• http://stackoverflow.com/questions/21620782/multi-step-form-or-multiple-pages-in-one-route-using-ember-js
  

• AddOns
• https://github.com/miguelcobain/ember-cli-selectize
  
• Testing:
• Ember CLI Mirage
• http://www.programwitherik.com/ember-mirage-tutorial-and-examples/
  
• Asset Compilation with ember-cli
• http://chnn.github.io/ember-cli/docs/asset-compilation/
  

• What is Ember.K
• http://ember.zone/what-the-hell-is-ember-k/ 
• Making methods safe to call in the event that they might be undefined at the time of calling.
• Providing hooks for subclasses to implement in a safe way.
• Creating stand in action event handlers until you are ready to implement the necessary logic, and avoid Ember.js throwing an error.
• Creating a closure action on a nested component
• On the template
• {{my-component saveAction=(action 'saveControllerAction')}}
• Assumes 'saveControllerAction' is an action defined on the controller.
• saveControllerAction() calls this.send('saveRouteAction', this.get('model'))
• It's important the action name is different between controller and router, if they are same you run into a circular reference and will stack overflow.