Travailler dans le nuage
En utilisant l'interface utilisateur de Code Hub, vous pouvez déployer une application VCR directement depuis votre navigateur sans aucun outil local. Si vous préférez utiliser vos propres outils, consultez notre guide sur les Travailler au niveau local.
Visitez le site Hub de codes Vonage pour commencer. Vous pouvez commencer par parcourir la liste des échantillons disponibles pour nos produits ou utiliser la fonction de recherche pour trouver ce que vous souhaitez construire.

Une fois que vous avez cliqué sur l'échantillon que vous souhaitez utiliser, sélectionnez Déployer le code.

Déployer le code
Déployer le code vous permet de déployer immédiatement un instance d'une application afin que vous puissiez la voir en action. Lorsque vous créez une instance d'un projet, vous pouvez configurer plusieurs paramètres, notamment la région où le déploiement sera hébergé, le nom de l'instance et tout autre paramètre pertinent pour ce projet (par exemple un numéro Vonage pour envoyer des messages SMS) :

Si vous n'avez pas encore de numéro Vonage, vous pouvez en acheter un en sélectionnant "Attribuer un numéro". Une fois l'instance créée, elle apparaîtra dans la liste sous Deploy Code, où vous pouvez également continuer à créer d'autres instances qui fonctionnent dans différentes régions ; veuillez noter que si le projet nécessite un numéro Vonage, vous aurez besoin d'un numéro différent pour chaque instance.

Une fois l'instance créée, vous pouvez cliquer dessus pour lancer et utiliser l'application.
Publier sur Code Hub
Si vous êtes un développeur et que vous souhaitez publier votre propre application VCR dans le Code Hub afin que d'autres puissent la déployer d'un simple clic, vous devez inclure un fichier setup.json dans votre projet à côté de vcr.yml. Ce fichier définit le formulaire de configuration que les utilisateurs remplissent lors du déploiement de votre produit.
Emplacement du fichier
your-project/
├── vcr.yml
├── setup.json
└── ...
Structure de base
{
"data": [
{
"type": "TEXT",
"title": "Company Name",
"description": "The name of your company.",
"name": "COMPANY_NAME"
}
]
}
Chaque entrée dans data correspond à une variable d'environnement définie dans vcr.yml. Les name doit correspondre exactement au nom de la variable d'environnement.
Types de champs
| Type | Description |
|---|---|
TEXT | Texte libre |
SECRET | Entrée de texte, la valeur est cachée (pour les données sensibles) |
PHONE_NUMBER | Permet à l'utilisateur d'acheter et d'associer un numéro Vonage. Utiliser features pour spécifier ["VOICE"], ["SMS"]ou les deux. |
EXTERNAL_ACCOUNT | Lier un compte de messagerie externe (WhatsApp, Messenger, etc.). Utiliser providers pour spécifier les fournisseurs pris en charge. |
SELECT | Liste déroulante. Utiliser options tableau (name/value paires). Soumis sous forme de chaîne JSON. Ajouter "multi": true pour la multi-sélection. |
TOGGLE | Case à cocher. Soumis en tant que "true" ou "false". |
CONFIGURATION_SELECTOR | Configuration conditionnelle - rend différents sous-formulaires en fonction de la sélection de l'utilisateur. |
Propriétés communes
| Propriété | Exigée | Description |
|---|---|---|
type | Oui | Un des types ci-dessus |
name | Oui | Nom de la variable d'environnement (doit correspondre à vcr.yml) |
title | Oui | Étiquette présentée à l'utilisateur |
description | Oui | Texte d'aide. Prise en charge des liens markdown : [label](url) |
optional | Non | Set (jeu de mots) true pour rendre le champ facultatif. Tous les champs sont obligatoires par défaut. |
defaultValue | Non | Valeur par défaut. Pris en charge sur TEXT, SELECTet TOGGLE seulement. |
Exemples de types
NUMÉRO DE TÉLÉPHONE :
{
"type": "PHONE_NUMBER",
"title": "Vonage Number",
"description": "A Vonage number for your application.",
"features": ["VOICE", "SMS"],
"name": "VONAGE_NUMBER"
}
SELECT :
{
"type": "SELECT",
"title": "Environment",
"description": "Which environment are you deploying to?",
"name": "CODE_ENV_REQ",
"options": [
{ "name": "Production", "value": "PROD" },
{ "name": "Quality Assurance", "value": "QA" },
{ "name": "Development", "value": "DEV" }
],
"defaultValue": "PROD"
}
CONFIGURATION_SELECTOR :
À utiliser lorsque votre produit prend en charge plusieurs flux de configuration qui s'excluent mutuellement.
{
"type": "CONFIGURATION_SELECTOR",
"name": "__configuration_type__",
"title": "Configuration Type",
"description": "Select configuration type",
"options": [
{ "name": "Basic", "value": "basic" },
{ "name": "Advanced", "value": "advanced" }
],
"configurations": [
{
"basic": [
{ "type": "TEXT", "name": "API_URL", "title": "API URL", "description": "Your API endpoint." }
]
},
{
"advanced": [
{ "type": "TEXT", "name": "API_URL", "title": "API URL", "description": "Your API endpoint." },
{ "type": "SECRET", "name": "API_KEY", "title": "API Key", "description": "Your API key." }
]
}
]
}
Clés en configurations doit correspondre exactement au value d'une option. La valeur de l'option sélectionnée est soumise en tant que variable d'environnement à l'aide de la commande name domaine.
Pour publier votre application dans le Code Hub, utilisez la fonction neru-mcp Serveur MCP.