Cuando trabajas con una API y necesitas eliminar un registro específico, el paso más importante es saber de dónde proviene el identificador único que le envías al servidor. Entender este flujo completo es lo que marca la diferencia entre un código funcional y uno que falla sin explicación aparente.
¿De dónde viene el ID que usamos para borrar un post?
El ID de cada post no es algo que inventemos o asignemos manualmente. Viene directamente en la respuesta del servidor cuando hacemos una petición GET [0:04]. Si revisamos la pestaña Network del navegador y seleccionamos la petición a posts, podemos ver en la sección de response o preview que cada objeto del arreglo incluye su propio ID.
Esto significa que el servidor es quien asigna y controla los identificadores. Nuestro trabajo en el frontend es simplemente capturar ese dato y utilizarlo cuando sea necesario, por ejemplo, al momento de enviar una solicitud de eliminación.
¿Cómo se asigna el ID a cada elemento del DOM?
Una vez que obtenemos la respuesta del servidor, generamos dinámicamente los elementos HTML con JavaScript. El proceso funciona así [0:25]:
- Se recorre la lista de posts con un loop.
- Por cada post, se crea un elemento
<article> que funciona como contenedor.
- A ese contenedor se le asigna el atributo
id con el valor que viene de la respuesta.
En código, esto se traduce a algo como:
javascript
postContainer.id = post.id;
De esta forma, cada <article> en el DOM queda vinculado con su ID real del servidor [0:40]. Si inspeccionamos los elementos en el navegador, podemos confirmar que cada artículo tiene asignado el identificador correcto.
¿Por qué es importante este vínculo entre DOM y servidor?
Cuando el usuario decide borrar un post, necesitamos recuperar ese atributo id de la etiqueta HTML. Lo guardamos en una variable, por ejemplo postId, y se lo enviamos de vuelta al servidor para que sepa exactamente cuál registro debe eliminar [0:55].
El flujo completo se resume en estos pasos:
- El servidor responde con una lista de posts, cada uno con su ID.
- JavaScript genera elementos
<article> y les asigna el ID correspondiente.
- Al hacer clic en borrar, se lee el atributo
id del elemento.
- Ese valor se envía al servidor como parte de la petición DELETE.
¿Qué sucede si no asignamos correctamente el ID?
Sin este paso, el servidor no tendría forma de saber cuál post queremos eliminar. El atributo id en el DOM actúa como puente entre lo que el usuario ve en pantalla y el registro almacenado en la base de datos. Es una práctica común y fundamental en cualquier aplicación que consuma una API REST.
Este patrón de guardar identificadores del servidor en atributos del DOM es algo que encontrarás en prácticamente cualquier proyecto que maneje operaciones CRUD. Si te queda alguna duda sobre cómo funciona este flujo, comparte tu experiencia en los comentarios.
