Aplicaciones Web Progresivas · ING10-1 · Avance 2: Carrito y renderizado SSR con Django (límite: domingo 18 oct 2026, 10:00 pm)
Revisión hecha el 19 oct 2026 sobre el commit entregado de cada alumno. Se clonaron los repositorios y se ejecutaron pruebas reales del carrito y de Django.
Salen de revisar las 22 entregas del avance 2. Aplican desde el avance 3: revísalas antes de entregar.
git push --force en el proyectoAl reescribir el historial, el commit que entregaste deja de estar en tu repositorio y ya no se puede comprobar qué entregaste. Si quieres corregir algo, haz un commit nuevo encima:
git add . git commit -m "Corrige X - APELLIDO APELLIDO NOMBRES" git push
Tampoco uses git commit --amend ni git rebase sobre commits que ya subiste o entregaste: también cambian el hash.
logomenu.sistemasprado.xyz/proyecto.git log -1 --format=%H y copia ese hash. Un alumno entregó un commit viejo que no tenía Django, aunque su commit más nuevo sí lo tenía, y se calificó el viejo.git push antes de entregar y comprueba en GitHub que el commit aparece. Un commit que solo está en tu computadora no se puede revisar."Avance 3: sw.js con Workbox - APELLIDO APELLIDO NOMBRES".view-source: visible. No recortes, no «esquematices», no las armes en otro programa: una imagen editada ya no demuestra nada..png: los que pide cada avance (docs/captura-ssr.png, etc.). Nada de -stjg, Captura-SSR.PNG ni .jpg.docs/ (git add docs/). Hubo README con las imágenes rotas porque las fotos no estaban en el repositorio.. Tener el archivo en docs/ no basta: si el README no lo enlaza, no se ve.<div id="catalogo"> vacío, no solo el <head>; en la SSR, tus productos con precio.![...].localStorage. Agrega productos → F5 → deben seguir ahí.catalogo.json, no los del ejemplo de la guía.carrito.js busca #carrito-lista y #carrito-total, esos id deben estar en tu index.html..gitignore sencillo en la raíz que funcione en cualquier subcarpeta:
venv/ __pycache__/ *.pyc db.sqlite3Reglas con ruta (
servidor-ssr/__pycache__/) solo cubren esa carpeta exacta. No copies el .gitignore de un compañero: trae SUS carpetas..pyc, db.sqlite3, scripts auxiliares), quítalo con un commit normal: git rm -r --cached carpeta/__pycache__ y luego commit + push.| Alumno | Commit | C1 (2) | C2 (3) | C3 (3) | C4 (1) | C5 (1) | Calificación | ¿Cambia? |
|---|---|---|---|---|---|---|---|---|
| Santos Tirado, Jesus Gustavo Tortas Santos | 08fe65c |
2 | 0 | 3 | 0 | 0 | 5 · NA | No. Se confirma. |
| Cruz Sandoval, Guillermo Esteban Tacos El Güero Cruz | 817ec7d |
2 | 3 | 3 | 0 | 0 | 8 · SA | No. Se confirma (con una corrección en la explicación del .gitignore). |
Criterios: C1 categorías · C2 carrito con localStorage · C3 Django SSR · C4 README (capturas + hash del avance 1) · C5 3 commits en 3 días distintos. Cada criterio se cumple completo o vale 0.
Repositorio: tortas-santos-pwa_santos-tirado-jesus-gustavo @ 08fe65c (15 oct, 11:02 pm)
Hay 4 botones (Todos, Tortas Clásicas, Especiales, Bebidas y Extras). Prueba: al pulsar «Bebidas y Extras» quedan visibles 5 de 15 tarjetas; «Todos» vuelve a mostrar las 15.
Qué pasa: el carrito agrega, suma/resta, quita y calcula el total, pero no guarda nada en localStorage. Al recargar la página el carrito se pierde.
Prueba en el navegador:
Total: $315.00 ✔️Object.keys(localStorage) después de agregar → [] (vacío).Total: $0.00.Por qué está mal: en js/carrito.js el carrito es solo una variable en memoria, que se borra cada vez que se recarga:
let carrito = []; // línea 1: vive solo mientras la página está abierta
...
function agregarAlCarrito(nombre, precio) {
...
renderizarCarrito(); // pinta, pero nunca llama a localStorage.setItem(...)
}
No hay ninguna llamada a localStorage.getItem ni localStorage.setItem en todo el repositorio (tampoco en servidor-ssr-stjg/.../static/js/carrito.js). La persistencia es justo lo que pide el paso 14 y el criterio dice «que persiste en localStorage», así que sin ella el criterio no se cumple.
Cómo debió quedar (mínimo):
let carrito = JSON.parse(localStorage.getItem("carrito") || "[]");
function guardar() { localStorage.setItem("carrito", JSON.stringify(carrito)); }
// llamar guardar() en agregar, cambiarCantidad y eliminar,
// y renderizarCarrito() en DOMContentLoaded para pintarlo al cargar.
aa8b514 «fix: corregir persistencia del carrito utilizando localStorage», pero lo hizo el 19 oct a las 7:17 am, después del cierre (18 oct, 10:00 pm) y no es el commit entregado. No cuenta para el avance 2; ya cuenta para el avance 3.Prueba: ejecuté servidor-ssr-stjg con Django y pedí GET /catalogo/ → HTTP 200. Los 15 de 15 nombres de catalogo.json llegan escritos en el HTML del servidor (en los <h3> de cada tarjeta). Cumple.
Detalle menor (sin descuento): se subió catalogo_stjg/migrations/__pycache__/__init__.cpython-312.pyc, porque el .gitignore lista carpetas __pycache__/ una por una y olvidó la de migrations/. Con una sola línea __pycache__/ se ignoran todas.
Las dos capturas sí existen y sí están insertadas como imagen, pero el criterio pide también el encabezado actualizado con el hash del avance 1, y eso falta:
6a6f295 y no aparece en ningún lugar del README.TDSM10-1; el grupo es ING10-1.docs/captura-ssr-stjg.png y docs/captura-csr-stjg.png; la instrucción pide exactamente docs/captura-ssr.png y docs/captura-csr.png. (Esto solo no le habría quitado el punto: las imágenes se ven.)*<div ...> {% for producto in productos %} ...*), que GitHub muestra como texto roto.Commits del avance 2 (después del commit del avance 1 6a6f295 y hasta el entregado):
6065cdf 13 oct 10:38 6c60ec9 13 oct 11:19 13b54bb 13 oct 19:09 08fe65c 15 oct 23:02 ← entregado
Son 4 commits, pero solo en 2 días distintos (13 y 15 oct). La regla dice que con menos de 3 días distintos el criterio vale 0, sin importar cuántos commits haya.
Repositorio: tacos-el-guero-cruz-pwa-cruz-sandoval-guillermo-esteban @ 817ec7d (16 oct, 11:30 pm)
Prueba: el catálogo se dibuja en 3 secciones con título (Tacos, Especialidades, Bebidas y extras) y 15 productos en total.
Prueba en el navegador: 2 × Taco de asada ($28) + 1 × Refresco de vidrio ($30) → total 86; «+» → 114; «−» → 86. En localStorage queda la clave tacos-guero-carrito. Al recargar el carrito sigue con sus 2 renglones y total 86; «🗑️» quita el producto → 30. Todo correcto.
Prueba: GET /catalogo/ → HTTP 200 y el HTML llega con 15 productos escritos por el servidor, así que el SSR sí funciona y se le dio el criterio completo.
Observación: los productos de la vista Django no son los de su catalogo.json. Están escritos a mano en views.py con otros nombres y precios:
| catalogo.json (CSR) | views.py (SSR) |
|---|---|
| Taco de asada — $28 | Taco de Asada — $35 |
| Taco de adobada — $28 | Taco de Pastor — $30 |
| Taco de tripa dorada — $32 | Taco de Tripa — $40 |
| Vampiro de asada, Quesataco, Papa asada rellena, Orden de 5 tacos | Quesadilla de Asada, Lorenza, Pellizcada, Burrito Percherón |
| Refresco de vidrio, Frijoles charros, Cebollitas asadas | Agua de Cebada, Refresco de Cola, Agua Natural |
Comparando nombres exactos, solo 1 coincide («Caramelo»); ignorando mayúsculas coinciden 5 (asada, cabeza, caramelo, horchata, jamaica), y aun así con precios distintos. La instrucción pide «que muestre TUS productos», así que la comparación SSR vs CSR no es del mismo catálogo. Se respetó el 3/3 porque el renderizado en servidor sí está; queda a criterio del docente si se descuenta.
Corrección a la revisión anterior sobre los 11 archivos __pycache__: el .gitignore no se agregó después; entró en el mismo commit. El problema es la regla: servidor-ssr-tacos-el-guero/__pycache__/ solo ignora la carpeta __pycache__ de la raíz del proyecto Django, no las de catalogo/, catalogo/migrations/ y ssr_demo/, que es donde están los .pyc. Verificado con git check-ignore: esos archivos no coinciden con su regla y sí coinciden con una regla simple __pycache__/.
docs/captura-csr.png sí existe en el repo, pero bajo el título «CSR (JavaScript): el div del catálogo llega vacío» no hay ninguna línea . En GitHub solo se ve 1 de las 2 imágenes.de78377, pero el commit que entregó en el avance 1 fue e7f96a1 (el último de los tres commits «Avance 1» del 10 oct: de78377 8:29 pm → 36903b9 8:40 pm → e7f96a1 8:42 pm). Anotó el primero, no el entregado.El 10 de octubre hizo tres commits seguidos, todos con el mensaje «Avance 1»:
| Hora | Commit | Qué contiene |
|---|---|---|
| 8:29 pm | de78377 | Todo el código: index.html, catalogo.json, css, js e imágenes |
| 8:40 pm | 36903b9 | Crea el README.md (ya con la tabla del historial) |
| 8:42 pm | e7f96a1 | Corrige una línea del README (el giro del negocio) — este es el que entregó |
En el formulario del avance 1 entregó e7f96a1, el último, y ese es el que se evaluó. Pero en el «Historial de avances» del README escribió de78377, el primero de los tres.
Por qué es un error y no solo un detalle: cada hash identifica una versión exacta del repositorio. de78377 es una versión en la que todavía no existía el README; la versión revisada y calificada es e7f96a1. Con el hash equivocado, quien lea el historial abre una versión distinta de la evaluada.
Por qué probablemente se confundió: escribió la tabla del README a las 8:40, justo después del commit del código, y anotó ese hash. Después hizo dos commits más y entregó el último. Es cierto que un archivo no puede contener el hash de su propio commit, así que en el avance 1 no podía anotar e7f96a1. Pero el avance 2 lo hizo el 16 de octubre, cuando e7f96a1 ya existía y ya lo había entregado: ahí debió corregirlo.
Cualquiera de las dos faltas basta para no cumplir el criterio: aunque se le perdonara el hash, la captura CSR sigue sin estar insertada en el README.
Entre el commit del avance 1 (e7f96a1, 10 oct) y el entregado hay un solo commit:
817ec7d 16 oct 23:30 ← entregado (todo el avance 2: 32 archivos, 474 líneas)
Todo el avance se subió en un solo commit, en un solo día.
c0c4186 (17 oct 9:14 pm), cdbef43 y db0a8fc (18 oct 10:19 y 10:24 pm). No cuentan porque son posteriores al commit entregado (la entrega ya no se puede cambiar) y los dos del 18 oct además son de después del cierre de las 10:00 pm. Aun si hubiera entregado c0c4186, tendría commits en solo 2 días (16 y 17 oct).Texto exacto del README.md en el commit entregado, junto al README que pedían las instrucciones del avance 2 (plantilla de identificación + historial con el hash del avance 1 + las 2 capturas en docs/). Colores: error que quita el punto no sigue la plantilla lo que se corrigió
Lo que pedía la instrucción: «En el README agrega 2 capturas… Guárdalas como PNG en docs/ (docs/captura-ssr.png y docs/captura-csr.png)… e insértalas en el README con  y . Anota también en 'Historial de avances' el hash del commit que entregaste en el avance 1.»
08fe65c)# Proyecto PWA - Tortas Santos **Nombre del estudiante:** Santos Tirado Jesús Gustavo **Grupo:** TDSM10-1 **Negocio:** Tortas Santos **Giro:** Tortería Mexicana (Alimentos y Bebidas) - **URL del repositorio:** [GitHub Repository](https://github.com/SantosTiradoJesusGustavoJesus06/tortas-santos-pwa_santos-tirado-jesus-gustavo)- **URL de GitHub Pages:** [GitHub Pages](https://santostiradojesusgustavojesus06.github.io/tortas-santos-pwa_santos-tirado-jesus-gustavo/) --- ## Descripción del ProyectoAplicación Web Progresiva (PWA) desarrollada para la tortería **Tortas Santos**. Permite a los clientes consultar el catálogo completo de productos, bebidas y complementos, realizar pedidos en línea y acceder a información clave del establecimiento desde dispositivos móviles y de escritorio. --- ## Historial de Avances | Avance | Descripción | Fecha / Estado || :--- | :--- | :--- || 1 | Estructura base, diseño responsivo y recursos estáticos. | 11/10/2026 || 2 | Catálogo de 15 productos, carrito interactivo y comparativa SSR vs CSR. | 18/10/2026 || 3 | Próxima implementación de características PWA (Service Workers / Offline). | 25/10/2026 || 4 | (Se escribe en el reporte PDF) | 01/11/2026 | --- ## Estructura del Proyecto (Avance 1) ```texttortas-santos-pwa_santos-tirado-jesus-gustavo/├── index.html # App Shell base y contenedor del catálogo (CSR)├── catalogo.json # Datos de los 15 productos en formato JSON├── README.md # Documentación principal del proyecto├── css/│ └── estilos.css # Estilos responsivos con paleta de color propia├── js/│ └── csr.js # Renderizado del lado del cliente (CSR) usando fetch()└── img/ # Imágenes de productos (<= 300 KB) y logo``` --- ## Estructura y Arquitectura (Avance 2) **🌮 Tortas Santos - Catálogo (SSR vs CSR)** **Alumno:** Santos Tirado Jesus Gustavo ### 🔍 Comparativa de Código Fuente: SSR vs CSR #### 1. SSR (Server-Side Rendering — Django)Los productos vienen completamente inyectados e iterados desde el servidor en el HTML inicial: ```html<div class="catalogo-grid" id="catalogo-grid"> <div class="card" data-categoria="Tortas Clásicas"> <h3 class="card-title">Torta Cubana</h3> <span class="card-price">$110.00</span> </div> <!-- ... más productos renderizados por el servidor ... --></div>```*<div class="catalogo-grid" id="catalogo-grid"> {% for producto in productos %} <div class="card" data-categoria="{{ producto.categoria }}"> <img src="{% static producto.imagen %}" alt="{{ producto.nombre }}" class="card-img" onerror="this.src='https://via.placeholder.com/150?text=Tortas+Santos'"> <div class="card-body"> <span class="card-category">{{ producto.categoria }}</span> <h3 class="card-title">{{ producto.nombre }}</h3> <div class="card-footer-info"> <span class="card-price">${{ producto.precio|floatformat:2 }}</span> <button type="button" class="btn-agregar" data-nombre="{{ producto.nombre }}" data-precio="{{ producto.precio }}" onclick="agregarDesdeBoton(this)">Agregar</button> </div> </div> </div> {% empty %} <p>No hay productos disponibles en este momento.</p> {% endfor %}</div>* #### 2. CSR (Client-Side Rendering — JavaScript)El contenedor llega vacío desde el servidor y JavaScript inyecta los elementos en tiempo de ejecución: ```html<div class="catalogo-grid" id="catalogo-grid"> <!-- El contenedor llega vacío; JavaScript poblará las tarjetas dinámicamente --></div>``` ## Comparación SSR vs CSR ### SSR (Django): los productos llegan escritos en el HTML ### CSR (JavaScript): el div del catálogo llega vacío
# Tortas Santos — PWA de ventas | Dato | Valor ||---|---|| **Alumno** | SANTOS TIRADO JESUS GUSTAVO || **Grupo** | ING10-1 || **Negocio · giro** | Tortas Santos · Tortería || **URL del repositorio** | https://github.com/SantosTiradoJesusGustavoJesus06/tortas-santos-pwa_santos-tirado-jesus-gustavo || **URL de GitHub Pages** | https://santostiradojesusgustavojesus06.github.io/tortas-santos-pwa_santos-tirado-jesus-gustavo/ | ## Historial de avances | Avance | Hash del commit entregado | Fecha ||---|---|---|| 1 | 6a6f295 | 11/10/2026 || 2 | (se anota en el avance 3) | 18/10/2026 || 3 | (hash del avance 3) | 25/10/2026 || 4 | (se escribe en el reporte PDF) | 01/11/2026 | ## Comparación SSR vs CSR ### SSR (Django): los productos llegan escritos en el HTML ### CSR (JavaScript): el div del catálogo llega vacío ## Descripción del proyectoAplicación Web Progresiva (PWA) para la tortería Tortas Santos: catálogo de15 productos agrupados en 3 categorías y carrito que se guarda en localStorage.
| Dato | Valor | con el nombre en MAYÚSCULAS, apellido paterno, materno y nombres: SANTOS TIRADO JESUS GUSTAVO.TDSM10-1 → ING10-1.6a6f295 en el avance 1 (el commit que entregó). El hash del avance 2 no puede ir en su propio commit: se anota en el avance 3.{% for producto in productos %}…) entre asteriscos *…*, fuera de un bloque de código. GitHub lo muestra como texto revuelto en cursiva. Si quiere mostrar código, debe ir entre ```html y ```; si no, se quita.captura-ssr-stjg.png / captura-csr-stjg.png → captura-ssr.png / captura-csr.png. Además de cambiar el README hay que renombrar los archivos: git mv docs/captura-ssr-stjg.png docs/captura-ssr.png (y lo mismo con la CSR).817ec7d)# Tacos El Güero Cruz — PWA de ventas | Dato | Valor ||---|---|| **Alumno** | CRUZ SANDOVAL GUILLERMO ESTEBAN || **Grupo** | ING10-1 || **Negocio · giro** | Tacos El Güero Cruz · Taquería estilo sonorense|| **URL del repositorio** | https://github.com/cruzsandovalguillermoesteban/tacos-el-guero-cruz-pwa-cruz-sandoval-guillermo-esteban|| **URL de GitHub Pages** | https://cruzsandovalguillermoesteban.github.io/tacos-el-guero-cruz-pwa-cruz-sandoval-guillermo-esteban/ | ## Historial de avances | Avance | Hash del commit entregado | Fecha ||---|---|---|| 1 | de78377 | 10/10/2026 || 2 | | 16/10/2026 | ## Comparación SSR vs CSR ### SSR (Django): los productos llegan escritos en el HTML ### CSR (JavaScript): el div del catálogo llega vacío
# Tacos El Güero Cruz — PWA de ventas | Dato | Valor ||---|---|| **Alumno** | CRUZ SANDOVAL GUILLERMO ESTEBAN || **Grupo** | ING10-1 || **Negocio · giro** | Tacos El Güero Cruz · Taquería estilo sonorense || **URL del repositorio** | https://github.com/cruzsandovalguillermoesteban/tacos-el-guero-cruz-pwa-cruz-sandoval-guillermo-esteban || **URL de GitHub Pages** | https://cruzsandovalguillermoesteban.github.io/tacos-el-guero-cruz-pwa-cruz-sandoval-guillermo-esteban/ | ## Historial de avances | Avance | Hash del commit entregado | Fecha ||---|---|---|| 1 | e7f96a1 | 11/10/2026 || 2 | (se anota en el avance 3) | 18/10/2026 || 3 | (hash del avance 3) | 25/10/2026 || 4 | (se escribe en el reporte PDF) | 01/11/2026 | ## Comparación SSR vs CSR ### SSR (Django): los productos llegan escritos en el HTML ### CSR (JavaScript): el div del catálogo llega vacío
de78377 → e7f96a1. Anotó el commit del código (8:29 pm) y no el que entregó (8:42 pm); ver la explicación en el criterio C4 arriba.. El archivo docs/captura-csr.png ya está en el repositorio, así que con esa sola línea la imagen aparece.Imágenes tal como están en docs/ del commit entregado (clic en una imagen para verla en grande; clic otra vez para cerrarla).
docs/captura-ssr.pngview-source:http://127.0.0.1:8000/catalogo/ (o su ruta).catalogo.json.captura-ssr.png, dentro de docs/ en la raíz.docs/captura-csr.pngindex.html abierto con Live Server o GitHub Pages y Ctrl+U.view-source:.<div id="catalogo"> sin tus productos (a lo mucho las tarjetas «esqueleto» producto--cargando).captura-csr.png, dentro de docs/.docs/captura-ssr-stjg.pngview-source:127.0.0.1:8000/catalogo/ (Django local).catalogo.json.captura-ssr-stjg.png; debía ser captura-ssr.png.El contenido de la captura es correcto; solo falla el nombre del archivo.
docs/captura-csr-stjg.pngview-source:https://santostiradojesusgustavojesus06.github.io/… (su GitHub Pages).id="catalogo-grid": el div llega vacío, solo con el comentario «Los productos se cargan aquí mediante csr.js».captura-csr-stjg.png; debía ser captura-csr.png.El contenido de la captura es correcto (resaltó el div vacío); solo falla el nombre del archivo.
Conclusión: las dos capturas muestran exactamente lo que se pedía. Lo que falló en C4 no son las fotos sino el README: falta el hash del avance 1 y los archivos tienen otro nombre.
docs/captura-ssr.pngview-source:127.0.0.1:8000/catalogo/ (Django local).catalogo.json (ahí son «Taco de asada $28», «Taco de tripa dorada $32», «Taco de adobada $28»; no tiene «Taco de Pastor»). La instrucción pide los nombres y precios de TUS productos.docs/captura-ssr.png, y sí está insertada en el README.Demuestra SSR, pero con un catálogo distinto al de su PWA, así que la comparación SSR vs CSR no es del mismo menú.
docs/captura-csr.pngview-source:127.0.0.1:5500/index.html (Live Server).<div id="catalogo" … aria-busy="true"> solo con las tarjetas «esqueleto» producto--cargando (con ), sin ningún producto. La guía lo permite.docs/captura-csr.png., así que en GitHub esta imagen no se ve.La captura es correcta y está en el repositorio, pero nadie la ve porque el README no la enlaza.
Conclusión: las dos capturas existen con el nombre correcto. La CSR es correcta pero no está enlazada en el README. La SSR muestra productos que no son los de su catálogo.
git checkout al commit entregado (08fe65c y 817ec7d), no a la versión actual.index.html en http://127.0.0.1 y en el navegador se agregaron productos, se usó +/−/quitar, se leyó localStorage y se recargó la página para ver si el carrito seguía.GET /catalogo/) y se buscó cada nombre de catalogo.json dentro del HTML que devuelve el servidor.git log entre el commit del avance 1 y el entregado, contando días distintos (hora de Hermosillo, UTC−7).git check-ignore -v sobre los archivos .pyc subidos.