Display and filter activities

The list of over 200 activities (the building blocks of experiments) is statically generated, and filtered client-side.

Not needing additional API calls makes the interface feel responsive and fast.

Recommended activities and parameters input

When a user selects a first action, he is taken to the builder itself. If applicable, a modal windows presents recommended activities, that are often played in conjonction with the first one.

Once the builder is displayed, each action can be configured (setting parameters, such as targets or thresholds), and more activities can be added to the experiment.

Drag to rearrange

Order matters a lot in experiments. Activities can dragged across sections and reordered.

Fine settings

Users also have access to additional settings for each experiment section. One important goal of the builder was to keep all of the many settings that are available when writing an experiment JSON file, so we would not sacrifice configurability for user-friendliness.

More about Reliably

Reliably was a startup funded by the creators of the open source Chaos Toolkit. Having helped them on branding work, I was asked to join their company, ChaosIQ, when it raised seed funding from Accel in early 2019, to build a full-fledged chaos engineering platform on top of Chaos Toolkit.

Upon years of creating the platform, building in new features, and I worked with various tech stacks, all revolving, for the front-end side, around Vue.js and TypeScript.

The first version of the product, named ChaosIQ, was a dashboard and data platform for Chaos Toolkit. While experiments and execution data were stored locally by Chaos Toolkit, ChaosIQ allowed users to store data and experiments in a same place and share it with their team and within their organization, in order to make chaos engineering beneficial to a larger number of users.

This version of the product was built using TypeScript, Vue.js 2, and Vuex store. This stack was used to build an SPA that fetched data from the APIs of a Python backend.

The logos for TypeScript, Vue.js, and Python.

In 2021, a major change in the product scope, evolving from a chaos engineering platform to an observability platform was the occasion to update the front-end stack, while the back-end went through a major overhaul.

The new product, named Reliably, was built with TypeScript, the brand new (at the time) Vue 3 with the Composition API, and what was not yet the official Vue store, Pinia.. The back-end was written in Go, which honeslty made little difference to me, as my impact on the back-end codebase is limited at best.

The introduction of GitHub Actions allowed switch our build and deployment process from Jenkins. The approachable YAML workflows makes it easy for each team to create and maintain workflows for their own products.

The logos for Vue.js, Pinia, TypeScript and Go.

In 2023, we attempted to lift two of the main friction points for users:

  • letting them create experiments with a visual interface,
  • running experiments without leaving the SaaS product.

To accomodate for a smaller team, and the need for front-end to be manageable by non-(front-end)-specialists, I decided to use Astro, a static site generator we add been used for our website, as the foundation of the new Reliably. Coupled with the very lightweight, framework-agnostic, NanoStores, it serves as the basis for the platform, while all business-logic work can be written using any JavaScript framework, even mixing them it needed. I still decided to use Vue 3, and this new stack proved both performant and developer-friendly, allowing us to build new features at a quick pace.

The logos for Astro, Vue.js, TypeScript and Python.