The good method of training

You Can Do This!
1

Hello Everyone

I have more technical question to persons mostly who are mid-developers or Seniors. If we have a guy who for the first time take a more specific project but on the past he made some code in php for example.
So have a idea how to change popular slider app. Make something interesing with this and he know that some part on slider code is new for him. For example Arrays or load fields to object .

How could You advice this young geek. First make FRIENDLY with documentation of this elements and make a prictise in other folder. Maybe read documentation an try to understand the whole mechanism on this basic slider examples.
Because I don’t know Does we can called something like this as a typical ,Pattern".

Here we can make a lot changes in code and see what happened…

Below i add some example to visualise topic.
I hope my question in clear.

let slideIndex = 0;
showSlides(); // call showslide method

function showSlides() {
    let i;

    // get the array of divs' with classname image-sliderfade
    let slides = document.getElementsByClassName("image-sliderfade");

    // get the array of divs' with classname dot
    let dots = document.getElementsByClassName("dot");

    for (i = 0; i < slides.length; i++) {
        // initially set the display to
        // none for every image.
        slides[i].style.display = "none";
    }

    // increase by 1, Global variable
    slideIndex++;

    // check for boundary
    if (slideIndex > slides.length) {
        slideIndex = 1;
    }

    for (i = 0; i < dots.length; i++) {
        dots[i].className = dots[i].className.replace(" active", "");
    }

    slides[slideIndex - 1].style.display = "block";
    dots[slideIndex - 1].className += " active";

    // Change image every 2 seconds
    setTimeout(showSlides, 2000);
}