1 – Primeros pasos en DevTools
Primeros pasos en DevTools
Más allá del escritorio: dispositivos y contextos reales
Conceptos básicos
Día a día del desarrollador
Errores comunes al trabajar con DevTools
Acceso a Devtools
Apertura desde el menú del navegador
Atajos de teclado más comunes (Windows/Mac)
Herramientas complementarias
Buenas prácticas
Resumen
2 – Inspección de elementos (HTML y CSS)
Inspección de elementos (HTML y CSS)
Pestaña Elements
Estructura del panel
Árbol del DOM y estilos asociados
Inspección de elementos
Estados y pseudoclases
Gestión de clases
Box model y depuración visual
Editar código en vivo
Modificar el contenido HTML directamente
Cambiar y probar estilos CSS en tiempo real.
Copia y reutilización de código
DevTools como herramienta de aprendizaje de HTML y CSS
Privacy and Security
Resumen
3 – La consola
La consola
Interfaz
Primeros pasos
Funciones prácticas de la consola
Opciones avanzadas
Uso de comandos en JavaScript
Ejecución de instrucciones
Validación rápida de código
Detección de errores
Lectura de mensajes de error y advertencias
Resumen
4 – Red y recursos
Red y recursos
Pestaña Network
Introducción
Visualización de solicitudes
Análisis de tiempos de carga
XHR/Fetch y comportamiento dinámico
Opciones avanzadas
Pestaña Application
Exploración del almacenamiento local y de sesión
Inspección de cookies y caché
Network y Application: una visión global
Resumen
5 – Depuración de código
Depuración de código
Pestaña Sources
Estructura de archivos y scripts disponibles
Herramientas de depuración integradas
Uso de breakpoints
Inserción de puntos de interrupción
Seguimiento del flujo de ejecución paso a paso
Depuración de errores: técnicas prácticas
Resumen
6 – Análisis y Optimización
Análisis y Optimización
Accesibility Tree (Vista de accesibilidad)
Pestaña Performance
Captura de rendimiento
Medición de tiempos de renderizado
Identificación de cuellos de botella en la carga
Pestaña Lighthouse
Generación de informes automáticos
Interpretación de métricas de rendimiento, SEO y accesibilidad
Memory
Recorder (novedad en Chrome DevTools)
Grabar y reproducir flujos de usuario
Resumen
You are here:
DevTools: inspección, depuración y optimización
Duración: 24 horas ONLINE | Ref (5012)
Consulte becas o como hacer el curso sin coste.
CURSO ID
5012
MODALIDAD
ONLINE
FAMILIA
137
HORAS
24 horas
INICIO
INMEDIATO
DURACIÓN
6 semanas
Valoraciones
No hay valoraciones aún.