background-shape
feature-image

Feature flagging is a technique used in software development to turn on and off certain features within an application, without requiring a full deployment. This can be useful for testing new features or providing different experiences to different groups of users. In this blog post, we will show you how to master feature flagging using ReactJs, Golang, and Github Actions.

Step 1: Define the feature flag

The first step in mastering feature flagging is to define the flag. We can do this by creating a configuration file that contains all the feature flags for our application. For example, we can create a JSON file with the following content:

1
2
3
4
{
  "featureA": false,
  "featureB": true
}

The featureA flag is set to false, which means it is turned off, while the featureB flag is set to true, which means it is turned on.

Step 2: Implement the feature flag in ReactJs

Now that we have defined the feature flag, we can use it in our ReactJs application. We can create a component that checks the value of the flag and displays the appropriate content. For example, we can create a FeatureA component that displays a message if featureA is turned on:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
import features from './config.json';

function FeatureA() {
  if (features.featureA) {
    return (
      <div>
        <h1>Feature A is on!</h1>
      </div>
    );
  }
  return null;
}

export default FeatureA;

The features variable is imported from the configuration file we created in step 1. If featureA is turned on, the component displays a message. Otherwise, it returns null.

Step 3: Implement the feature in Golang

Next, we need to implement the feature flag in our Golang application. We can do this by checking the value of the flag before executing certain code. For example, we can create a function that only executes if featureB is turned on:

1
2
3
4
5
6
7
8
9
package main

import "github.com/Unleash/unleash-client-go"

func main() {
  if unleash.IsEnabled("featureB") {
    // Run feature B code
  }
}

The unleash.IsEnabled() function is provided by the Unleash client library for Golang. It checks the value of the feature flag and returns true or false.

Step 4: Integrate with Github Actions

Finally, we can streamline our feature flagging process by integrating with Github Actions. We can create a workflow that automatically deploys changes to our application when a feature flag is turned on or off. For example, we can create a workflow that deploys changes to our ReactJs application when the config.json file is updated:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
name: Deploy React App
on:
  push:
    paths:
      - 'client/**'
jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - run: npm install
      - run: npm run build
      - uses: peaceiris/actions-gh-pages@v3
        with:
          personal_token: ${{ secrets.PERSONAL_TOKEN }}
          publish_branch: gh-pages
          publish_dir: ./client/build

This workflow runs whenever changes are pushed to the client folder of our repository. It installs dependencies, builds the ReactJs application, and deploys the changes to the gh-pages branch using a personal access token stored in Github Secrets.

Conclusion

By following these simple steps, you can master feature flagging in your ReactJs and Golang applications using Github Actions. This technique can help you test new features, provide different experiences to different users, and streamline your development process.