Construir un sistema de semáforos con JavaScript

Intermedio

En este proyecto, aprenderás cómo crear un sistema de semáforos que cambia el color de la luz de rojo a verde después de un cierto intervalo de tiempo. Este proyecto te ayudará a comprender los conceptos básicos de JavaScript y cómo manipular el DOM para mostrar diferentes elementos basados en eventos basados en el tiempo.

JavaScript

💡 Este tutorial está traducido por IA desde la versión en inglés. Para ver la versión original, puedes hacer clic aquí

Introducción

En este proyecto, aprenderás a crear un sistema de semáforo que cambia el color de la luz de rojo a verde después de un cierto intervalo de tiempo. Este proyecto te ayudará a entender los conceptos básicos de JavaScript y cómo manipular el DOM para mostrar diferentes elementos basados en eventos basados en el tiempo.

👀 Vista previa

cambio de color del semáforo

🎯 Tareas

En este proyecto, aprenderás:

  • Cómo configurar una estructura básica de proyecto HTML y JavaScript
  • Cómo implementar una función para cambiar la visualización del semáforo a rojo después de 3 segundos
  • Cómo implementar una función para cambiar la visualización del semáforo a verde después de 6 segundos
  • Cómo coordinar la ejecución de las funciones de luz roja y verde utilizando async/await
  • Cómo probar el sistema de semáforos y asegurarse de que funcione como se espera

🏆 Logros

Después de completar este proyecto, serás capaz de:

  • Manipular el DOM utilizando JavaScript para cambiar la visualización de los elementos HTML
  • Utilizar setTimeout() para programar eventos basados en el tiempo
  • Administrar operaciones asincrónicas con async/await
  • Probar y depurar tu código JavaScript

Profesor

labby

Labby

Labby is the LabEx teacher.