De API a App en Minutos: Una Guía para Crear una Herramienta de WhatsApp con Gemini y 2Chat

¿Estás buscando una forma de conectar con tus clientes a gran escala, directamente en la plataforma que más usan? Imagina enviar el anuncio de un nuevo producto, una oferta especial o una actualización importante a todos tus grupos de WhatsApp con solo unos pocos clics. Suena como algo que podría cambiar las reglas del juego, ¿verdad?

En el mundo digital de hoy, llegar a tu audiencia de forma directa es oro puro para el marketing. WhatsApp es un canal poderoso para esto, pero gestionar comunicaciones masivas puede consumir muchísimo tiempo. ¿Y si pudieras construir tu propia herramienta personalizada para manejarlo, sin escribir ni una sola línea de código?

Eso es exactamente lo que vamos a hacer hoy. En este tutorial, te guiaré paso a paso sobre cómo usar el increíble poder de la IA Gemini de Google y la flexible API de 2Chat para construir una aplicación web funcional que envía mensajes masivos a grupos de WhatsApp. ¿No tienes experiencia en programación? ¡No hay problema! Solo necesitas saber cómo pedir las cosas.

¡Manos a la obra! Convirtamos una idea poderosa en una herramienta real para tu negocio.

Tu Kit de Herramientas: Lo que Necesitarás

Antes de empezar a construir, reunamos nuestras dos herramientas principales:

• La API de 2Chat: Piensa en una API como un puente que permite que diferentes programas de software se comuniquen entre sí. La API de 2Chat es nuestro puente hacia WhatsApp. Está muy bien documentada y nos da todas las funciones que necesitamos, como listar nuestros números de teléfono, ver nuestros grupos y, por supuesto, enviar mensajes.

Para usar la API debes tener una cuenta de 2Chat. ¡Crea tu cuenta de prueba ya!

• Google AI Studio (con Gemini): Este será nuestro "desarrollador". Le vamos a dar a la IA Gemini de Google un conjunto detallado de instrucciones (un "prompt"), y escribirá todo el código de nuestra aplicación por nosotros. Es como tener un ingeniero de software experto a tu disposición, listo para construir cualquier cosa que puedas describir.

Paso 1: Entendiendo los Bloques de Construcción en la API de 2Chat

Primero, familiaricémonos con las herramientas que 2Chat nos ofrece. Si echas un vistazo a la documentación de la API de 2Chat, verás que está llena de funcionalidades. Para nuestra aplicación de mensajería masiva, nos interesan tres funciones clave:

• List Numbers (/whatsapp/get-numbers): Esta función permite a nuestra app encontrar cuáles de tus números de WhatsApp están conectados y disponibles en tu cuenta de 2Chat.
• List Groups (/whatsapp/groups): Una vez que seleccionamos un número, esta función obtendrá una lista de todos los grupos de WhatsApp asociados a ese número. Esto es crucial para elegir a nuestra audiencia.
• Send Message (/whatsapp/send-message): Este es el endpoint de acción. Usaremos un parámetro específico aquí llamado to_group_uuid para enviar nuestro mensaje directamente a los grupos que seleccionamos.

Conocer estas funciones específicas es clave porque le vamos a decir a Gemini exactamente qué usar.

Paso 2: Creando el Prompt Perfecto para Gemini

Aquí es donde ocurre la magia. No estamos escribiendo código, pero sí estamos redactando un conjunto de instrucciones muy específicas para nuestro desarrollador de IA. Un buen prompt es el secreto para obtener un gran resultado.

Nos dirigiremos a Google AI Studio y entraremos en la sección Build. Aquí, le daremos a Gemini el siguiente prompt. Analicémoslo pieza por pieza.

• Parte 1: Asigna un Rol a la IA
  Empezamos diciéndole a Gemini quién es. Esto establece el contexto para toda la tarea. Eres un desarrollador experto con conocimientos de diseño UX.
• Parte 2: Define el Objetivo
  A continuación, le decimos exactamente lo que queremos construir. Necesitas crear una aplicación web enfocada en enviar mensajes masivos a grupos de WhatsApp. La aplicación usará la API de 2Chat.
• Parte 3: Detalla la Lógica Paso a Paso
  Ahora, describimos el flujo de la aplicación, haciendo referencia a las llamadas específicas de la API de 2Chat que encontramos antes.

You are a expert developer with UX design knowledge. You need to create a web app focused in sending bulk email to WhatsApp groups. The app will use 2Chat API, it will ask for the API Key, next it will list the available phone nummber using a request like this:
curl -L -G 'https://api.p.2chat.io/open/whatsapp/get-numbers?page_number=0' \
    --header 'X-User-API-Key: your_api_key_here'
