Guardar datos enviados por un formulario en una base de datos es uno de los pasos más importantes al construir una app web con Flask. Aquí verás cómo conectar el modelo de notas con SQLAlchemy, crear nuevos registros desde un formulario HTML y mostrarlos dinámicamente en la vista principal usando Jinja.

Cómo convertir la lista de notas en objetos con título y contenido

El primer paso es dejar atrás el string simple y trabajar con objetos que reflejen la estructura real de una nota. En app.py, dentro de la vista home, transformas la lista para que cada elemento tenga dos atributos: title y content.

Con esto, la plantilla HTML accede a las propiedades del objeto usando notación de punto. Por ejemplo, note.title y note.content, separados con un <br> para que el título quede arriba y el contenido debajo.

¿Qué es un modelo en SQLAlchemy? Es una clase de Python que representa una tabla de la base de datos. Cada atributo del modelo equivale a una columna y cada instancia equivale a una fila.

Cómo mostrar un mensaje cuando no hay notas creadas

Jinja permite usar un else dentro de los bucles for. Esto es útil cuando la lista está vacía y quieres mostrar un mensaje al usuario en lugar de una pantalla en blanco.

En este caso, si notes está vacía, aparece el texto Aún no se han creado notas. Es una forma sencilla de mejorar la experiencia sin agregar lógica adicional en la vista.

Cómo crear un enlace dinámico hacia la vista de creación

Dentro del template, fuera del <ul>, agregas una etiqueta <a> que lleve al formulario de creación. La URL no se escribe a mano: se obtiene con url_for, el mismo mecanismo que usas en las redirecciones.

La sintaxis dentro del HTML usa doble llave para abrir el bloque de código y llave simple para la cadena del nombre de la vista, en este caso create_note. Así el enlace siempre apunta a la ruta correcta, incluso si cambias la URL más adelante.

• Doble llave {{ }} para abrir el bloque de Jinja.
• url_for('create_note') para resolver la URL dinámicamente.
• Texto del enlace claro, como Agregar una nueva nota.

¿Para qué sirve url_for en Flask? Genera la URL de una vista a partir de su nombre de función. Si cambias la ruta, los enlaces siguen funcionando sin tener que actualizarlos uno por uno.

Cómo actualizar el formulario HTML para aceptar título y contenido

El formulario original solo tenía un campo de contenido, pero el modelo ahora exige dos campos. Debes agregar un input para title y otro para content, cada uno con su label correctamente asociado mediante el atributo for y el id del input.

El atributo name de cada input es clave: es el identificador que la vista de Flask usará para leer los datos enviados por el usuario. Si no coincide, el request.form no encontrará el valor.

Cómo procesar el POST y guardar la nota con SQLAlchemy

En la vista create_note, dentro del bloque que maneja el método POST, capturas los dos campos del formulario: title y content. Luego instancias una nueva nota pasando esos valores al modelo.

El guardado en base de datos se hace en tres pasos con la variable db que creaste al inicializar SQLAlchemy:

1. Crear la instancia del modelo, por ejemplo note_db = Note(title=title, content=content).
2. Agregar la instancia a la sesión con db.session.add(note_db).
3. Confirmar la transacción con db.session.commit().

El commit es necesario porque SQLAlchemy permite acumular varias operaciones y enviarlas todas juntas. Sin esa confirmación, los cambios no se persisten.

Por qué redirigir al home después de crear una nota

Una vez guardada la nota, lo natural es enviar al usuario de vuelta al listado para que vea su nueva entrada. En lugar de redirigir a la vista de confirmación, cambias el redirect para que apunte a home.

Durante la grabación apareció un detalle interesante: la primera prueba falló porque la variable se llamaba note_db pero la confirmación seguía buscando note. Ese tipo de errores son comunes al refactorizar y se resuelven alineando los nombres en todo el flujo.

¿Por qué SQLAlchemy necesita commit? Porque agrupa varias operaciones en una sola transacción. El commit confirma todos los cambios pendientes; sin él, los datos no se guardan en la base.

Con estos cambios ya tienes un flujo completo: el usuario llena el formulario, los datos se guardan en la base de datos y la vista principal los muestra leyendo directamente desde ahí. Abrir una pestaña nueva y ver las notas confirma que la información persiste.

¿Te animas a agregar el id de cada nota en el listado para luego poder editarlas? Cuéntame en los comentarios cómo lo resolviste.