16 Intermediate/Advanced JavaScript Projects to Dominate Your Next Technical Interview Get it now- xplodivity.graphy.com/courses/16-js-projects-65883553e4b08ebe75f39885 - Lifetime access - Full video explanations of building each project from scratch - 10+ hours of premium content - No bullshit, No time waste - This project list Should get you ready for any JavaScript live coding interview round. - Extremely cheap (less than $10) Content list: 1. File Explorer (similar to vs-code) 2. Infinitely Nested comments 3. Advanced Custom Toast notification from scratch 4. Drag & Drop, Swap, Add and delete elements using JavaScript 5. Custom Calendar/Date-picker 6. Multi-Select dropdown with support to add & remove elements 7. Build a Memory game with all rules integrated 8. Build an analog clock with smooth animation 9. Dynamic Progress bar with custom input support 10. Build a Star rating system with dynamic hover effects 11. Build a tic tac toe game with best practices 12. Advanced To-Do List with Local Storage support 13. Accordion with smooth transition effects 14. Countdown timer & days remaining timer 15. Create a custom modal 16. Build an optimised Chessboard
Shouldn't the changeWidth function change the width of the progress-done div, not the progress div? That's the one with the gradient that starts with a width of 0.
just want to ask bro, how do i create a progress tracker where i can create a a project that has percentage on how much progress it's making hope someone can answer... thank you
16 Intermediate/Advanced JavaScript Projects to Dominate Your Next Technical Interview
Get it now- xplodivity.graphy.com/courses/16-js-projects-65883553e4b08ebe75f39885
- Lifetime access
- Full video explanations of building each project from scratch
- 10+ hours of premium content
- No bullshit, No time waste
- This project list Should get you ready for any JavaScript live coding interview round.
- Extremely cheap (less than $10)
Content list:
1. File Explorer (similar to vs-code)
2. Infinitely Nested comments
3. Advanced Custom Toast notification from scratch
4. Drag & Drop, Swap, Add and delete elements using JavaScript
5. Custom Calendar/Date-picker
6. Multi-Select dropdown with support to add & remove elements
7. Build a Memory game with all rules integrated
8. Build an analog clock with smooth animation
9. Dynamic Progress bar with custom input support
10. Build a Star rating system with dynamic hover effects
11. Build a tic tac toe game with best practices
12. Advanced To-Do List with Local Storage support
13. Accordion with smooth transition effects
14. Countdown timer & days remaining timer
15. Create a custom modal
16. Build an optimised Chessboard
Great tutorial! Super fun way to learn more ways to use Javascript, thanks so much!
bro code please
How could I show the final html code on the web in a text area?
thank you
Thanks for the tutorial.
I have a question how would I also add the value beside the percentage to make it look like this?
EX: $100/50%
Thank U 👍
Shouldn't the changeWidth function change the width of the progress-done div, not the progress div? That's the one with the gradient that starts with a width of 0.
Here you go:
const progress = document.querySelector(".progress-done")
const input = document.querySelector(".input")
const maxInput = document.querySelector(".maxInput")
let finalValue = 0;
let max = 0;
function changeWidth(){
progress.style.width = "${(finalValue / max ) * 100}%"
progress.innerText = "${Math.ceil(finalValue / max ) * 100}%""
}
input.addEventListener("keyup", function() {
finalValue = parseInt(input.value, 10);
changeWidth()
});
maxInput.addEventListener("keyup", function() {
max = parseInt(maxInput.value, 10);
changeWidth()
});
just want to ask bro, how do i create a progress tracker where i can create a a project that has percentage on how much progress it's making hope someone can answer... thank you
@@muhammadhusaynamilaiyub6911 ask chatgpt it's not hard
thanks
send to us the code...
please
Type it and learn 😊