Feature Factions Mobile - Cooperate and Battle with DevCycle Feature Flags

This is a submission for the DevCycle Feature Flag Challenge: Feature Flag Funhouse

What I Built

For this challenge, I built a role-playing game in React Native where players remit their mined gold to their faction's bank and collectively unlock features. The more players a faction recruits, the faster that faction can buy feature upgrades.

Welcome to Feature Factions, where the fate of three ancient races rests in your hands! Will you join the precise and mechanical Aetheron, the resilient and cunning Bessari, or the mystical and graceful Calenwyn? Mine resources to fuel your faction’s treasury—the Aetheron Central Node 🤖, the Bessari Guild Vault 🧑‍🏭, or the Calenwyn Sylvan Reliquary 🧝‍♀️. Work with your allies to unlock powerful upgrades and strategize for the ultimate showdown. The war is coming—#StopPretending 🧙and #StartShipping 🚀

Demo

These are original sprites I designed, inspired by Realm of the Mad God.

For the first "upgrade", all Factions get a baseline option.

I used Permission Feature Flags, and gated based on the UserFaction property. The Bessaris get Configuration 2:

My Code

https://github.com/bytehala/feature-factions-rpg

My DevCycle Experience

A rocky start, but overall good.

I followed the React Native quickstart, and I kept getting UserError: Invalid SDK key provided when I used the mobile SDK key.

To debug this, I installed the DevCycle CLI and worked to rule out React Native as the source of the error. This led me to discover the dvc keys get command, which showed the same keys I was seeing in my dashboard. Interestingly, the client key worked in my React Native app, but the mobile SDK key did not.

The DevCycle documentation that I needed for React Native, CLI, and the Management API are quite thorough. I like that the CLI is available, as well as the Management API. These allowed me to quickly test features and contextualize DevCycle feature flags outside of my Feature Factions code without having to scaffold a brand new app.

# Getting an auth token in the command line via cURL:
curl --request POST \
  --url "https://auth.devcycle.com/oauth/token" \
  --header 'content-type: application/x-www-form-urlencoded' \
  --data grant_type=client_credentials \
  --data audience=https://api.devcycle.com/ \
  --data client_id=<client id> \
  --data client_secret=<client secret>

I also like that the client app can identify with DevCycle using custom data. It opens up possibilities such as the app "asking" for features because of an on-device trigger or threshold that gets reached, for example, if the user has interacted enough times with the app, it can ask the backend if there are newly configured features or rewards.

The diagram below illustrates how a backend service would enable features for Factions when they reach a Gold threshold or other conditions:

Since this is a proof of concept (POC), I didn’t create an actual backend. However, I was able to simulate the backend functionality by using a cURL command to enable features for the Factions, thanks to the DevCycle Management API.

This was a fun challenge overall, and the prompt really made me think of feature flags in a new light.