TL;DR
La extensión de Apidog para VS Code te permite enviar solicitudes API, gestionar colecciones, ejecutar pruebas y compartir espacios de trabajo con tu equipo, todo sin salir de tu editor. La configuración toma menos de cinco minutos: instala la extensión, inicia sesión en tu cuenta gratuita de Apidog y tu espacio de trabajo se cargará directamente en la barra lateral de VS Code.
💡Apidog es una plataforma gratuita todo en uno para el desarrollo de APIs. La extensión de VS Code conecta tu editor directamente a tu espacio de trabajo de Apidog para que puedas probar APIs, escribir documentación y colaborar con tu equipo sin cambiar de ventana. Prueba Apidog gratis, no se requiere tarjeta de crédito.
Introducción
Apidog comenzó como una aplicación de escritorio para el diseño, pruebas y documentación de API. Ahora, la extensión de VS Code conecta tu editor directamente con tu espacio de trabajo de Apidog: colecciones, entornos y casos de prueba permanecen sincronizados entre VS Code, la app de escritorio y la web.
Esta guía cubre el flujo completo: instalar la extensión, conectarte a tu espacio de trabajo, enviar solicitudes, ejecutar pruebas y cómo usar la extensión junto con la app de escritorio.
Paso 1: Instala la extensión de Apidog para VS Code
- Abre VS Code.
- Haz clic en el icono de Extensiones en la barra lateral izquierda (o presiona Ctrl+Shift+X / Cmd+Shift+X).
- Busca “Apidog” en el Marketplace de Extensiones.
- Busca la extensión publicada por Apidog Inc. (logotipo oscuro con letras API).
- Haz clic en Instalar.
- Tras instalar, verás el icono de Apidog en la Barra de Actividad a la izquierda.
- Haz clic en el icono de Apidog para abrir el panel en la barra lateral.
Paso 2: Inicia sesión en tu cuenta de Apidog
- Haz clic en el botón "Sign In" dentro del panel de Apidog.
- Se abrirá una pestaña del navegador con la página de autenticación de Apidog.
- Ingresa tu correo y contraseña, o regístrate gratis (solo necesitas un email, no se requiere tarjeta).
- Tras iniciar sesión, confirma y vuelve a VS Code (puedes usar "Open VS Code" o cambiar manualmente).
- El espacio de trabajo se carga en la barra lateral.
Vista de la barra lateral:
- Arriba: nombre del espacio de trabajo y selector de entorno.
- Abajo: colecciones organizadas como carpetas, solicitudes individuales, estructura de árbol.
- El menú desplegable de entorno te permite cambiar entre entornos rápidamente.
Paso 3: Navega por tus colecciones
- La barra lateral refleja exactamente la estructura de colecciones de tu espacio de trabajo de Apidog.
- Haz clic en la flecha junto a una colección para expandir carpetas y solicitudes.
- Cada solicitud tiene una insignia de color según el método HTTP (GET: verde, POST: azul, PUT: naranja, DELETE: rojo).
- Al hacer clic en una solicitud, se abre en el área del editor como una pestaña.
Buscar solicitudes:
- Usa el campo de búsqueda en la parte superior del panel de Apidog para filtrar por nombre, URL o método.
Cambiar de espacio de trabajo:
- Si tienes varios espacios de trabajo (personal, equipo, proyecto), usa el selector en la parte superior del panel para alternar.
Paso 4: Envía solicitudes
Cuando abres una solicitud desde la barra lateral:
- Se carga como una pestaña en el editor.
- Interfaz:
- Barra superior: Selector de método, campo de URL, botón Enviar.
- Pestañas: Params, Headers, Body, Auth, Pre-request Scripts, Tests, Settings.
Para enviar una solicitud:
- Verifica método y URL.
- Añade encabezados en la pestaña Headers.
- Si es POST/PUT, ve a Body y define el tipo (JSON, formulario, binario, etc.).
- Haz clic en Enviar.
Respuesta:
- Aparece en la mitad inferior: código de estado, tiempo, tamaño.
- Puedes ver cuerpo (resaltado para JSON/XML), encabezados, cookies y resultados de pruebas.
Uso de entornos:
- Elige el entorno activo en el selector. Variables como
{{base_url}}o{{token}}se resuelven con los valores definidos. Útil para alternar entre desarrollo, staging y producción sin cambiar URLs manualmente.
Paso 5: Edita y crea solicitudes
Puedes editar cualquier solicitud directamente en VS Code; los cambios se sincronizan automáticamente.
Para crear una nueva solicitud:
- Haz clic derecho en una colección o carpeta en la barra lateral.
- Selecciona "New Request".
- Se abre una pestaña en blanco para la solicitud.
- Establece método, URL, encabezados y cuerpo.
- Guarda con Ctrl+S / Cmd+S.
La nueva solicitud aparece en la barra lateral y está disponible en la aplicación de escritorio, web y VS Code de tus compañeros.
Organiza y renombra:
- Haz clic derecho en solicitudes o carpetas para renombrar, mover, duplicar o eliminar.
- Puedes arrastrar y soltar para reorganizar.
Paso 6: Ejecuta pruebas
Apidog soporta aserciones de prueba en JavaScript que se ejecutan tras cada respuesta.
En la pestaña Tests de la solicitud:
pm.test("Status is 200", function () {
pm.response.to.have.status(200);
});
pm.test("Response contains user id", function () {
const json = pm.response.json();
pm.expect(json.id).to.be.a('number');
});
Tras enviar la solicitud, la pestaña Tests muestra qué tests pasaron/fallaron, el conteo y mensajes de error.
Ejecutar una colección completa:
- Haz clic derecho en una colección o carpeta.
- Selecciona "Run Collection".
- Configura iteraciones, delays y entorno.
- Haz clic en Ejecutar.
- Verás los resultados de todas las solicitudes y sus aserciones.
Paso 7: Usa la extensión de VS Code y la aplicación de escritorio juntas
La extensión y la app de escritorio comparten el espacio de trabajo en tiempo real; no hay una versión “primaria”.
Flujos de trabajo prácticos:
- Diseñar en escritorio, testear en VS Code: Define esquemas/mock servers en escritorio y ejecuta pruebas en VS Code sin salir de tu entorno de desarrollo.
- Revisión en equipo: Un backend actualiza endpoints en escritorio; el frontend ve los cambios al instante en VS Code.
- Pruebas en contexto: Mientras desarrollas en VS Code, puedes abrir el panel de Apidog, ejecutar endpoints y validar respuestas sin cambiar de ventana.
La app de escritorio es mejor para:
- Diseño de esquemas, configuración de mocks, publicación de documentación y gestión avanzada de entornos.
Paso 8: Comparte con tu equipo
Para colaborar:
- Ve a la configuración de tu espacio de trabajo en la web o app de escritorio de Apidog.
- Invita a tus compañeros por correo.
- Cuando acepten e instalen la extensión, verán las mismas colecciones y cualquier cambio será instantáneo para todos.
El nivel gratuito permite hasta tres usuarios. Todos los cambios se sincronizan automáticamente, sin necesidad de git ni exportaciones manuales.
Preguntas frecuentes
¿Funciona la extensión de Apidog para VS Code sin la aplicación de escritorio?
Sí. La extensión es un cliente completo; no necesitas instalar la app de escritorio.
¿Puedo usar la extensión sin conexión?
Puedes ver y editar colecciones en caché sin conexión. Para enviar solicitudes y sincronizar, necesitas internet. El soporte offline completo depende del estado de la caché.
¿Cómo importo colecciones de Thunder Client o Postman?
En la app de escritorio o web de Apidog, ve a Importar y elige el formato (Thunder Client JSON, Postman v2.1, OpenAPI, etc.). Las colecciones estarán disponibles en VS Code inmediatamente.
¿La extensión VS Code crea un nuevo proyecto en Apidog?
No. Se conecta a tu espacio de trabajo existente. Los espacios de trabajo se crean y gestionan en la app de escritorio o web.
¿Varias personas pueden tener la misma colección abierta a la vez?
Sí. La extensión no bloquea colecciones. Si dos usuarios editan la misma solicitud, prevalece el último guardado. Para edición coordinada, usa las funciones colaborativas de la app de escritorio.
¿Soporta autocompletado de variables de entorno?
Sí. Al escribir {{ en un campo, la extensión sugiere variables del entorno activo, evitando errores en los nombres.
La extensión de Apidog para VS Code es ideal como herramienta diaria cuando desarrollas APIs directamente en el editor. En minutos tendrás colecciones, entornos y colaboraciones listos y sincronizados, sin cambiar de ventana.
Top comments (0)