Vas a construir: Una tabla de comentarios con una API pública para leer y agregar filas, un webhook que recibe comentarios de otra herramienta, un informe diario y una página que muestra los comentarios
Lee primero: Recorrido por el editorPágina interactiva con flujos de trabajo
En este tutorial construyes un pequeño backend sin salir del editor. Guardas comentarios en una tabla nativa, los expones con endpoints HTTP, los recibes de otras herramientas con un webhook y te envías un resumen diario de forma programada. Al final, una página de tu sitio muestra los comentarios a través del endpoint.
Crea la tabla
Agrega una tabla
Abre el espacio de trabajo Tables desde la parte inferior de la barra lateral izquierda. Presiona New junto a Tables, escribe
feedbacky presiona ↵. La tabla se abre en su pestaña Schema con una columna de texto,title.Agrega las columnas
Presiona Add column dos veces. Llama a la primera columna
messagey deja el tipo Text. Llama a la segundaratingy pon su tipo en Number. Marca Required entitleyrating.Cada fila también recibe
id,createdAtyupdatedAt, así que no los agregas.Agrega una regla de escritura
En Row rules, escribe
row.rating >= 1 && row.rating <= 5en Write. Ahora los visitantes y los flujos de trabajo solo pueden guardar calificaciones del 1 al 5. Deja Read vacío para que todos puedan leer. Presiona Save schema.Agrega una fila a mano
Cambia a la pestaña Rows y presiona Add row. Completa un título, un mensaje y una calificación, y luego presiona Add row en el panel. Las ediciones en el editor se saltan las reglas de fila, porque el sitio es tuyo.
La tabla feedback muestra una fila en la pestaña Rows, y el encabezado de la tabla muestra la etiqueta Rules.
Lee filas con un endpoint
Crea un flujo de trabajo de servidor
Abre el espacio de trabajo Logic y cambia el selector de arriba de Client a Server. Presiona + (Add server workflow) y elige HTTP endpoint. Llama al flujo de trabajo
List feedback.Configura el disparador
En Trigger, pon Method en GET, Path en
/feedbacky Who can call it en Public. La pista debajo de los campos muestra la dirección:/api/feedbacken tu sitio.Consulta la tabla
Presiona Add step y elige Query table en Tables. Escribe
feedbacken Table; los flujos de trabajo encuentran una tabla por su nombre o por su id. Pon Limit en20. La tarjeta del paso muestra su id,s1.Devuelve las filas
Presiona Add step y elige Return en Server. Pon Value en
steps.s1.rows. El valor de Return se convierte en la respuesta del endpoint.Pruébalo
Presiona Test run. El panel de ejecución muestra en directo cada paso con su resultado y su duración; el paso Return muestra tu fila. Cada ejecución se guarda en Runs.
Agrega filas con un endpoint
Crea un endpoint POST
Agrega otro flujo de trabajo HTTP endpoint llamado
Add feedback. Pon Method en POST, Path en/feedbacky Who can call it en Public. Un GET y un POST pueden compartir una ruta.Inserta la fila
Agrega un paso Insert row con Table
feedbacky Values{ title: input.title, message: input.message, rating: input.rating }. El cuerpo JSON de la solicitud llega comoinput.Devuelve la fila nueva
Agrega un paso Return con Value
steps.s1, la fila insertada con suid.Prueba con una entrada de ejemplo
En Test input, escribe
{ "title": "Fast support", "message": "Answered in an hour", "rating": 5 }y presiona Test run. Luego cambia la calificación a9y vuelve a ejecutarlo: la regla de escritura rechaza la fila y la ejecución falla.
La pestaña Rows de la tabla feedback muestra la fila de la ejecución de prueba, y el historial de ejecuciones muestra una ejecución exitosa y una fallida.
Recibe un webhook
Crea el webhook
Agrega un flujo de trabajo de servidor y elige Webhook. Llámalo
Feedback webhooky pon Path en/webhooks/feedback. Un webhook siempre responde aPOST.Guarda el payload
Agrega un paso Insert row con Table
feedbacky los mismos Values que antes. El payload del webhook llega comoinput.
Envía un informe diario
Crea una programación
Agrega un flujo de trabajo de servidor y elige Schedule. Llámalo
Daily reporty presiona el preset Every day at 09:00. Las programaciones usan UTC, y la pista debajo del campo te describe la programación con palabras.Encuentra las calificaciones bajas
Agrega un paso Query table con Table
feedbacky Filter[{ column: 'rating', op: 'lte', value: 2 }].Envíate un email
Agrega un paso Send email. Pon To en
'you@example.com', Subject enDaily feedbacky Text en la expresiónsteps.s1.rows.length + ' ratings of 2 or less'. Presiona Test run para recibir el email ahora.
Publica y llama al endpoint
Publica en staging
Los flujos de trabajo de servidor se guardan mientras editas, pero solo entran en funcionamiento cuando publicas. Presiona Publish en la barra de herramientas, deja Staging seleccionado y confirma. A partir de ahora la programación se ejecuta todos los días en staging.
Llámalo desde una terminal
Ejecuta
curl https://<your-staging-address>/api/feedback. La respuesta es un JSON con el id de la ejecución, su estado y las filas enresult.
Muestra los comentarios en una página
Conecta la API de tu sitio
Abre el espacio de trabajo Data, presiona + (Add integration) junto a Integrations y elige REST API. Pon la URL base en tu dirección de staging y presiona Create integration.
Crea una consulta
Presiona + (Add query) junto a Queries y llámala
feedback. Elige tu integración y la operación Request. En Input, pon la ruta en/api/feedback. Pon Response path enresult, deja When it runs en Client y presiona Run.Muestra las filas
Inserta una Collection list en la página. En la sección Collection list, pon Source en Expression e Items en
queries.feedback.data. Dentro del ítem, enlaza un texto aitem.titley otro aitem.message.
La página muestra los comentarios de tu tabla, leídos a través de tu propio endpoint. Las filas nuevas del endpoint POST o del webhook aparecen en la siguiente carga.
Lo que aprendiste
- Una tabla nativa tiene un esquema, un explorador de datos y reglas de fila que se aplican a los visitantes y a los flujos de trabajo.
- Un flujo de trabajo de servidor empieza desde un endpoint HTTP, un webhook o una programación, y Return define la respuesta.
- Test run ejecuta el borrador con una entrada de ejemplo y muestra cada paso; al publicar, los flujos de trabajo entran en funcionamiento.
Sigue con los próximos tutoriales o lee las guías en las que se basa este: