Skip to content

Latest commit

 

History

History
297 lines (208 loc) · 6.79 KB

File metadata and controls

297 lines (208 loc) · 6.79 KB
title description
JavaScript SDK and Express
Getting Started with the OpenFeature JavaScript SDK on Express

import FlagdContent from '@site/src/components/custom/tutorial/flagd-content.mdx'; import FlagdChangeContent from '@site/src/components/custom/tutorial/flagd-change-content.mdx'; import WhyDefaultContent from '@site/src/components/custom/tutorial/why-default-content.mdx'; import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem';

Getting Started with the OpenFeature JavaScript SDK on Express

Introduction

This walk-through teaches you the basics of using OpenFeature with JavaScript using Express. You'll learn how to:

  • Install the JavaScript SDK
  • Install and configure a provider
  • Perform basic feature flagging

Requirements

This walk-through assumes that:

  • You have a basic understanding of JavaScript, Node.js and Express. If not, please review the Introduction to Node.js and the Express documentation.
  • You have Node 16 or later. The latest version of Node can be found here.
  • You have Docker installed and running on the host system. The latest version of Docker can be found here.

Walk-through

Step 1: Create a new Node.js project

To get started, create a new folder, bootstrap the project, and install the dependencies. This can be done by running the following commands.

mkdir openfeature-js-intro
cd openfeature-js-intro
npm init -y
npm install express
mkdir openfeature-ts-intro
cd openfeature-ts-intro
npm init -y
npm install express
npm i -D typescript @types/express @types/node ts-node
npx tsc --init

Step 2: Create an Express app

Create a new file named index.js and include the following code.

const express = require('express');

const app = express();
const port = 8080;

app.get('/', (_, res) => {
  res.send('Express + TypeScript Server');
});

app.listen(port, () => {
  console.log(`⚡️[server]: Server is running at http://localhost:${port}`);
});

Create a new file named index.ts and include the following code.

import express from 'express';

const app = express();
const port = 8080;

app.get('/', (_, res) => {
  res.send('Express + TypeScript Server');
});

app.listen(port, () => {
  console.log(`⚡️[server]: Server is running at http://localhost:${port}`);
});

Step 3: Add the OpenFeature SDK

Let's install the OpenFeature SDK using the following command.

npm install @openfeature/server-sdk

Update index.js to import the SDK.

const express = require('express');
// diff-add 
const { OpenFeature } = require('@openfeature/server-sdk');

Update index.ts to import the SDK.

import express from "express";
// diff-add
import { OpenFeature } from "@openfeature/server-sdk";

Once you've imported OpenFeature, a new client can be created.

const port = 8080;
// diff-add
const client = OpenFeature.getClient();

The client can now be used to get a feature flag value. In this case, we'll get a boolean value using the welcome-message flag key.

The second argument is the fallback value, which is returned if there's abnormal behavior.

// diff-remove
app.get("/", (_, res) => {
// diff-add-block-start
app.get("/", async (_, res) => {
  const showWelcomeMessage = await client.getBooleanValue("welcome-message", false);
  if (showWelcomeMessage) {
    res.send("Express + TypeScript + OpenFeature Server");
  } else {
// diff-add-block-end
// diff-remove
  res.send("Express + TypeScript Server");
// diff-add-block-start
    res.send("Express + TypeScript Server");
  }
// diff-add-block-end
});

Step 4: Run the application

Let's start the app and see it in action. Run the following command to start the server.

node index.js
npx ts-node index.ts

Open your favorite browser and navigate to http://localhost:8080. If all goes as planned, you should see "Express + TypeScript Server" in glorious monochrome.

NOTE: You should stop the app by using the keyboard short ctrl + c before moving on to the next step.

Step 5: Configure a provider (flagd)

Now let's make the required code changes in our application.

Using NPM, install the flagd provider with the following command:

npm install @openfeature/flagd-provider

Now, update index.js to import the flagd provider.

const { OpenFeature } = require('@openfeature/server-sdk');
// diff-add
const { FlagdProvider } = require('@openfeature/flagd-provider');

Now, update index.ts to import the flagd provider.

import { OpenFeature } from "@openfeature/server-sdk";
// diff-add
import { FlagdProvider } from "@openfeature/flagd-provider";

Finally, we need to register the provider with OpenFeature.

const port = 8080;

// diff-add
OpenFeature.setProvider(new FlagdProvider());
const client = OpenFeature.getClient();

Step 6: Rerun the application

Now that everything is in place, let's start the app again.

node index.js
npx ts-node index.ts

Open your favorite browser and navigate to http://localhost:8080 should show the same value as before. This difference is now the feature flag value can be changed at runtime!

Save the changes to flag.json and refresh the browser tab. You should now be greeted with Express + TypeScript + OpenFeature Server.

Conclusion

This walk-through introduced you to the OpenFeature JS SDK. It covered how a provider can be configured to perform the flag evaluation and introduced basic feature flagging concepts. It also showcased how feature flags can be updated at runtime, without requiring a redeployment.