Blog

Using ember-freestyle as a component playground

A component playground is an application that you can use to test out and play around with your custom components in isolation from the rest of your project. In the React and Vue ecosystem Storybook is a quite popular project that implements such a component playground as part of your app. In the Ember ecosystem we have the ember-freestyle addon that can be used for this purpose. This blog post will show you how to install ember-freestyle in your app and how to use it to build and test components in isolation.

Enginification

We recently improved the initial load time of an Ember.js app for mobile clients, by using Ember Engines and leveraging that to lazily loaded parts of the app's code. In this blog post we're going to show how we extracted the engine out of the app and discuss some smaller issues we ran into along the way and how we solved them. So let's dive right in!

ember-test-selectors: The road to 1.0

Back in January we wrote about the latest changes in ember-test-selectors and how we implemented them. Since then we adjusted a few things and this blog post should give you an idea what has happened so far and what else will happen before we feel comfortable promoting the addon to v1.0.0.

High Level Assertions with qunit-dom

At EmberFest this year we presented and released qunit-dom. A plugin for QUnit providing High Level DOM Assertions with the goal to reduce test complexity for all QUnit users. This blog post will show you how to write simpler tests using async/await and qunit-dom.

Magic Data in Tests

Often when working on large codebases, my changes break some existing tests. While I would prefer my coding to be perfect, it's highly unlikely that I'll ever achieve the state of coding zen, so it's nice to know I have a test suite to catch me when I fall. Given that the codebase is large and in the majority not written by me, I tend to be introduced to code via the test files. One important principle I've started to follow when writing and refactoring tests is AAA.

Creating Web Components with Glimmer

At this year's EmberConf the Ember core team officially announced the release of Glimmer - a light-weight JavaScript library aimed to provide a useful toolset for creating fast and reusable UI components. Powered by the already battle-tested Ember-CLI, developers can build their Glimmer apps in an easy and efficient manner as they already came to love building applications in Ember.js before.

On Computed Properties vs. Helpers

Ember's computed properties are a great mechanism for encapsulating reactive logic and implementing consistent, auto-updating UIs. Since the past year or so though, there seems to be an increasing tendency in the community to use template helpers as the main tool for expressing this kind of logic right in the templates. Following up on a talk I gave at last year's EmberFest, I'll elaborate in this post why I think that is often not the best choice and what the drawbacks are.

Using npm libraries in Ember CLI

tl;dr Use npm instead of Bower whenever you can!

With Ember 2.11 we are now using the ember-source module and no longer the ember Bower package. In the upcoming Ember CLI 2.12 release, Bower will also no longer be installed by default and only install lazily when an addon requests it. All this indicates that from now on we should try to use npm packages instead of Bower whenever possible. This blog post will explain how we can do that and what options are available to us.

Class based Computed Properties

We think Computed Properties in Ember are awesome. We also think they are in many cases the better alternative to template helpers as they allow for cleaner separation of where a computation is triggered and the implementation of that computation. In some cases though it is currently very hard to do things in Computed Properties (and Computed Property macros in particular) that are possible with Class based helpers. With the introduction of Class based Computed Properties we're aiming at making these scenarios solvable easily.

New features for ember-test-selectors

In March 2016 we have released the first version of ember-test-selectors and today we are proud to present you our next milestone: 0.1.0.

While 0.1.0 does not sound like much has changed, the addon has actually gained a lot of new functionality and should be considered our release candidate for 1.0.0.

This blog post will highlight the major changes in this release, and will give you a short introduction into how we have implemented these new features.