Mini-Challenge: Make Your Page Interactive

You have 12 minutes. Pick one feature from the list below and add it to your About Me page. No code-along — this one is yours.

The options

Name greeter: An input and a button that updates a heading with "Hi, [name]!" when clicked.

Mood toggle: A single button that cycles the page background through three colours on each click. Add a counter variable that increments every time and use % 3 (the modulus operator) to loop through the colours.

Song counter: A "+1" button that increments a number displayed on the page — for example, "Songs listened to today: 0" that goes up by one each click.

Easter egg: A hidden paragraph (style="display: none") that appears only when the input contains a specific keyword. Use element.style.display = "block" to reveal it.

Rules

  • Pick one and finish it. A working name greeter beats an unfinished mood toggle.
  • If you are still deciding after two minutes, go with the name greeter — it uses everything from the morning in the most direct way.
  • Use the console when something isn't working. The error message tells you where the problem is.

When you're done

Save your work. Your page should have at least one button that does something different based on what you've built today.