This is the sample response:
{
    "success": true,
    "count": 1,
    "page": 0,
    "numbers": [
        {
            "uuid": "WPN95841312-b54d-46e3-b0bc-6414f4a5296b",
            "friendly_name": "my testing number",
            "phone_number": "+595981048477",
            "iso_country_code": "PY",
            "pushname": ":v:",
            "server": "595981048477@c.us",
            "platform": "iphone",
            "connection_status": "C",
            "enabled": true,
            "is_business_profile": false,
            "channel_type": "WW",
            "sync_contacts": true,
            "created_at": "2022-10-31 22:05:44",
            "updated_at": "2022-12-01 21:40:04"
        }
    ]
}
Now, using the API Key and the selected phone number it Will list available groups using this request:
curl -L -G 'https://api.p.2chat.io/open/whatsapp/groups/+595981048477' \
    --header 'X-User-API-Key: your_api_key_here'

This is the response sample:
{
    {
    "success": true,
    "data": [
        {
            "uuid": "WAG768beeef-2b96-4bc7-9b7f-045078568723",
            "channel_uuid": "WPN95841312-b54d-46e3-b0bc-6414f4a5296b",
            "wa_group_id": "....@g.us",
            "profile_pic_url": "...",
            "wa_owner_id": "17137157533@c.us",
            "wa_group_name": "2chat test group :ok_hand:",
            "wa_created_at": "2022-10-23T17:11:41Z",
            "wa_subject": "daily motivational quotes :muscle:",
            "size": 4,
            "is_muted": false,
            "is_read_only": false,
            "channel_is_owner": false,
            "created_at": "2023-06-22T20:02:56Z",
            "updated_at": "2023-07-12T19:18:41Z",
            "owner_contact": {
                "uuid": "CON1653490d-194b-4992-8353-e4b46a64e321",
                "first_name": "Mikey",
                "last_name": "Mike",
                "channel_uuid": "WPNc568c832-606c-4d50-8092-fc51b5149d16",
                "profile_pic_url": "..."
            }
        }
    ]
The user can select several groups and now if Will use this API to send bulk messaging using this API request:
curl --location --request POST 'https://api.p.2chat.io/open/whatsapp/send-message' \
--header 'X-User-API-Key: your_api_key_here' \
--header 'Content-Type: application/json' \
--data-raw '{
    "to_group_uuid": "WAG768beeef-2b96-4bc7-9b7f-045078568723",
    "from_number": "+595981048477",
    "text": "Test from 2Chat API",
    "url": "https://uploads-ssl.webflow.com/6281a9c52303343ff7c3b269/62a1648ee0273340bf38e3a9_logo-2C.svg"
}'
The app Will list message sending result, this is a reponse sample:
{
    "success": true,
    "message_uuid": "MSG205dec10-523d-4ab3-b739-fd56e7cdeba2",
    "batched": true
}
in the results step in the detailed report in the response / error column add the full json response returned from every api request and also de request sent to the 2Chat API

Conditions:
- Avoid the API CORS error
- Use this color #2243FD as accent color with a light grey background
- The user can go to the next task and return if needed
`

Una vez que tu prompt esté listo, simplemente pégalo en la sección de construcción de Gemini y haz clic en "Build".

Paso 3: ¡Mira Cómo Tu App Cobra Vida!

Esta es la parte más emocionante. Gemini tomará todas tus instrucciones y, en uno o dos minutos, generará una aplicación web completa y funcional. Verás cómo crea los archivos, escribe el código y ensambla todo en un prototipo funcional.

Una vez que termine, ¡la pantalla de vista previa mostrará tu aplicación! Comienza, tal como pedimos, solicitando tu clave de API de 2Chat.

• Ingresa tu Clave de API: Obtén tu clave de API desde tu panel de control de 2Chat (en Desarrolladores -> Acceso a la API).
• Selecciona tu Número de Teléfono: La app obtendrá y mostrará automáticamente todos los números conectados a tu cuenta de 2Chat. ¡Incluso muestra su estado "Activo"!
• Elige tus Grupos: Después de seleccionar un número, cargará todos tus grupos de WhatsApp. Gracias a nuestro prompt, incluso incluye una barra de búsqueda para ayudarte a encontrar grupos específicos rápidamente.
• Redacta y Envía: Escribe tu mensaje, añade una URL de imagen opcional y presiona "Enviar". La app enviará tu mensaje a todos los grupos seleccionados y te dará un informe en tiempo real sobre el estado de cada mensaje.

¡Y así de fácil, tienes un enviador masivo de WhatsApp hecho a tu medida!

¿Listo para Construir la Tuya?

Esto es solo el comienzo. Imagina las otras herramientas que podrías construir para optimizar tus procesos de marketing y ventas. Con las herramientas adecuadas y una idea clara, puedes crear aplicaciones potentes que le den a tu negocio una ventaja competitiva.

¿Listo para poner en práctica este tutorial? El primer paso es obtener tu clave de API de 2Chat.

Regístrate para obtener una cuenta de 2Chat hoy y comienza a explorar el poder de la automatización de WhatsApp para tu negocio.