javascriptdenoobapro@gmail.com

Tabla estática – Ejercicio Práctico

📒Proyecto práctico donde vamos a aprender a programar una tabla estática con Javascript.

Vamos a utilizar 📊estadísticas de 🎾🎾Tenis trabajando con HTML, CSS y JavaScript 🚀🚀🚀Convertimos datos de CSV a JSON y los utilizamos en Javascript para crear una tabla simple personalizando el estilo y añadiendo una 🖼 imagen de fondo.

00:00 Inicio vídeo ( Tabla Ranking ATP 2020 con HTML, CSS y Javascript)

00:18 Presentación del proyecto a desarrollar 01:04 Conversor CSV a JSON

03:35 Cómo vincular el nuevo archivo .js (con los datos) a los archivos .html, .css y .js

05:35 (V-1) Accedemos a los 2 primeros jugadores y los mostramos en pantalla

07:59 (V-2) Accedemos a los 10 primeros jugadores creando 10 divs (uno por uno)

09:12 (V-3) Accedermos a los 10 primeros jugadores utilizando un iterador

12:56 (V-3) Iterador

16:25 (V-4) Recuperamos 4 datos de cada jugador y los mostramos como una lista en pantalla

19:03 (V-5) Añadimos los títulos y creamos la estructura con todos los datos que formarán parte de la tabla, mostrándose en pantalla como un listado de títulos y datos.

26:14 CSS – Añadimos estilo a nuestra estructura para darle forma, posicionar los elementos donde deseamos y ponerle una imagen de fondo