Recursos para el módulo "PRUEBAS DE FUNCIONALIDADES Y OPTIMIZACIÓN DE PÁGINAS WEB"
Este documento recopila recursos técnicos y actualizados que complementan el temario sobre la publicación de páginas web. Incluye guías, herramientas y buenas prácticas esenciales para desarrolladores web.
HTML & CSS: Lightbox sin JavaScript
Este Codepen muestra una solución de lightbox completamente funcional usando solo HTML y CSS. Aprovecha la semántica de la etiqueta y el selector CSS :checked para crear un efecto de pantalla completa al hacer clic en una imagen, sin necesidad de una sola línea de JavaScript.
Es un ejemplo ingenioso de cómo se pueden lograr funcionalidades interactivas complejas utilizando los recursos nativos de la web, ideal para proyectos donde se busca la máxima simplicidad y rendimiento.
La clave de este truco está en la línea input:checked ~ .lightbox-overlay. El selector ~ (virgulilla o tilde) se llama "selector de hermanos generales" y significa "selecciona cualquier .lightbox-overlay que sea un hermano posterior del elemento input:checked".
| Tipo | Uso | Ejemplo |
|---|---|---|
| feat | Nueva funcionalidad | feat: añade buscador en productos |
| fix | Corrección de bugs | fix: corrige cálculo de impuestos |
| docs | Documentación | docs: actualiza README con ejemplos API |
| style | Formato / limpieza (sin afectar lógica) | style: aplica prettier en todos los archivos |
Para empezar a usar la IA, sigue el marco de 5 pasos. Una forma de recordarlo es con la frase: "Thoughtfully Create Really Excellent Inputs".
- Tarea: Describe claramente lo que quieres que la herramienta de IA generativa te ayude a hacer. Especifica una persona y un formato para la respuesta.
- Contexto: Proporciona todos los detalles necesarios para que la IA entienda tu petición.
- Referencias: Si están disponibles, incluye ejemplos para que la herramienta de IA los utilice en la creación de su salida.
- Evaluar: Revisa la salida para ver si es útil.
| ''' | |
| 1. Instalamos la librería | |
| A) usando consola | |
| pip install pingouin | |
| B) o una celda en Colab | |
| !pip install pingouin | |
| ''' | |
| import pandas as pd | |
| import pingouin as pg |
Tu chuleta de supervivencia. Guárdala a mano en una pestaña del navegador cuando programes en Eclipse.
El "tren de vagones". Puedes añadir o quitar vagones sobre la marcha. Ideal para almacenar datos cuando no sabes cuántos vas a tener, pero necesitas acceder a ellos rápidamente por su posición.
Crear, añadir y medir: