Maison >interface Web >js tutoriel >Indicateurs de fonctionnalités avec Express.js et GrowthBook

Indicateurs de fonctionnalités avec Express.js et GrowthBook

Mary-Kate Olsen
Mary-Kate Olsenoriginal
2024-12-12 15:33:12765parcourir

Ce guide explique comment ajouter des indicateurs de fonctionnalités GrowthBook à une application Express.js. Cela suppose que vous partez de zéro, donc si vous disposez déjà d'une application Express.js, vous pouvez passer à l'étape 2.

1. Créez une application Express.js

Tout d'abord, installez Express.js

npm install express

Ensuite, créez un fichier index.js avec une simple route hello world

const express = require('express')
const app = express()

app.get('/', (req, res) => {
  res.send('Hello World!')
})

// Listen on port 3000
const port = 3000
app.listen(port, () => {
  console.log(`Example app listening on port ${port}`)
})

Enfin, lancez l'application avec :

node index.js

Visitez http://localhost:3000 et vous devriez voir un message « Hello World ! » réponse !

2. Créez un compte GrowthBook

GrowthBook peut être auto-hébergé, mais pour plus de simplicité, nous utiliserons GrowthBook Cloud dans ce guide, qui est gratuit pour des projets simples comme celui-ci.

Allez sur https://app.growthbook.io et créez un nouveau compte si vous n'en avez pas encore.

Une fois connecté, créez une Connexion SDK et sélectionnez Node.js comme langue. Cela générera une Clé client unique pour vous. Gardez note de cette clé car nous l'utiliserons à l'étape suivante.

3. Intégrez le SDK JavaScript GrowthBook dans l'application Express.js

Créez le fichier .env s'il n'existe pas encore et ajoutez-y la clé générée :

GROWTHBOOK_API_HOST=https://cdn.growthbook.io
GROWTHBOOK_CLIENT_KEY=

Installons maintenant le SDK JavaScript GrowthBook

npm install @growthbook/growthbook

Modifions maintenant le haut du fichier index.js et créons une instance de GrowthBookClient :

const express = require('express')
const app = express()
const { GrowthBookClient } = require("@growthbook/growthbook")

// GrowthBookClient instance
const client = new GrowthBookClient({
  apiHost: process.env.GROWTHBOOK_API_HOST,
  clientKey: process.env.GROWTHBOOK_CLIENT_KEY
});

// Initialize it
client.init().then((status) => {
  console.log("GrowthBook initialized", status);
});

Ajoutons également un middleware à index.js qui crée une instance à l'échelle de l'utilisateur pour chaque requête. Assurez-vous de le placer au-dessus des gestionnaires de route :

app.use((req, res, next) => {
  // Attributes about the current user/request
  const userContext = {
    attributes: {
      // In a real app this would come from a cookie or session
      // We would also add more attributes like country, etc
      id: "123",
    }
  }

  // Make this available to all subsequent route handlers
  req.growthbook = client.createScopedInstance(userContext);
  next();
});

Redémarrons le processus Node et assurez-vous que vous voyez le message "GrowthBook initialisé" dans la console et que l'état est réussi. Puisque nous utilisons un fichier .env, nous devons modifier la commande pour dire à Node.js de le charger.

node --env-file=.env index.js

4. Créer une fonctionnalité dans GrowthBook

De retour dans l'application GrowthBook, nous pouvons créer une nouvelle fonctionnalité. Pour ce tutoriel, nous allons créer un simple indicateur de fonctionnalité marche/arrêt qui détermine si nous affichons ou non le message en espagnol.

Feature Flags with Express.js and GrowthBook

La clé que nous avons choisie (salutation en espagnol) est celle à laquelle nous ferons référence lors de l'utilisation du SDK GrowthBook.

Nous pouvons maintenant éditer la route dans index.js pour utiliser ce flag :

app.get('/', (req, res) => {
  let message = "Hello World!";

  if (req.growthbook.isOn("spanish-greeting")) {
    message = "Hola Mundo!";
  }

  res.send(message);
})

Maintenant, si vous redémarrez le processus Node et actualisez la page dans le navigateur, vous verrez toujours le message « Hello World ! » d'origine. car lorsque nous avons créé la fonctionnalité, nous l'avons définie sur Désactivée par défaut.

5. Cibler des utilisateurs spécifiques

Nous pouvons désormais ajouter des règles à la fonctionnalité pour l'activer pour des utilisateurs spécifiques.

Dans le userContext que nous avons ajouté, nous avons codé en dur un identifiant de "123". Nous pouvons maintenant utiliser cet identifiant pour créer une règle dans GrowthBook afin d'activer la fonctionnalité pour cet utilisateur.

Sur la page des fonctionnalités, cliquez sur le bouton « Ajouter une règle » et sélectionnez « Forcer la valeur » comme type de règle. Ajoutez ensuite le ciblage par attribut et enregistrez la règle. Cela devrait ressembler à ceci :

Feature Flags with Express.js and GrowthBook

Les règles commencent à l’état de brouillon dans GrowthBook. Vous devez publier le brouillon pour le faire vivre.

Après la publication, redémarrez le processus Node et actualisez la page. Vous devriez maintenant voir le message en espagnol. ¡Qué bueno !

Essayez de changer l'identifiant dans userContext par quelque chose d'autre comme 456, redémarrez Node et la réponse reviendra désormais à l'anglais.

Conclusion et prochaines étapes

Dans ce didacticiel, vous avez appris à utiliser un simple indicateur de fonctionnalité dans une application Express et à cibler des utilisateurs individuels. Mais cela ne fait qu’effleurer la surface de ce que vous pouvez faire avec GrowthBook.

Voici quelques prochaines étapes que vous pouvez suivre :

  • Utiliser un ciblage plus avancé
  • Exécuter des tests A/B

Consultez la documentation complète de Node.js pour plus d'informations sur toutes les options disponibles dans le SDK GrowthBook, y compris les mises à jour en streaming, la mise en cache persistante, et bien plus encore.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn