Flask

Flask

Tutorial Flask: Introducción al patrón MVC

Aprende el patrón MVC en Flask para organizar aplicaciones web con modelos, vistas y controladores de forma estructurada y escalable.

Aprende Flask y certifícate

Qué es el patrón MVC

El patrón MVC (Modelo-Vista-Controlador) es una arquitectura de software que separa la lógica de una aplicación en tres componentes interconectados. Esta separación permite organizar el código de manera más estructurada y facilita el mantenimiento, la escalabilidad y la colaboración en equipos de desarrollo.

La filosofía detrás de MVC se basa en el principio de separación de responsabilidades. Cada componente tiene un propósito específico y bien definido, lo que reduce el acoplamiento entre las diferentes partes de la aplicación y aumenta la cohesión dentro de cada componente.

Los tres componentes del patrón MVC

Modelo (Model) representa la capa de datos y la lógica de negocio de la aplicación. Se encarga de gestionar la información, las reglas de negocio y la comunicación con la base de datos. En el contexto de Flask, los modelos suelen implementarse utilizando SQLAlchemy para definir las entidades y sus relaciones.

El modelo es independiente de la interfaz de usuario y no tiene conocimiento sobre cómo se presentan los datos. Su responsabilidad se limita a mantener la integridad de los datos y proporcionar métodos para acceder y manipular la información.

Vista (View) es la capa de presentación que se encarga de mostrar la información al usuario. En aplicaciones web, las vistas son típicamente plantillas HTML que definen cómo se estructura y presenta el contenido. La vista recibe datos del controlador y los formatea para su visualización.

Las vistas deben ser pasivas en el sentido de que no contienen lógica de negocio compleja. Su función principal es tomar los datos proporcionados y presentarlos de manera apropiada según el contexto y las necesidades del usuario.

Controlador (Controller) actúa como intermediario entre el modelo y la vista. Recibe las peticiones del usuario, procesa la lógica de aplicación, interactúa con el modelo para obtener o modificar datos, y selecciona la vista apropiada para presentar la respuesta.

El controlador coordina el flujo de la aplicación y toma decisiones sobre qué acciones realizar basándose en las entradas del usuario. Es responsable de validar datos, manejar errores y dirigir el flujo de navegación.

Flujo de comunicación en MVC

El flujo típico en una aplicación MVC sigue este patrón:

  • 1. El usuario realiza una acción (como hacer clic en un enlace o enviar un formulario)
  • 2. El controlador recibe la petición y determina qué acción debe ejecutarse
  • 3. El controlador interactúa con el modelo para obtener o modificar datos según sea necesario
  • 4. El modelo procesa la lógica de negocio y devuelve los datos al controlador
  • 5. El controlador selecciona la vista apropiada y le pasa los datos necesarios
  • 6. La vista genera la respuesta final que se envía al usuario

Ventajas del patrón MVC

La implementación del patrón MVC aporta múltiples beneficios al desarrollo de aplicaciones web:

Mantenibilidad mejorada: Al separar las responsabilidades, los cambios en una capa tienen un impacto mínimo en las otras. Por ejemplo, modificar la apariencia de la aplicación solo requiere cambios en las vistas.

Reutilización de código: Los modelos pueden ser utilizados por diferentes controladores, y las vistas pueden ser reutilizadas para mostrar datos similares en diferentes contextos.

Desarrollo paralelo: Diferentes desarrolladores pueden trabajar simultáneamente en los modelos, vistas y controladores sin interferir entre sí, lo que acelera el proceso de desarrollo.

Testabilidad: Cada componente puede ser probado de forma independiente, facilitando la implementación de pruebas unitarias y de integración.

MVC en el contexto de aplicaciones web

En aplicaciones web modernas, el patrón MVC se adapta naturalmente al protocolo HTTP y a la arquitectura cliente-servidor. Las URLs se mapean a controladores específicos, que procesan las peticiones HTTP y devuelven respuestas apropiadas.

Este enfoque es especialmente útil cuando se desarrollan aplicaciones que necesitan servir tanto contenido HTML para navegadores como datos JSON para APIs. El mismo modelo puede alimentar diferentes tipos de vistas según el contexto de la petición.

La separación clara entre la lógica de presentación y la lógica de negocio también facilita la evolución de la aplicación. Es posible cambiar completamente la interfaz de usuario sin afectar la funcionalidad subyacente, o viceversa.

Patrón MVC en Flask

Flask adopta el patrón MVC de manera flexible y no prescriptiva, permitiendo a los desarrolladores implementar esta arquitectura según las necesidades específicas de cada proyecto. A diferencia de otros frameworks que imponen una estructura rígida, Flask proporciona las herramientas necesarias para construir aplicaciones MVC manteniendo la libertad de organización.

Implementación de modelos en Flask

En Flask, los modelos se implementan típicamente utilizando Flask-SQLAlchemy, que proporciona una capa de abstracción sobre SQLAlchemy. Los modelos definen la estructura de datos y encapsulan la lógica de negocio relacionada con las entidades de la aplicación.

from flask_sqlalchemy import SQLAlchemy

db = SQLAlchemy()

class Usuario(db.Model):
    __tablename__ = 'usuarios'
    
    id = db.Column(db.Integer, primary_key=True)
    nombre = db.Column(db.String(100), nullable=False)
    email = db.Column(db.String(120), unique=True, nullable=False)
    activo = db.Column(db.Boolean, default=True)
    
    def __repr__(self):
        return f'<Usuario {self.nombre}>'
    
    def to_dict(self):
        return {
            'id': self.id,
            'nombre': self.nombre,
            'email': self.email,
            'activo': self.activo
        }

