The modern web developer has an incredible selection of open source code that they can use, plus great tools for writing their own modules. There are thousands of packages that are made specifically for the Ember ecosystem. We call such packages "addons." Ember developers are also free to use regular npm packages in their apps.
Think of addons as node libraries with superpowers. In addition to the usual functionality of an npm package, addons can also help with generating new files, preprocessing, file fingerprinting, and more.
Finding and using community addons
Ember Observer is a great way to explore community addons. Although addons can be found by searching the npm repository directly, Ember Observer has ranked lists of the most popular addons and ratings to help developers choose between them. Ember Observer is a community-run project that has some subjective aspects to the addon ratings.
Most addons are made to drop right into your app with zero configuration. Many addons are backwards-compatible with earlier versions of Ember too!
To install an addon, use:
ember install <addon-name>
To be safe, it's a good idea to restart the local server after installing new dependencies, and especially before trying to debug an addon that isn't working. Also, be sure to check out an addon project's README to see if there are any additional installation steps to take.
ember install command is similar to the
npm install you might already be familiar with. It creates an entry in the app's
package.json and downloads the addon and its dependencies into a
node_modules directory. However,
ember install does even more than
npm. Some addons create new files or make modifications to your app when they are installed via
Choosing an addon
The top 100 list is an important first stop for new developers. Many Ember users have a list of addons that they include in all their apps, and this is the best way to browse some of them. Some addons are totally unique to Ember, while others exist to make it easier to use features of regular npm packages within an app.
For example, these community-authored addons bring in familiar functionality from regular npm packages:
- Stylesheet tooling like ember-cli-sass, which provides Sass as an alternative to standard CSS.
- Full UI frameworks and design kits like ember-bootstrap, semantic-ui-ember, and ember-paper. These offer easier, more reliable, more performant functionality than just using the npm packages directly.
- TypeScript support through ember-cli-typescript.
- Charting libraries like ember-d3.
Here are examples of popular community-maintained addons that are unique to Ember, in no particular order:
- A wealth of UI component libraries, like ember-power-select and ember-basic-dropdown.
- Tools to automate deployments, like ember-cli-deploy and its own ecosystem of plugins.
- Testing tools like ember-test-selectors, to make DOM assertions in testing easier and clearer, and ember-a11y-testing to check for accessibility.
- Authentication libraries and plugins, like torii and ember-simple-auth, and ember-oauth2.
- Async and state management tools like ember-concurrency and ember-lifeline. Don't let a user's impatient clicks kick off 100 API requests.
- liquid-fire, for animating things like route transitions to provide a smooth, native-app-like experience.
- ember-intl for internationalization of dates, numbers, and currencies.
- ember-cli-mirage for stubbing data that would come from an API.
There are too many amazing addons to mention them all here! We thank everyone who shares their work with others through public addons.
Who creates addons?
People who are a lot like you!
This incredible ecosystem is possible thanks to the maintainers, contributors, and companies that donate their time to Open Source projects. If an addon doesn't work the way you expect, could be better documented, has a bug, or needs a new feature, please speak up and pitch in! Help from the community is essential to improve these projects and keep them healthy.
Learn more about how to write or contribute to addons in Writing Addons.