Typewriter Effect : Frontend Coding Exercise

programming
1

This is where you can share your code for solving the Typewriter Effect exercise :slight_smile:

2

This is always a fun one for teaching beginners. I usually start with setTimeout and then show how requestAnimationFrame can make it smoother.

function typewriterEffect(element, text, i = 0) {
  if (i < text.length) {
    element.textContent += text.charAt(i);
    setTimeout(() => typewriterEffect(element, text, i + 1), 100);
  }
}

// Example usage:
// const myElement = document.getElementById('my-typewriter-div');
// typewriterEffect(myElement, 'Hello, world!');