Create a Progress Bar | Frontend Coding Challenge | DevKode DOM Challenge
@Devtools Tech

HTML/CSS/JavaScriptReactBeginner
271
Do you see value in our efforts?

Devtools Tech is a free platform for Frontend Engineers. It takes a lot of time, effort, and finanical resources to keep the platform running. If you see any value in our work and would like to support us then you can do using the following options.

InternationalDomestic

In this challenge, the candidate needs to omplement a progress/loading bar that animates from 0 to 100% in N seconds. (for example: 3 seconds)

  • Start loading bar animation upon a button click.
  • Queue multiple progress/loading bars if the button is clicked more than once. (Progress bar N starts animating with progress bar N-1 is done animating)

Mockups

  • Default State

Default State

  • On 1 Click

On 1 Click

  • On 5 Click (Queue)

On 5 Click

Demo

Demo

Submission

Please start the timer before starting and finish your solution within 60-90 mins. Share your solution with us on Twitter or LinkedIn.

This question is part of DevKode Coding Challenges. Find the original challenge here