Ember Libraries and Addons

Talk about how Ember extension libraries and addons extend the core framework and are distributed so they can be installed easily.

Transcript

1. Ember.js Libraries and Addons
2. Marco Otte-Witte http://simplabs.com
4. Ember is great but there are a lot of libraries and addons already
5. ember-animated-outlet https://github.com/billysbilling/ember- animated-outlet
6. ember-data https://github.com/emberjs/data
7. epf https://github.com/getoutreach/epf
8. list-view https://github.com/emberjs/list-view
9. Ember Simple Auth https://github.com/simplabs/ember-simple-auth
10. How do those actually extend Ember?
11. Ember can be extended on many levels
12. Adding new classes to the Ember namespace
13. //list-view/packages/list-view/lib/main.js import ListView from 'list-view/list_view'; … Ember.ListView = ListView; …
14. Reopening Ember's classes
15. //ember-animated-outlet/src/js/router.js Ember.Router.reopen({ … transitionToAnimated: function( name, animations, model ) { … }, …
16. Registering Handlebars helpers
17. //list-view/packages/list-view/lib/main.js import EmberList from 'list-view/helper'; … Ember.Handlebars.registerHelper( 'ember-list', EmberList );
18. injecting functionality into an application's objects via the container
19. the container is Ember's dependency injection implementation http://emberjs.com/guides/understanding- ember/dependency-injection-and-service- lookup/
20. injecting functionality into an application's objects via the container
21. Demo Ember Simple Auth
22. How are libraries and addons distributed?
23. There are basically 3 ways to build an Ember application
24. Globals
25. <script> tags, using the Ember global
26. install libraries or addons by adding another <script> tag, use the exported global
27. Demo Ember Simple Auth
28. some build system using AMD
29. install libraries or addons by adding the AMD distribution to the project
30. require some module that sets the extension up
31. Demo Ember Simple Auth
32. Ember CLI (this is what you should be using)
33. Ember CLI 0.0.35 added the concept of addons
34. install libraries or addons by installing the respective npm package npm install --save-dev ember-cli-simple-auth
35. Ember CLI Addons have a special package.json property "ember-addon": { "main": "index" }
36. Ember CLI Addons can define generators ember generate ember-cli-simple-auth
37. Ember CLI Addons can implement build-time hooks
38. everything in an addon's /app directory will be treated as part of the application
39. Demo Ember Simple Auth
40. Ember CLI can generate an Addon for you ember generate addon <my-addon>
41. implement your own Ember libraries and addons!
42. …and use the Ember CLI Addon mechanism to do it
43. Thanks
44. Q&A