Los modelos en Flask mantienen la responsabilidad única de gestionar los datos y pueden incluir métodos que encapsulen operaciones específicas del dominio, como validaciones o transformaciones de datos.

Controladores mediante rutas Flask

Los controladores en Flask se implementan a través de funciones decoradas con rutas. Estas funciones actúan como puntos de entrada que procesan las peticiones HTTP, interactúan con los modelos y determinan qué vista debe renderizarse.

from flask import Flask, render_template, request, redirect, url_for

app = Flask(__name__)

@app.route('/usuarios')
def listar_usuarios():
    # Interacción con el modelo
    usuarios = Usuario.query.filter_by(activo=True).all()
    
    # Selección y renderizado de la vista
    return render_template('usuarios/lista.html', usuarios=usuarios)

@app.route('/usuarios/<int:usuario_id>')
def mostrar_usuario(usuario_id):
    # Obtener datos del modelo
    usuario = Usuario.query.get_or_404(usuario_id)
    
    # Renderizar vista específica
    return render_template('usuarios/detalle.html', usuario=usuario)

Cada función controladora encapsula la lógica de aplicación específica para una ruta, manteniendo la separación entre el procesamiento de datos y su presentación.

Vistas con plantillas Jinja2

Las vistas en Flask se implementan mediante el sistema de plantillas Jinja2, que permite crear templates HTML dinámicos. Estas plantillas reciben datos de los controladores y los presentan de forma estructurada.

<!-- templates/usuarios/lista.html -->
<!DOCTYPE html>
<html>
<head>
    <title>Lista de Usuarios</title>
</head>
<body>
    <h1>Usuarios Activos</h1>
    <div class="usuarios-container">
        {% for usuario in usuarios %}
            <div class="usuario-card">
                <h3>{{ usuario.nombre }}</h3>
                <p>Email: {{ usuario.email }}</p>
                <a href="{{ url_for('mostrar_usuario', usuario_id=usuario.id) }}">
                    Ver detalles
                </a>
            </div>
        {% endfor %}
    </div>
</body>
</html>

Las plantillas Jinja2 mantienen la separación entre la lógica de presentación y la lógica de negocio, permitiendo que los diseñadores trabajen en las vistas sin necesidad de conocer los detalles de implementación del backend.

Estructura de proyecto Flask MVC

Una organización típica para un proyecto Flask que sigue el patrón MVC podría estructurarse de la siguiente manera:

mi_aplicacion/
├── app.py                 # Punto de entrada de la aplicación
├── models/
│   ├── __init__.py
│   ├── usuario.py         # Modelo Usuario
│   └── producto.py        # Modelo Producto
├── controllers/
│   ├── __init__.py
│   ├── usuarios.py        # Controladores de usuarios
│   └── productos.py       # Controladores de productos
├── templates/
│   ├── base.html          # Plantilla base
│   ├── usuarios/
│   │   ├── lista.html
│   │   └── detalle.html
│   └── productos/
│       ├── lista.html
│       └── detalle.html
├── static/
│   ├── css/
│   ├── js/
│   └── images/
└── requirements.txt

Esta estructura organiza claramente cada componente del patrón MVC en directorios separados, facilitando la navegación y el mantenimiento del código.

Integración de componentes MVC

La integración entre los componentes MVC en Flask se realiza de manera natural a través de las importaciones de Python y el sistema de rutas. Los controladores importan los modelos necesarios y utilizan las funciones de renderizado para conectar con las vistas.

# controllers/usuarios.py
from flask import Blueprint, render_template, request
from models.usuario import Usuario
from app import db

usuarios_bp = Blueprint('usuarios', __name__)

@usuarios_bp.route('/usuarios/nuevo', methods=['GET', 'POST'])
def crear_usuario():
    if request.method == 'POST':
        # Procesar datos del formulario
        nombre = request.form['nombre']
        email = request.form['email']
        
        # Crear nuevo modelo
        nuevo_usuario = Usuario(nombre=nombre, email=email)
        db.session.add(nuevo_usuario)
        db.session.commit()
        
        # Redireccionar después de crear
        return redirect(url_for('usuarios.listar_usuarios'))
    
    # Mostrar formulario para GET
    return render_template('usuarios/nuevo.html')

Ventajas específicas de MVC en Flask

La implementación del patrón MVC en Flask proporciona beneficios específicos para el desarrollo web:

Escalabilidad modular: Permite añadir nuevas funcionalidades sin afectar el código existente, organizando cada nueva característica en sus respectivos modelos, controladores y vistas.

Mantenimiento simplificado: Los errores y mejoras pueden localizarse rápidamente en la capa correspondiente, reduciendo el tiempo de depuración y desarrollo.

Flexibilidad de respuesta: El mismo controlador puede servir diferentes tipos de respuesta (HTML, JSON, XML) simplemente cambiando la vista o el formato de salida.

Reutilización de lógica: Los modelos pueden ser utilizados tanto para aplicaciones web tradicionales como para APIs REST, maximizando la eficiencia del desarrollo.

La naturaleza no opinionada de Flask permite adaptar el patrón MVC a las necesidades específicas de cada proyecto, manteniendo la claridad arquitectónica sin imponer restricciones innecesarias.

Aprende Flask online

Otras lecciones de Flask

Accede a todas las lecciones de Flask y aprende con ejemplos prácticos de código y ejercicios de programación con IDE web sin instalar nada.

Accede GRATIS a Flask y certifícate

Ejercicios de programación de Flask

Evalúa tus conocimientos de esta lección Introducción al patrón MVC con nuestros retos de programación de tipo Test, Puzzle, Código y Proyecto con VSCode, guiados por IA.