Pulido funcional, UX y simulacro de defensa

# --oneline: muestra cada commit en una sola línea (hash corto + mensaje)
git log --oneline

# --stat: además muestra cuántos archivos cambiaron en cada commit (sal de la lista con la tecla q)
git log --oneline --stat

# Paginator: divide una lista larga de registros en páginas de tamaño fijo
from django.core.paginator import Paginator

# @login_required: si no hay sesión, manda a LOGIN_URL en lugar de ejecutar la vista
@login_required
# servicios: la vista del listado, ahora con búsqueda y paginación
def servicios(request):
    # filter(propietario=request.user): solo los servicios del usuario actual (Semana 6)
    # order_by('-creado_en', '-id'): del más nuevo al más viejo; '-id' desempata si dos se crearon al mismo tiempo (paginar exige un orden fijo)
    lista_servicios = Servicio.objects.filter(propietario=request.user).order_by('-creado_en', '-id')
    # request.GET.get('q', ''): lee el texto buscado desde ?q=algo; '' si no hay búsqueda · strip() quita espacios sobrantes
    query = request.GET.get('q', '').strip()
    # si el usuario escribió algo en el buscador...
    if query:
        # titulo__icontains=query: WHERE titulo LIKE '%query%', sin distinguir mayúsculas/minúsculas
        lista_servicios = lista_servicios.filter(titulo__icontains=query)
    # Paginator(lista, 5): agrupa los resultados (ya filtrados) en páginas de 5 registros cada una
    paginator = Paginator(lista_servicios, 5)
    # request.GET.get('page'): lee el número de página desde la URL, ej. ?page=2
    numero_pagina = request.GET.get('page')
    # get_page(): devuelve la página pedida; si no es un número da la 1, y si se pasa del total da la última
    pagina = paginator.get_page(numero_pagina)
    # servicios: la página actual (se recorre igual que una lista) · query: para que el buscador recuerde lo escrito
    return render(request, 'core/servicios.html', {'servicios': pagina, 'query': query})

