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

Indicateurs de fonctionnalités avec Express.js et GrowthBook

Dec 12, 2024 pm 03:33 PM

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
Copier après la connexion

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}`)
})
Copier après la connexion

Enfin, lancez l'application avec :

node index.js
Copier après la connexion

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=
Copier après la connexion

Installons maintenant le SDK JavaScript GrowthBook

npm install @growthbook/growthbook
Copier après la connexion

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);
});
Copier après la connexion

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();
});
Copier après la connexion

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
Copier après la connexion

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);
})
Copier après la connexion

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 de ce site Web
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

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

Video Face Swap

Video Face Swap

Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Article chaud

<🎜>: Bubble Gum Simulator Infinity - Comment obtenir et utiliser les clés royales
4 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
<🎜>: Grow A Garden - Guide de mutation complet
3 Il y a quelques semaines By DDD
Nordhold: Système de fusion, expliqué
4 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Mandragora: Whispers of the Witch Tree - Comment déverrouiller le grappin
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Sujets chauds

Tutoriel Java
1674
14
Tutoriel PHP
1278
29
Tutoriel C#
1257
24
Python vs JavaScript: la courbe d'apprentissage et la facilité d'utilisation Python vs JavaScript: la courbe d'apprentissage et la facilité d'utilisation Apr 16, 2025 am 12:12 AM

Python convient plus aux débutants, avec une courbe d'apprentissage en douceur et une syntaxe concise; JavaScript convient au développement frontal, avec une courbe d'apprentissage abrupte et une syntaxe flexible. 1. La syntaxe Python est intuitive et adaptée à la science des données et au développement back-end. 2. JavaScript est flexible et largement utilisé dans la programmation frontale et côté serveur.

Javascript et le web: fonctionnalité de base et cas d'utilisation Javascript et le web: fonctionnalité de base et cas d'utilisation Apr 18, 2025 am 12:19 AM

Les principales utilisations de JavaScript dans le développement Web incluent l'interaction client, la vérification du formulaire et la communication asynchrone. 1) Mise à jour du contenu dynamique et interaction utilisateur via les opérations DOM; 2) La vérification du client est effectuée avant que l'utilisateur ne soumette les données pour améliorer l'expérience utilisateur; 3) La communication de rafraîchissement avec le serveur est réalisée via la technologie AJAX.

JavaScript en action: Exemples et projets du monde réel JavaScript en action: Exemples et projets du monde réel Apr 19, 2025 am 12:13 AM

L'application de JavaScript dans le monde réel comprend un développement frontal et back-end. 1) Afficher les applications frontales en créant une application de liste TODO, impliquant les opérations DOM et le traitement des événements. 2) Construisez RestulAPI via Node.js et Express pour démontrer les applications back-end.

Comprendre le moteur JavaScript: détails de l'implémentation Comprendre le moteur JavaScript: détails de l'implémentation Apr 17, 2025 am 12:05 AM

Comprendre le fonctionnement du moteur JavaScript en interne est important pour les développeurs car il aide à écrire du code plus efficace et à comprendre les goulots d'étranglement des performances et les stratégies d'optimisation. 1) Le flux de travail du moteur comprend trois étapes: analyse, compilation et exécution; 2) Pendant le processus d'exécution, le moteur effectuera une optimisation dynamique, comme le cache en ligne et les classes cachées; 3) Les meilleures pratiques comprennent l'évitement des variables globales, l'optimisation des boucles, l'utilisation de const et de locations et d'éviter une utilisation excessive des fermetures.

Python vs JavaScript: communauté, bibliothèques et ressources Python vs JavaScript: communauté, bibliothèques et ressources Apr 15, 2025 am 12:16 AM

Python et JavaScript ont leurs propres avantages et inconvénients en termes de communauté, de bibliothèques et de ressources. 1) La communauté Python est amicale et adaptée aux débutants, mais les ressources de développement frontal ne sont pas aussi riches que JavaScript. 2) Python est puissant dans les bibliothèques de science des données et d'apprentissage automatique, tandis que JavaScript est meilleur dans les bibliothèques et les cadres de développement frontaux. 3) Les deux ont des ressources d'apprentissage riches, mais Python convient pour commencer par des documents officiels, tandis que JavaScript est meilleur avec MDNWEBDOCS. Le choix doit être basé sur les besoins du projet et les intérêts personnels.

Python vs JavaScript: environnements et outils de développement Python vs JavaScript: environnements et outils de développement Apr 26, 2025 am 12:09 AM

Les choix de Python et JavaScript dans les environnements de développement sont importants. 1) L'environnement de développement de Python comprend Pycharm, Jupyternotebook et Anaconda, qui conviennent à la science des données et au prototypage rapide. 2) L'environnement de développement de JavaScript comprend Node.js, VScode et WebPack, qui conviennent au développement frontal et back-end. Le choix des bons outils en fonction des besoins du projet peut améliorer l'efficacité du développement et le taux de réussite du projet.

Le rôle de C / C dans les interprètes et compilateurs JavaScript Le rôle de C / C dans les interprètes et compilateurs JavaScript Apr 20, 2025 am 12:01 AM

C et C jouent un rôle essentiel dans le moteur JavaScript, principalement utilisé pour implémenter des interprètes et des compilateurs JIT. 1) C est utilisé pour analyser le code source JavaScript et générer une arborescence de syntaxe abstraite. 2) C est responsable de la génération et de l'exécution de bytecode. 3) C met en œuvre le compilateur JIT, optimise et compile le code de point chaud à l'exécution et améliore considérablement l'efficacité d'exécution de JavaScript.

Python vs JavaScript: cas d'utilisation et applications comparées Python vs JavaScript: cas d'utilisation et applications comparées Apr 21, 2025 am 12:01 AM

Python est plus adapté à la science et à l'automatisation des données, tandis que JavaScript est plus adapté au développement frontal et complet. 1. Python fonctionne bien dans la science des données et l'apprentissage automatique, en utilisant des bibliothèques telles que Numpy et Pandas pour le traitement et la modélisation des données. 2. Python est concis et efficace dans l'automatisation et les scripts. 3. JavaScript est indispensable dans le développement frontal et est utilisé pour créer des pages Web dynamiques et des applications à une seule page. 4. JavaScript joue un rôle dans le développement back-end via Node.js et prend en charge le développement complet de la pile.

See all articles