Skip to main content

Crear un flujo de Stripe Checkout

Entrega a Devin una especificación de checkout con tus claves de sandbox de Stripe y obtén un flujo de pago funcional — página de precios, sesión de checkout, controlador de webhooks y página de confirmación — verificado en el navegador.
AuthorCognition
CategoryDesarrollo de funcionalidades
1

(Opcional) Delimita el alcance de la base de código con Ask Devin

Si no tienes claro cómo gestiona actualmente tu app los pagos, o qué archivos y patrones debes incluir en tu especificación, usa Ask Devin para investigar primero:Utiliza las respuestas para completar tu especificación; menciona archivos concretos, nombres de tablas y patrones para que Devin implemente algo que se integre de forma natural en tu base de código. También puedes iniciar una sesión de Devin directamente desde Ask Devin, y se conservará todo lo que haya aprendido como contexto.
2

Agregar claves de prueba de Stripe

Devin necesita claves de Stripe en modo de prueba para crear sesiones de checkout y verificar el controlador del webhook. Usa siempre credenciales de sandbox; nunca le des a Devin claves de Stripe de producción.El enfoque más sencillo es almacenarlas como secretos de organización antes de iniciar la sesión:
  1. Ve a Settings > Secrets y agrega:
  2. Devin accede a estas como variables de entorno, por lo que nunca terminan incluidas directamente en tu código fuente.
Los secretos de organización deben agregarse antes de iniciar la sesión; se inyectan al inicio de la sesión. Alternativamente, puedes proporcionar secretos durante la sesión usando el chat, y Devin también te pedirá de forma proactiva cualquier credencial que necesite cuando detecte variables de entorno faltantes.
3

Pasa tu especificación de checkout

Pega tu especificación — ya sea desde un PRD, un ticket de Linear o un mensaje detallado de Slack — directamente en Devin. Una buena especificación de checkout cubre los niveles de precios, el flujo de pago y lo que ocurre después de un pago exitoso. Cuanto más estructurada, mejor.Una buena especificación para Devin incluye tres cosas: qué construir (niveles de precios, flujo de checkout, controlador de webhook), dónde vive (rutas, tablas, archivos) y cómo encaja (patrones existentes que se deben seguir). No necesitas especificar todos los detalles de implementación: Devin analiza tu base de código para rellenar los huecos.
4

Devin crea y verifica en el navegador

Devin lee tu especificación, explora la base de código en busca de patrones coincidentes y luego implementa en todo el stack. Antes de abrir un PR, ejecuta tu app localmente y abre su navegador integrado para verificar que el flujo de checkout funcione de extremo a extremo.Así es como se ve en el ejemplo de checkout de Stripe:
  1. Crea la migración — Agrega la tabla subscriptions con columnas para user_id, stripe_subscription_id, plan, status y current_period_end
  2. Crea la página de precios — Crea las tarjetas de precios de tres niveles en /pricing, cada una con un botón “Subscribe” que hace POST a la API de checkout
  3. Implementa la creación de la sesión de checkout — Implementa POST /api/checkout/sessions para crear una sesión de Stripe Checkout con el ID de precio correcto, el correo electrónico del cliente y las URL de redirección
  4. Agrega el manejador del webhook — Implementa POST /api/webhooks/stripe con verificación de firma, manejo del evento checkout.session.completed y actualizaciones en la base de datos
  5. Crea la página de éxito — Crea /checkout/success, que obtiene la sesión de Stripe, muestra el nombre del plan, el importe cobrado y un enlace “Go to Dashboard”
  6. Escribe pruebas — Pruebas para la verificación de la firma del webhook (válida, inválida, ausente), la creación de la sesión de checkout y la lógica de actualización de planes en la base de datos
  7. Abre el navegador — Inicia el servidor de desarrollo, navega a /pricing, hace clic en “Subscribe” en el plan Pro, verifica que la redirección a Stripe Checkout funcione y comprueba que la página de éxito se renderice correctamente después de un pago de prueba
  8. Abre un PR — Entrega todos los cambios con un resumen de lo que se implementó y cómo se verificó
El paso de verificación en el navegador detecta problemas que las pruebas unitarias no cubren: una tarjeta de precios que no dispara el checkout, una URL de redirección que responde con 404 o una página de éxito que no logra cargar los detalles de la sesión. Si has definido una skill de pruebas locales, Devin sigue esos pasos automáticamente para cada funcionalidad que construye.
5

Iterar a partir del PR

Una vez que el PR (pull request) esté abierto, envía indicaciones de seguimiento en la misma sesión para ampliar o ajustar el flujo de pago.
6

Revisa el PR con Devin Review

Una vez que Devin abra el PR, usa Devin Review para revisar los cambios. Devin Review tiene el contexto completo de tu base de código y puede detectar errores, problemas de seguridad e inconsistencias de estilo en todo el diff. Puedes hacer preguntas de seguimiento en el chat de revisión — por ejemplo, «¿El controlador del webhook valida el tipo de evento antes de procesarlo?» — y Devin responderá basándose en el código real.