Practicar la colocación

Conseguir que tus objetos aparezcan donde quieres es donde el poder de CSS empieza a brillar. Tienes tres ejemplos de CSS cargados como variables de tipo cadena (css_1, css_2, css_3). ¡Puedes imprimir cada uno en la consola!

¿Cuál de estos haría que un objeto con este CSS apareciera al lado de otro?

Este ejercicio forma parte del curso

Creación de paneles con Dash y Plotly

ejercicio interactivo práctico

Convierte la teoría en práctica con uno de nuestros ejercicios interactivos

Empezar ejercicio

Este ejercicio forma parte del curso

Creación de paneles con Dash y Plotly

IntermedioNivel de habilidad

4.8+

Empieza el curso gratis

Lleva Plotly al siguiente nivel con Dash. Tras repasar brevemente Plotly, pasarás directamente a crear tu primera app de Dash. Luego tendrás tu primer contacto con HTML y cómo Dash aprovecha este lenguaje clave del desarrollo web para estructurar apps de Dash más grandes. Por último, lo pondrás todo en práctica con tu primer panel multigráfico para una organización global de comercio electrónico.

Exercise 1: Gráficos y figuras de Plotly Exercise 2: Gráfico de líneas de ventas por país Exercise 3: Gráfico de barras de ventas por país Exercise 4: De Plotly a Dash Exercise 5: El código básico de una app de Dash Exercise 6: Ventas en una app de Dash Exercise 7: Posicionar componentes de Dash Exercise 8: Combinando HTML y Dash Exercise 9: Un borrador de panel de ventas

Toma el control de los elementos de tus apps de Dash con HTML y CSS. Aprende qué es cada uno y cómo forman la base del desarrollo web moderno; después, incorpora sus potentes capacidades en tus apps de Dash para cambiar el tamaño, el color y la ubicación de tus objetos.

Exercise 1: HTML en Dash Exercise 2: Añadir logos y notas Exercise 3: Añadir una lista HTML a Dash Exercise 4: Conceptos básicos de CSS en Dash Exercise 5: Aplicar estilos a una app de Dash con CSS Exercise 6: Cambiar a modo oscuro Exercise 7: CSS avanzado en Dash Exercise 8: Practicar la colocación

Ejercicio actual

Exercise 9: Un panel de ventas refinado Exercise 10: Controlar la disposición de objetos

Convierte tus apps de Dash en experiencias guiadas por el usuario dominando los componentes interactivos. Aprende a incluir menús desplegables, selectores de fecha y campos de texto libre para modificar elementos en tus apps de Dash y crear paneles realmente autoservicio que tus usuarios puedan explorar.

Exercise 1: Callbacks en Dash Exercise 2: Un desplegable para ventas por país Exercise 3: Arreglar un panel roto Exercise 4: Componentes interactivos Exercise 5: Selector de fecha para datos de ventas Exercise 6: Un callback con selector de fecha Exercise 7: Control deslizante para datos de ventas Exercise 8: Componentes reutilizables de Dash Exercise 9: Reutilizar componentes de Dash Exercise 10: Estilos DRY en componentes de Dash Exercise 11: Entradas de usuario en componentes de Dash Exercise 12: Actualizar el título de un gráfico Exercise 13: Analizar la ubicación de los mejores clientes

Aprovecha todo el potencial de la interactividad en Dash desencadenando cambios en un gráfico cuando el usuario haga clic o pase el cursor por encima de otro. Además, aprenderás lo básico del módulo AG Grid de Dash para crear tablas que se puedan filtrar, ordenar y paginar fácilmente, y que también puedan activar cambios en otros gráficos.

Exercise 1: Interactividad entre elementos Exercise 2: Generar estadísticas clave al pasar el ratón Exercise 3: Pasa el ratón para actualizar otra gráfica Exercise 4: Haz clic para actualizar otra gráfica Exercise 5: Callbacks encadenados Exercise 6: Opciones condicionales en desplegable Exercise 7: Ampliar la cadena Exercise 8: Introducción a Dash AG Grid Exercise 9: Tabla interactiva de métricas clave Exercise 10: Paginación de una tabla de métricas clave Exercise 11: Mejorar el panel de ventas Exercise 12: Interactividad con Dash AG Grid Exercise 13: Dar estilo a una tabla de métricas clave Exercise 14: Tablas interactivas del panel de ventas Exercise 15: Vídeo de cierre