Web Development Exercises

Exercise 1: New Year's Countdown

This exercise creates a dynamic countdown that displays numbers from 10 to 1, transitioning every second. Upon reaching 0, the text "Happy New Year!" is displayed along with a festive confetti animation.

Key Features:

  • JavaScript for DOM manipulation and interval management.
  • Fluid transitions for each number change.
  • Confetti animations using CSS keyframes.

Exercise 2: Random Number Game

This game involves guessing a randomly generated number. Each attempt provides feedback (higher or lower), and the game displays a list of guesses. At the end, the total score is displayed.

Key Features:

  • JavaScript Math.random() function for random number generation.
  • Dynamic update of guesses using DOM manipulation.
  • Final score displayed after the correct answer.

Exercise 3: Turtle Movement Game

This exercise features a virtual turtle that can be moved within a restricted area using directional buttons (up, down, left, right). The turtle cannot move outside the designated zone.

Key Features:

  • Event handling using addEventListener for directional buttons.
  • Position calculations to restrict movement within boundaries.
  • Smooth animation for turtle movements.
Download All Exercises