Trabajar en la nube

Utilizando la interfaz de usuario de Code Hub, puede desplegar una aplicación VCR directamente desde su navegador sin necesidad de herramientas locales. Si prefiere utilizar sus propias herramientas, consulte nuestra guía sobre trabajar localmente.

Visita la Centro de códigos de Vonage página de inicio para empezar. Puedes empezar echando un vistazo a la lista de ejemplos disponibles de nuestros productos, o utilizar la función de búsqueda para encontrar lo que te gustaría crear.

Vonage Code Hub landing page

Una vez que hayas hecho clic en la muestra que quieras utilizar, selecciona Despliegue de código.

"Schedule an SMS" product page

Despliegue de código

Despliegue de código le permite desplegar inmediatamente un instancia de una aplicación para que puedas verla en acción. Cuando creas una instancia de un proyecto, puedes configurar varios parámetros, incluida la región en la que se alojará la implantación, el nombre de la instancia y cualquier otro parámetro relevante para ese proyecto (por ejemplo, un número de Vonage para enviar mensajes SMS):

The form to create an instance

Si aún no tienes un número de Vonage, puedes comprar uno seleccionando "Asignar un número". Una vez creada la instancia, aparecerá en la lista en Implementar código, donde también podrás seguir creando otras instancias que se ejecuten en diferentes regiones; ten en cuenta que, si el proyecto requiere un número de Vonage, necesitarás un número diferente para cada instancia.

A list of instances created for the "Schedule an SMS" project.

Una vez creada la instancia, puede hacer clic en ella para iniciar y utilizar la aplicación.

Publicar en Code Hub

Si eres desarrollador y quieres publicar tu propia aplicación VCR en Code Hub para que otros puedan implementarla con un solo clic, debes incluir un setup.json en su proyecto junto con vcr.yml. Este archivo define el formulario de configuración que los usuarios rellenan al desplegar su producto.

Ubicación del archivo

your-project/
├── vcr.yml
├── setup.json
└── ...

Estructura básica

{
  "data": [
    {
      "type": "TEXT",
      "title": "Company Name",
      "description": "The name of your company.",
      "name": "COMPANY_NAME"
    }
  ]
}

Cada entrada en data se corresponde con una variable de entorno definida en vcr.yml. En name El campo debe coincidir exactamente con el nombre de la variable de entorno.

Tipos de campo

Tipo Descripción
TEXT Entrada de texto libre
SECRET Campo de texto; el valor está oculto (para datos confidenciales)
PHONE_NUMBER Permite al usuario comprar y vincular un número de Vonage. Utiliza features para especificar ["VOICE"], ["SMS"]o ambos.
EXTERNAL_ACCOUNT Vincula un account de mensajería externo (WhatsApp, Messenger, etc.). Utiliza providers para especificar los proveedores compatibles.
SELECT Lista desplegable. Utiliza options matriz (name/value pares). Se envía como una cadena JSON. Añadir "multi": true para la selección múltiple.
TOGGLE Casilla de verificación. Enviado como "true" o "false".
CONFIGURATION_SELECTOR Configuración condicional: muestra diferentes subformularios en función de la selección del usuario.

Propiedades comunes

Propiedad Requerido Descripción
type Uno de los tipos mencionados anteriormente
name Nombre de la variable de entorno (debe coincidir con vcr.yml)
title Etiqueta que se muestra al usuario
description Texto de ayuda. Admite enlaces markdown: [label](url)
optional No Conjunto true para que el campo sea opcional. Por defecto, todos los campos son obligatorios.
defaultValue No Valor por defecto. Compatible con TEXT, SELECTy TOGGLE sólo.

Ejemplos de tipos

PHONE_NUMBER:

{
  "type": "PHONE_NUMBER",
  "title": "Vonage Number",
  "description": "A Vonage number for your application.",
  "features": ["VOICE", "SMS"],
  "name": "VONAGE_NUMBER"
}

SELECCIONAR:

{
  "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"
}

SELECTOR_CONFIGURACIÓN:

Utilícelo cuando su producto admita varios flujos de configuración mutuamente excluyentes.

{
  "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." }
      ]
    }
  ]
}

Llaves en configurations debe coincidir exactamente con el value de una opción. El valor de la opción seleccionada se envía como variable de entorno mediante la name campo.

Para publicar tu aplicación en Code Hub, utiliza el neru-mcp Servidor MCP.