{# extends: el listado usa el molde base.html (debe ser la primera etiqueta) #}
{% extends 'core/base.html' %}

{# block contenido: lo que va dentro del body de base.html #}
{% block contenido %}
  {# h1: título de la página #}
  <h1 class="text-2xl font-bold mb-6">Servicios</h1>
  {# enlace a la ruta con name="crear_servicio" #}
  <a href="{% url 'crear_servicio' %}" class="inline-block mb-4 bg-blue-600 text-white px-4 py-2 rounded-lg">+ Nuevo servicio</a>

  {# method="GET": la búsqueda queda en la URL (?q=...) y se puede compartir o recargar #}
  <form method="GET" class="mb-4 flex flex-wrap gap-2 items-center">
    {# name="q": debe coincidir con request.GET.get('q') de la vista · value: conserva lo que se buscó · aria-label: nombre para lectores de pantalla #}
    <input type="text" name="q" value="{{ query }}" placeholder="Buscar por título..." aria-label="Buscar servicios por título" class="max-w-xs">
    {# botón que envía la búsqueda #}
    <button type="submit" class="bg-slate-700 text-white px-3 py-2 rounded-lg">Buscar</button>
    {# if query: el enlace "Quitar búsqueda" solo aparece si hay algo buscado #}
    {% if query %}
      {# enlace a /servicios/ sin ?q=, para volver a ver todo #}
      <a href="{% url 'servicios' %}" class="text-slate-600 underline">Quitar búsqueda</a>
    {# endif: fin del bloque condicional #}
    {% endif %}
  {# cierra el formulario de búsqueda #}
  </form>

  {# overflow-x-auto: en celulares (~375px) la tabla se desplaza de lado en vez de romper la página #}
  <div class="overflow-x-auto">
    {# table w-full: la tabla ocupa todo el ancho; border dibuja el contorno gris #}
    <table class="w-full border border-slate-200 rounded-lg overflow-hidden">
      {# thead: la fila de encabezados, con fondo gris claro #}
      <thead class="bg-slate-100">
        {# tr: la única fila del encabezado #}
        <tr>
          {# th: encabezado de la columna del nombre #}
          <th class="text-left px-4 py-2">Servicio</th>
          {# th: encabezado de la columna del precio #}
          <th class="text-left px-4 py-2">Precio</th>
          {# th: encabezado de la columna con los enlaces Editar / Eliminar #}
          <th class="text-left px-4 py-2">Acciones</th>
        {# cierra la fila del encabezado #}
        </tr>
      {# cierra el encabezado de la tabla #}
      </thead>
      {# tbody: el cuerpo de la tabla, donde van las filas de datos #}
      <tbody>
        {# for: repite la fila una vez por cada servicio de la página actual #}
        {% for servicio in servicios %}
        {# tr: una fila por servicio; border-t dibuja la línea gris de arriba #}
        <tr class="border-t border-slate-200">
          {# td: celda con el título del servicio #}
          <td class="px-4 py-2">{{ servicio.titulo }}</td>
          {# td: celda con el precio; el $ es texto fijo antes del número #}
          <td class="px-4 py-2">${{ servicio.precio }}</td>
          {# td: celda de las acciones; whitespace-nowrap evita que los 2 enlaces se partan en 2 renglones #}
          <td class="px-4 py-2 whitespace-nowrap">
            {# url 'editar_servicio' servicio.pk: arma la dirección /servicios/<id>/editar/ #}
            <a href="{% url 'editar_servicio' servicio.pk %}" class="text-blue-600 underline">Editar</a>
            {# url 'eliminar_servicio' servicio.pk: arma la dirección /servicios/<id>/eliminar/ #}
            <a href="{% url 'eliminar_servicio' servicio.pk %}" class="text-red-600 underline ml-3">Eliminar</a>
          {# cierra la celda de las acciones #}
          </td>
        {# cierra la fila de este servicio #}
        </tr>
        {# empty: se dibuja SOLO si no hay ningún servicio que mostrar #}
        {% empty %}
        {# fila única con el aviso; colspan="3" la estira a lo ancho de las 3 columnas #}
        <tr>
          {# if query: el mensaje cambia si la lista está vacía por una búsqueda o porque no hay registros #}
          <td colspan="3" class="text-center text-slate-500 py-6">{% if query %}No hay servicios que coincidan con "{{ query }}".{% else %}Aún no tienes servicios. ¡Crea el primero!{% endif %}</td>
        {# cierra la fila del aviso #}
        </tr>
        {# endfor: fin de la repetición #}
        {% endfor %}
      {# cierra el cuerpo de la tabla #}
      </tbody>
    {# cierra la tabla #}
    </table>
  {# cierra el contenedor con desplazamiento lateral #}
  </div>

  {# if num_pages > 1: los controles de página solo aparecen si hay más de una página #}
  {% if servicios.paginator.num_pages > 1 %}
  {# nav: barra de paginación; aria-label la nombra para lectores de pantalla #}
  <nav class="mt-4 flex items-center gap-2" aria-label="Paginación">
    {# has_previous: True si no estamos en la primera página #}
    {% if servicios.has_previous %}
      {# previous_page_number: la página anterior · q=…: conserva la búsqueda al cambiar de página #}
      <a href="?{% if query %}q={{ query|urlencode }}&{% endif %}page={{ servicios.previous_page_number }}" class="text-blue-600 underline px-2 py-2">← Anterior</a>
    {# endif: fin del bloque "Anterior" #}
    {% endif %}
    {# number y paginator.num_pages: página actual sobre el total de páginas #}
    <span class="text-slate-500">Página {{ servicios.number }} de {{ servicios.paginator.num_pages }}</span>
    {# has_next: True si existe una página después de la actual #}
    {% if servicios.has_next %}
      {# next_page_number: la página siguiente · q=…: conserva la búsqueda al cambiar de página #}
      <a href="?{% if query %}q={{ query|urlencode }}&{% endif %}page={{ servicios.next_page_number }}" class="text-blue-600 underline px-2 py-2">Siguiente →</a>
    {# endif: fin del bloque "Siguiente" #}
    {% endif %}
  {# cierra la barra de paginación #}
  </nav>
  {# endif: fin del bloque de paginación #}
  {% endif %}
{# endblock: fin del bloque contenido #}
{% endblock %}

# render, redirect, get_object_or_404: los mismos atajos de Django que ya usabas en la Semana 5
from django.shortcuts import render, redirect, get_object_or_404
# connection: datos de la conexión a la base (lo usa la vista "inicio" de la Semana 3)
from django.db import connection
# login_required: decorador que exige sesión iniciada antes de entrar a la vista
from django.contrib.auth.decorators import login_required
# login: inicia la sesión de un usuario · logout: la cierra
from django.contrib.auth import login, logout
# UserCreationForm: formulario de registro listo · AuthenticationForm: formulario de inicio de sesión listo
from django.contrib.auth.forms import UserCreationForm, AuthenticationForm
# messages: mensajes flash que se muestran una sola vez y luego desaparecen
from django.contrib import messages
# Paginator: divide una lista larga de registros en páginas de tamaño fijo
from django.core.paginator import Paginator
# Servicio: el modelo de la Semana 4
from .models import Servicio
# ServicioForm: el ModelForm de la Semana 5
from .forms import ServicioForm


# inicio: la vista de la Semana 3 que muestra a qué base estás conectado (no cambia)
def inicio(request):
    # settings_dict: diccionario con ENGINE, HOST, NAME, etc. de la conexión activa
    info_bd = connection.settings_dict
    # contexto: los datos que la plantilla podrá usar
    contexto = {
        # motor: el tipo de base de datos (debe decir mysql)
        'motor': info_bd['ENGINE'],
        # host: el servidor de la base (en Aiven termina en aivencloud.com)
        'host': info_bd['HOST'],
    # cierre del diccionario contexto
    }
    # render: junta inicio.html con el contexto y devuelve la página
    return render(request, 'core/inicio.html', contexto)


# @login_required: si no hay sesión, manda a LOGIN_URL en lugar de ejecutar la vista
@login_required
# servicios: la vista del listado, ahora con búsqueda y paginación
def servicios(request):
    # filter(propietario=request.user): solo los servicios del usuario actual (Semana 6)
    # order_by('-creado_en', '-id'): del más nuevo al más viejo; '-id' desempata si dos se crearon al mismo tiempo (paginar exige un orden fijo)
    lista_servicios = Servicio.objects.filter(propietario=request.user).order_by('-creado_en', '-id')
    # request.GET.get('q', ''): lee el texto buscado desde ?q=algo; '' si no hay búsqueda · strip() quita espacios sobrantes
    query = request.GET.get('q', '').strip()
    # si el usuario escribió algo en el buscador...
    if query:
        # titulo__icontains=query: WHERE titulo LIKE '%query%', sin distinguir mayúsculas/minúsculas
        lista_servicios = lista_servicios.filter(titulo__icontains=query)
    # Paginator(lista, 5): agrupa los resultados (ya filtrados) en páginas de 5 registros cada una
    paginator = Paginator(lista_servicios, 5)
    # request.GET.get('page'): lee el número de página desde la URL, ej. ?page=2
    numero_pagina = request.GET.get('page')
    # get_page(): devuelve la página pedida; si no es un número da la 1, y si se pasa del total da la última
    pagina = paginator.get_page(numero_pagina)
    # servicios: la página actual (se recorre igual que una lista) · query: para que el buscador recuerde lo escrito
    return render(request, 'core/servicios.html', {'servicios': pagina, 'query': query})


# @login_required: si nadie inició sesión, Django lo manda a LOGIN_URL (el login de /admin)
@login_required
# crear_servicio: la vista que atiende /servicios/nuevo/
def crear_servicio(request):
    # request.method: distingue si el navegador pide el formulario (GET) o lo está enviando (POST)
    if request.method == 'POST':
        # ServicioForm(request.POST): reconstruye el formulario con los datos que el usuario tecleó
        form = ServicioForm(request.POST)
        # is_valid(): corre todas las validaciones del modelo (tipos, max_length, campos obligatorios)
        if form.is_valid():
            # commit=False: crea el objeto Servicio en memoria SIN guardarlo todavía en MySQL
            nuevo = form.save(commit=False)
            # propietario: se asigna aquí, no en el formulario, para que nadie pueda falsificarlo
            nuevo.propietario = request.user
            # save(): ahora sí guarda el registro completo en MySQL
            nuevo.save()
            # redirect('servicios'): evita reenvíos duplicados si el usuario recarga la página
            return redirect('servicios')
    # si no es POST, es GET: el usuario apenas abrió la página
    else:
        # ServicioForm() sin datos: formulario vacío
        form = ServicioForm()
    # render: dibuja la plantilla, pasándole el formulario (vacío o con errores)
    return render(request, 'core/servicio_form.html', {'form': form, 'titulo_pagina': 'Nuevo servicio'})


# @login_required: solo usuarios con sesión pueden editar
@login_required
# pk: el id que viene en la URL /servicios/<pk>/editar/
def editar_servicio(request, pk):
    # get_object_or_404 con DOS condiciones: el id correcto Y que el dueño sea el usuario actual
    # si alguien intenta editar el servicio de otro cambiando el número en la URL, recibe un 404
    servicio = get_object_or_404(Servicio, pk=pk, propietario=request.user)
    # si el usuario envió el formulario con cambios, la petición llega como POST
    if request.method == 'POST':
        # instance=servicio: el formulario actualiza ESE registro en vez de crear uno nuevo
        form = ServicioForm(request.POST, instance=servicio)
        # is_valid(): revisa tipos, campos obligatorios y tu clean_precio
        if form.is_valid():
            # save(): guarda los cambios en MySQL (UPDATE)
            form.save()
            # redirect: regresa al listado después de guardar
            return redirect('servicios')
    # si no es POST, es GET: se acaba de abrir la pantalla de edición
    else:
        # formulario precargado con los datos actuales del servicio
        form = ServicioForm(instance=servicio)
    # render: dibuja el mismo template de Crear, con título "Editar servicio"
    return render(request, 'core/servicio_form.html', {'form': form, 'titulo_pagina': 'Editar servicio'})


# @login_required: solo usuarios con sesión iniciada pueden borrar
@login_required
# eliminar_servicio: recibe el pk (id) desde la URL /servicios/<pk>/eliminar/
def eliminar_servicio(request, pk):
    # mismo candado que en editar: el id correcto Y que el dueño sea el usuario actual; si no, 404
    servicio = get_object_or_404(Servicio, pk=pk, propietario=request.user)
    # solo se borra si llega un POST (el botón de confirmar), nunca con un simple GET
    if request.method == 'POST':
        # delete(): borra la fila de MySQL de verdad
        servicio.delete()
        # redirect: regresa al listado, ya sin el registro borrado
        return redirect('servicios')
    # si es GET, solo muestra la pantalla de "¿Seguro?"; todavía no borra nada
    return render(request, 'core/servicio_confirm_delete.html', {'servicio': servicio})


# registro: la vista que atiende /registro/ (recibe la petición del navegador)
def registro(request):
    # si el usuario envió el formulario (botón «Registrarme»), la petición llega como POST
    if request.method == 'POST':
        # reconstruye el formulario con los datos tecleados (usuario y contraseñas)
        form = UserCreationForm(request.POST)
        # is_valid(): revisa que el usuario no exista y que las 2 contraseñas coincidan y sean seguras
        if form.is_valid():
            # save(): crea el User en MySQL, ya con la contraseña hasheada por Django
            usuario_nuevo = form.save()
            # login(): inicia sesión automáticamente con la cuenta recién creada
            login(request, usuario_nuevo)
            # messages.success: mensaje verde de bienvenida que se verá una sola vez en la siguiente página
            messages.success(request, f'Cuenta creada. ¡Bienvenido, {usuario_nuevo.username}!')
            # redirect: manda al usuario ya logueado al listado (name='servicios')
            return redirect('servicios')
    # si no es POST, es GET: el usuario apenas abrió la página
    else:
        # formulario vacío para cuando la vista se abre por primera vez (GET)
        form = UserCreationForm()
    # render: dibuja registro.html con el formulario (vacío o con los errores)
    return render(request, 'core/registro.html', {'form': form})


# iniciar_sesion: la vista que atiende /login/
def iniciar_sesion(request):
    # si el usuario envió usuario y contraseña, la petición llega como POST
    if request.method == 'POST':
        # AuthenticationForm necesita "request" además de los datos, para poder validar contra la BD
        form = AuthenticationForm(request, data=request.POST)
        # is_valid(): aquí Django comprueba que el usuario exista y la contraseña sea correcta
        if form.is_valid():
            # get_user(): devuelve el User ya verificado · login(): guarda la sesión en una cookie
            login(request, form.get_user())
            # messages.success: mensaje verde que confirma el inicio de sesión
            messages.success(request, 'Sesión iniciada correctamente.')
            # redirect: tras iniciar sesión, lo manda al listado de servicios
            return redirect('servicios')
    # si no es POST, es GET: el usuario apenas abrió la página de login
    else:
        # AuthenticationForm(): formulario vacío de usuario y contraseña
        form = AuthenticationForm()
    # render: dibuja login.html con el formulario (vacío o con el error de credenciales)
    return render(request, 'core/login.html', {'form': form})


# cerrar_sesion: la vista que atiende /logout/
def cerrar_sesion(request):
    # logout(request): invalida la sesión actual; request.user vuelve a ser AnonymousUser
    logout(request)
    # messages.info: guarda un mensaje que se muestra una única vez en la próxima página
    messages.info(request, 'Sesión cerrada correctamente.')
    # redirect: manda a la pantalla de login, donde se verá el mensaje
    return redirect('login')

# Revisa que no haya errores de escritura en settings, urls, vistas ni modelos
python manage.py check
# Arranca el servidor en http://127.0.0.1:8000 (se detiene con Ctrl + C)
python manage.py runserver

# Compara tus modelos con las migraciones guardadas; si responde "No changes detected", no hay nada que hacer
python manage.py makemigrations
# Solo si el comando anterior creó un archivo (ej. core/migrations/0002_...py): aplícalo en tu base de Aiven
python manage.py migrate
# Lista las migraciones de core: todas deben salir con [X] (aplicadas)
python manage.py showmigrations core

# Muestra a qué repo apunta hoy tu proyecto (debe salir el u3s6-… de la Semana 6)
git remote -v
# Cambia "origin" al repo nuevo de esta práctica; pega TU URL (set-url porque origin ya existe)
git remote set-url origin https://github.com/TU_USUARIO/u4s7-hernandez-nunez-maria-jose.git
# Confirma que ahora apunta al u4s7-… (sale dos veces: fetch y push)
git remote -v
# Lista lo que cambió: NO deben aparecer .env, venv/ ni staticfiles/
git status
# Agrega todos los archivos nuevos y modificados (incluye core/migrations/ si hubo migración)
git add .
# Crea el commit con un mensaje que describe el cambio
git commit -m "U4S7: paginacion, busqueda simple y estado vacio"
# Sube la rama main al repo nuevo; -u la deja vinculada para que después baste con "git push"
git push -u origin main

# 1) instala requirements.txt  2) junta los estáticos para whitenoise  3) aplica migraciones en Aiven; "&&" = "si el anterior salió bien, sigue"
pip install -r requirements.txt && python manage.py collectstatic --noinput && python manage.py migrate

# arranca gunicorn con miproyecto/wsgi.py; cambia "miproyecto" por la carpeta que tiene settings.py
gunicorn miproyecto.wsgi

# Imprime una clave aleatoria de ~67 caracteres; cópiala completa y pégala como valor de SECRET_KEY en Render
python -c "import secrets; print(secrets.token_urlsafe(50))"

# nombre de la base de Aiven (cópialo de tu .env local)
DB_NAME=defaultdb
# usuario de Aiven (cópialo de tu .env local)
DB_USER=avnadmin
# contraseña real de Aiven (cópiala de tu .env local)
DB_PASSWORD=tu-password-real-de-aiven
# host real de Aiven, sin https:// (cópialo de tu .env local)
DB_HOST=tu-host-real.aivencloud.com
# puerto real de Aiven (cópialo de tu .env local)
DB_PORT=12345
# clave NUEVA generada con el comando de arriba, solo para Render
SECRET_KEY=pega-aqui-la-clave-nueva
# en producción SIEMPRE False
DEBUG=False
# tu dominio de esta práctica: SIN https:// y SIN / al final
ALLOWED_HOSTS=u4s7-hernandez-nunez-maria-jose.onrender.com
# tu dirección completa: CON https:// y SIN / al final
CSRF_TRUSTED_ORIGINS=https://u4s7-hernandez-nunez-maria-jose.onrender.com

# 1. Render descarga tu repo u4s7-… de GitHub
==> Cloning from https://github.com/tu-usuario/u4s7-hernandez-nunez-maria-jose
# 2. empieza tu Build Command
==> Running build command 'pip install -r requirements.txt && ...'
# 3. pip instaló Django, PyMySQL, gunicorn, whitenoise, python-decouple...
Successfully installed Django-5.1.4 PyMySQL-1.1.1 gunicorn-23.0.0 ...
# 4. collectstatic juntó tus CSS/JS e imágenes
127 static files copied to '/opt/render/project/src/staticfiles', 381 post-processed.
# 5. migrate se conectó a Aiven; si no cambiaste modelos, no hay nada pendiente (correcto)
No migrations to apply.
# 6. el build terminó bien
==> Build successful 🎉
# 7. arranca tu Start Command
==> Running 'gunicorn miproyecto.wsgi'
# 8. el estado cambia a "Live" en verde: tu sitio ya responde
==> Your service is live 🎉

<!-- título del repo: cambia por tus nombres reales -->
# U4S7 — [Apellido Paterno] [Apellido Materno] [Nombre(s)]

<!-- sección con la URL pública de Render -->
## Demo en vivo (producción)
<!-- tu dirección real de Render de esta práctica -->
https://u4s7-hernandez-nunez-maria-jose.onrender.com

<!-- resumen de lo que hiciste esta semana -->
## Semana 7 — Pulido funcional y UX
<!-- primera línea del resumen -->
Paginación, búsqueda simple y estado vacío agregados al listado.
<!-- segunda línea: los hallazgos de tu compañero y cómo los corregiste -->
Hallazgos de la UI review corregidos: [lístalos aquí].

# agrega solo el README modificado al área de preparación de Git
git add README.md
# crea el commit con un mensaje que explica el cambio
git commit -m "Actualizar README con avance de semana 7"
# sube el commit al repo u4s7-…; Render detecta el push y redespliega solo
git push