De HTML estático a una app Django + MySQL publicada en la nube, unidad por unidad.

Anexo A

Proyecto Integrador Unificado: "ImpulsaTec — Vitrina de Servicios"

En lugar de proyectos desechables por unidad, todo el curso construye una sola base de datos MySQL que crece Unidad por Unidad. Cada alumno crea su propia vitrina digital donde ofrece un servicio o producto real (tutorías, diseño, repostería, freelance, lo que sea) — práctico, motivante y reutilizable como portafolio de empleabilidad al terminar el curso.

# catalogo/models.py
# Comentario de ubicación: este código vive en el archivo models.py de la app "catalogo"

from django.db import models
# Traemos las herramientas de Django para describir tablas como clases de Python

from django.contrib.auth.models import User
# Traemos el modelo de usuario que Django ya trae incluido (login, contraseñas, sesiones)

class Servicio(models.Model):
    # Cada clase que hereda de models.Model se convierte en una TABLA dentro de MySQL

    propietario = models.ForeignKey(User, on_delete=models.CASCADE)
    # Relaciona este servicio con el usuario dueño; on_delete=CASCADE = si se borra el usuario, se borran sus servicios

    titulo = models.CharField(max_length=120)
    # Texto corto (máximo 120 caracteres), obligatorio

    descripcion = models.TextField()
    # Texto largo, sin límite fijo de caracteres

    precio = models.DecimalField(max_digits=8, decimal_places=2)
    # Número decimal: hasta 8 dígitos en total y 2 después del punto (ej. 1500.00)

    categoria = models.CharField(max_length=60)
    # Texto corto para clasificar el servicio (ej. "Tutorías", "Diseño")

    creado_en = models.DateTimeField(auto_now_add=True)
    # auto_now_add = Django guarda automáticamente la fecha y hora cuando se crea el registro

    def __str__(self):
        # Define qué texto se muestra cuando Django necesita "imprimir" este objeto (ej. en el panel /admin)
        return self.titulo
        # Mostrará el título en vez de algo genérico como "Servicio object (1)"

Anexo B

Guía rápida: Render + MySQL en la nube

Se configura una sola vez al inicio de la Unidad 2 y queda lista para publicar avances cada semana con un simple git push.

1. 1

   Crear la base de datos MySQL gratuita (Aiven)

   Ir a aiven.io → crear cuenta con GitHub/Google → "Create service" → MySQL → plan gratuito (Free Plan) → región cercana → nombrar el servicio.

   Copiar del panel: Host, Port, User, Password y Database name.

2. 2

   Conectar Django localmente

   pip install pymysql python-decouple, luego en settings.py:

   import pymysql
   # Traemos el conector que traduce entre Django y MySQL
   
   pymysql.install_as_MySQLdb()
   # Hace que Django use pymysql como si fuera el driver oficial de MySQL
   
   from decouple import config
   # Función para leer variables secretas desde el archivo .env
   
   DATABASES = {
       'default': {
           'ENGINE': 'django.db.backends.mysql',        # Motor de base de datos: MySQL
           'NAME': config('DB_NAME'),                     # Nombre de la base de datos, leído del .env
           'USER': config('DB_USER'),                     # Usuario de conexión, leído del .env
           'PASSWORD': config('DB_PASSWORD'),             # Contraseña de conexión, leída del .env
           'HOST': config('DB_HOST'),                     # Servidor donde vive la base de datos, leído del .env
           'PORT': config('DB_PORT', default='3306'),     # Puerto de conexión; si no existe en .env, usa 3306 por defecto
           'OPTIONS': {'ssl': {'ssl-mode': 'REQUIRED'}},  # Aiven exige que la conexión venga cifrada (SSL)
       }
   }

   Crear un archivo .env local (nunca subirlo a GitHub, agregar a .gitignore) con esas 5 variables.

3. 3

   Migrar y probar en local

   python manage.py migrate
   # Crea en tu base de datos MySQL las tablas que Django necesita internamente (usuarios, sesiones, permisos, etc.)
   
   python manage.py createsuperuser
   # Crea tu usuario administrador: te pedirá usuario, correo y contraseña
   
   python manage.py runserver
   # Levanta el servidor local; abre http://127.0.0.1:8000/ en tu navegador

4. 4

   Preparar el proyecto para producción

   Instalar gunicorn y whitenoise; generar requirements.txt:

   pip install gunicorn whitenoise
   # gunicorn = servidor que corre Django en Render (runserver es solo para tu computadora)
   # whitenoise = permite servir tus archivos CSS/imágenes sin configuración extra
   
   pip freeze > requirements.txt
   # Genera una lista con todo lo que instalaste; Render la usa para instalar lo mismo en la nube
   
   git add . && git commit -m "listo para deploy" && git push
   # git add . = marca todos los archivos modificados como "listos para guardar" (staging)
   # && = "y luego, si lo anterior no falló, ejecuta lo siguiente"
   # git commit -m "..." = guarda una "fotografía" de esos archivos con un mensaje que describe el cambio
   # git push = sube esos commits guardados en tu computadora hacia GitHub

5. 5

   Crear el Web Service en Render

   render.com → registrarse con GitHub → "New +" → "Web Service" → seleccionar el repositorio.

   • Build Command: pip install -r requirements.txt && python manage.py collectstatic --noinput
   • Start Command: gunicorn miproyecto.wsgi
   • Plan: Free
6. 6

   Configurar variables de entorno en Render

   En "Environment" agregar las mismas 5 variables del .env local, más:

   SECRET_KEY=
   # Clave secreta de Django; genera una distinta y larga solo para producción, nunca la reutilices del .env local
   
   DEBUG=False
   # En producción SIEMPRE False: oculta detalles técnicos de errores a cualquier visitante
   
   ALLOWED_HOSTS=.onrender.com
   # Le dice a Django "solo acepta peticiones que lleguen a este dominio exacto"

7. 7

   Deploy y migración en la nube

   Render construye y despliega automáticamente. Luego, desde la pestaña Shell del servicio en Render:

   python manage.py migrate
   # Crea las tablas en MySQL, esta vez desde el servidor de Render (misma base de datos de Aiven)
   
   python manage.py createsuperuser
   # Crea tu usuario administrador ya en producción

   Listo: la URL https://<proyecto>.onrender.com queda pública con HTTPS. Cada git push a partir de aquí redeploya automáticamente.

Anexo C

Matriz de Evaluación Anti-IA

El código estático entregado vale 0% si el alumno no puede defenderlo. La calificación de cada Unidad combina cuatro fuentes independientes de evidencia.