Open sourcing our feature toggle API and UI

In our previous post we released our toggle library and showed how to use it in your PHP project, but our goal was to toggle features without the need for a deploy. To accomplish this we created an API with an AngularJS frontend. In this blogpost we’ll show you how the API works and how we use it in combination with the AngularJS frontend.

So how does this API work? Actually pretty simple because we added a (de)serializer to our toggle library. By posting a toggle in JSON to the API it deserializes it and stores it in Redis with a configured prefix.

Getting it to run

After you cloned the repository and ran composer install to install the dependencies, you point your web server to the web directory. In this post we will just use PHP's internal web server.

$ php -S -t web

Now, let's create our first toggle! A toggle that lets specific users see our new feature called 'search_beta'. A curl request for creating that feature looks like this:

$ curl -XPUT -d '{
  "name" : "search_beta",
  "status" : "conditionally-active",
  "conditions" : [
        "name" : "operator-condition",
        "key" : "user_id",
        "operator" : {
           "name" : "in-set",
           "values" : [42, 1337]

Hooray! We created our first toggle. You can retrieve the available toggles by a simple GET on /toggles.

Adding a frontend

Although some people enjoy writing curl commands all day, we wanted to make it even easier by adding a frontend. The frontend shows all the toggles, allowing you to adjust toggles and create new toggles.

Feature Toggle UI

Above example shows the toggle we created via curl, with a single condition. You can change the toggle status to always active or disabled, add or remove conditions or delete the whole toggle. Creating new toggles is possible with the ADD Toggle button.

For a list of all possible operators, check our previous post.


After you cloned the repository, you need to create your config file:

$ cp app/js/config.js.dist app/js/config.js
# Configure your endpoint URL (in this example:
$ vim app/js/config.js

Point your webserver to the app directory to expose the frontend.

The app uses XHR to communicate with the API. Therefor you need to make sure the API allows requests from that origin. By default only requests from are allowed. If you expose the frontend on, it should work out of the box, otherwise you should configure the origin in the API configuration.

Check out the code at and


» We're hiring! «

Come and join us in our quest to build the best development team in the universe...and beyond!