Skip to main content

Use Case: Managing Feature Flags with Replane

· 4 min read
Replane Team
Replane Team
Replane Core Team

Feature flags are one of the most common use cases for configuration management. Let's explore how Replane makes feature flags simple and powerful.

What Are Feature Flags?​

Feature flags (also called feature toggles) let you enable or disable features without deploying new code. This enables:

  • Safe releases: Deploy code with features off, then enable them gradually
  • A/B testing: Show different features to different users
  • Kill switches: Quickly disable problematic features
  • Gradual rollouts: Release to 1% → 10% → 50% → 100% of users

Basic Setup​

Create a config named feature-flags:

{
  "new-onboarding": true,
  "dark-mode": false,
  "billing-v2": false,
  "advanced-search": true
}

In your application:

import { createReplaneClient } from 'replane-sdk';

const client = createReplaneClient({
  apiKey: process.env.REPLANE_API_KEY,
  baseUrl: process.env.REPLANE_URL,
});

const flags = await client.getConfigValue('feature-flags');

if (flags['new-onboarding']) {
  return renderNewOnboarding();
} else {
  return renderOldOnboarding();
}

Real-World Example: E-commerce Checkout​

You're redesigning the checkout flow. Deploy it behind a flag:

{
  "new-checkout-flow": false
}

Day 1: Enable for internal team

{
  "new-checkout-flow": false,
  "new-checkout-internal": ["team@company.com"]
}

Day 3: Enable for 5% of users

{
  "new-checkout-percentage": 5
}

Day 5: Issues found, disable immediately

{
  "new-checkout-percentage": 0
}

Day 7: Issues fixed, re-enable for 10%

{
  "new-checkout-percentage": 10
}

Day 10: Full rollout

{
  "new-checkout-percentage": 100
}

Percentage-Based Rollouts​

Implement deterministic hashing for consistent user experience:

function hashUserId(userId) {
  let hash = 0;
  for (let i = 0; i < userId.length; i++) {
    hash = ((hash << 5) - hash) + userId.charCodeAt(i);
    hash = hash & hash;
  }
  return Math.abs(hash);
}

function isFeatureEnabled(userId, featureName) {
  const rollouts = await client.getConfigValue('rollouts');
  const percentage = rollouts[featureName] || 0;
  const hash = hashUserId(userId) % 100;
  return hash < percentage;
}

// Usage
if (isFeatureEnabled(user.id, 'new-checkout')) {
  // User sees new checkout (consistent for this user)
}

User Cohort Targeting​

Target specific user groups:

{
  "beta-users": ["user-123", "user-456"],
  "internal-team": ["team@company.com"],
  "premium-customers": true
}

Check membership:

const cohorts = await client.getConfigValue('cohorts');

function hasAccess(user, featureName) {
  const betaList = cohorts['beta-users'] || [];
  if (betaList.includes(user.id)) return true;

  const internalList = cohorts['internal-team'] || [];
  if (internalList.includes(user.email)) return true;

  if (user.isPremium && cohorts['premium-customers']) return true;

  return false;
}

Safety with JSON Schema​

Prevent invalid flag configurations:

{
  "type": "object",
  "properties": {
    "new-onboarding": { "type": "boolean" },
    "dark-mode": { "type": "boolean" },
    "billing-v2": { "type": "boolean" }
  },
  "additionalProperties": false,
  "required": ["new-onboarding", "dark-mode"]
}

This ensures:

  • Only boolean values allowed
  • Required flags are always present
  • No typos in flag names

Realtime Updates​

Use watchers for instant updates:

// Initialize once
const flags = await client.watchConfigValue('feature-flags');

// Use anywhere in your app
function isEnabled(flagName) {
  return flags.get()[flagName] || false;
}

// Value updates automatically when changed in Replane UI

No restart required. Changes propagate in seconds.

Monitoring & Analytics​

Track feature flag usage:

analytics.track('feature_accessed', {
  feature: 'new-checkout',
  enabled: isEnabled('new-checkout'),
  userId: user.id
});

Compare conversion rates between variants to make data-driven decisions.

Emergency Rollback​

Something went wrong? Revert instantly:

  1. Open Replane UI
  2. Navigate to feature-flags
  3. Click "Version History"
  4. Select previous version
  5. Click "Rollback"

Changes propagate to all app instances in seconds.

Best Practices​

Use Descriptive Names​

// ❌ Bad
"flag1": true

// ✅ Good
"new-checkout-flow-enabled": true

Create separate configs for different domains:

  • feature-flags - UI features
  • api-flags - API behavior
  • experiments - A/B tests

Default to Safe Values​

const flags = await client
  .getConfigValue('feature-flags')
  .catch(() => ({
    'new-feature': false  // Safe default
  }));

Document Flags​

Maintain a README listing:

  • What each flag does
  • Owner
  • Removal plan

Clean Up Old Flags​

After full rollout, remove the flag:

  1. Set to final value (usually true)
  2. Deploy code without the flag check
  3. Delete from config (or keep for audit history)

When NOT to Use Feature Flags​

Avoid flags for:

  • Permanent configuration (use environment variables)
  • Secrets (use a secret manager)
  • Code that always changes together (deploy normally)

Use flags for temporary switches that control behavior independently from code deployments.

Next Steps​

Want to try feature flags with Replane? Check out the Quickstart Guide.