Thanks to Tom Grünbauer for sharing their work on Unsplash

At Trouva, we’re constantly faced with different challenges. One of them arose this past week, while building another amazing feature for our beloved retailers, whose dashboard is built using Ember.js. The requirement was the following:

After a user successfully completes an action in the Product page, we want to display a special message in a modal after transitioning to the Catalogue page.

As we didn’t want to globally store such a ephemeral state (e.g. in a Service), we opted to go with a query parameter when transitioning from the Product page back to the Catalogue page. …


Photo by chris panas on Unsplash

At Trouva (we’re hiring!) we’re always aiming to improve our retailers’ experience by providing them with features to help them build their business around the world. Ember.js is the technology that powers up our retailer’s platform.

While building a new feature for retailers, we encountered the following problem:

We must prevent users from directly accessing the new welcome route, but we want to be able to send them ourselves to that route.

Using ember.js, we can very simply solve this problem.

We want to ensure this behaviour is triggered before the model is loaded, so we’ll implement the logic in…


Fig.1 — Retrieved from https://www.nextafter.com/blog/ab-testing-guide-for-non-profits/

Disclaimer: This guide does not include the configuration of Google Optimize’s experiments.

At Uniplaces, we use A/B testing to test several variations or new features across our entire spectre of products, ranging from our student’s application to our landlord’s dashboard and even internal tools.

For the past years, we have used several A/B testing solutions, including a very well-known one called VWO (Visual Website Optimizer) which has served us well.

During this first quarter, our Product Managers decided that it was time to switch and to try Google Optimize. …


As Uniplaces’ business grows more and more, we continue to build new web applications using Ember.js. Due to the amount of new applications based upon Ember.js arising in our company, we felt that ember new wasn’t providing the optimal solution for starting a new Ember.js project from scratch.

Therefore, our team decided to build our own custom Ember.js application bootstrap, containing a default configuration to start a brand new Ember.js application.

Fig. 1 — Light up your Ember.js application faster than ever

The first step to build our bootstrap was to generate a brand new Ember.js application using EmberCLI— ember new ember-bootstrap.

Long live the pods structure

A brand new Ember.js application generated using ember new


Feature flags — a topic that brings a lot of discussion to the table. Although it might seem an easy concept, it’s rather complex. If misused, the consequences can be very hard to reverse and your codebase might be forever polluted with several feature flags that are either always active or always inactive. This is a small opinion article about feature flags and why, when and how should you use them.

First things first: what is a feature flag (also known as feature toggle)? Pete Hodgson wrote an article that deeply explains feature flags.

Feature Flags are a powerful technique…


Fig. 1 — Building your own {{#LINK-to}} (source)

Sometime ago, I was given the task to build a progress bar in an Ember project. The design doesn’t really matter for the purpose of this (small) article. The requirements were the following:

  • A step can have 3 states: completed, current, to-be-done
  • A user can navigate to previously completed steps independently, by clicking on the step
  • Steps to-be-done must be disabled, i.e, the user cannot go to a to-be-done step through the progress bar

First iteration: Using the {{#link-to}} helper

After reading the requirements, I instantly thought about using the {{#link-to}} helper to make the steps. …


Say “Hello!” to our beloved Tomster!

One year ago at Uniplaces, we had only one ember.js project. Nowadays, we have almost our front-end platforms build on top of ember and we’ve come up with this simple five-step recipe to keep an ember.js project clean and well-structured.

Step 1 — Using pods structure

The first step is making use of ember’s pods structure.

Disclaimer: This is not the default ember project structure. By default, an ember’s project blueprint aggregates files by their type (Fig. 1).

André Joaquim

Product Engineer at Trouva and an Ember.js enthusiast

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store