JavaScript Project: Counter

JavaScript adds interactivity to any of the webpages you see. That is why UltraDevX has started created this tutorial a JavaScript project so you can learn JavaScript. With this tutorial you will be able to create a counter in HTML, CSS and JavaScript. I recommend every one should do this tutorial as the basics are the most important. We will add some buttons so you can increase, decrease or reset the timer.
Subscribe, as it helps a lot.
➡️ Subscribe: bit.ly/2OtU0m7
----------------------------------------
+ Video files
bit.ly/3qmToMZ
😀️ Links
Github: github.com/Ult...
Dev.to: dev.to/ultradevx

[@ayaali746]

wooo
Very nice and accurate explanation, thank you

[@ultradevx]

Glad you liked it!

[@BePositiveDaily247]

I really liked the way u explained it. It was very engaging and very cool
too!

[@ultradevx]

Glad you liked it.

[@HrishiKW]

straight to the point no bs

[@ultradevx]

Thank you

[@smitallunawat6167]

Great job and explained every bit perfectly!

[@ultradevx]

Glad it helped.

[@DamosyTheFreckle]

I did this, it is amazing! But everytime I refresh or close tab, I lose the number where I previously left off. How do I make it such that everytime I refresh, i still get the previously stored number?

[@ultradevx]

Hello @DamosyTheFreckle, thanks for the compliments. I am thinking of starting to upload again very soon. I will then upload a video where we can store the counter.

[@thangamaniav9840]

Thanks for your simple, easily understood video. Superb.
From this I got my first successful javaScript, HTML, css project.

[@ultradevx]

Glad it helped.

[@thehippo_]

@@ultradevx Do you have email?

[@sartajansari2538]

Thank you for support

[@ultradevx]

Any time!

[@ItsMe-vn2gi]

Thank you

[@ultradevx]

Glad you liked it

[@cRillystr]

With this code how can I disable the decrease button if the value < 0? Nice video.

[@ultradevx]

I updated the github repo to disabled the decrease button if the value is less than 0.

[@yourman8808]

it was a great video .

[@ultradevx]

Thank you

[@ChristopherRobbin-ub6rw]

thank

[@ultradevx]

Your welcome.

[@TokijikarinShikaki]

hyy yrr why did'nt you show output after write a several line of code😪

[@ultradevx]

I thought the final output would be sufficient. Will note your point for my future videos.

[@axelalex08]

What The extensii is that for ===??

[@ultradevx]

The === checks if the two values are equal.

[@mverma7845]

so If I have the if (count > 0) {
counter.styles.color = 'green';
}

if (count < 0) {
counter.styles.color = 'red';
}
if (count === 0) {
counter.styles.color = 'black';
}
my code doesn't work, if I comment it out everything works
I get an error in the console that says Uncaught TypeError Can not set properties of undefined (setting 'color') would you know why?

[@ultradevx]

Change all the styles to style

[@mverma7845]

@@ultradevx that worked thanks

[@ultradevx]

Your welcome

[@ibrahimyusufgarba1243]

there is additional 's' in your code (styles) that you need to remove for it to work. I think it should be :
if (count > 0) {
counter.style.color = 'green';
}

if (count < 0) {
counter.style.color = 'red';
}
if (count === 0) {
counter.style.color = 'black';
}

[@angelaparkes451]

The files dont seem to work anymore

[@ultradevx]

When I downloaded the files, it was working fine on my computer.

[@fadeharumaiza6662]

same but nice work

[@gfddgitgud3848]

Hi sir u still developing?

[@ultradevx]

Hello sir, I still code but I am not able to find time to make videos.

[@tupanceayx86]

any way to make it animated?

[@ultradevx]

It will be very hard to make the counter animated as you will have to install a lot of things.

[@tupanceayx86]

@@ultradevx could you make a tutorial about it?

[@ultradevx]

Ok

[@ultradevx]

I added the animations in the github repository. This is the link: github.com/UltraDevX/js-project-counter. I used CSS keyframes to add the animations.

[@bhanue.bhanuprakash4663]

It's not working this is false

[@ultradevx]

Check if you did all the steps properly. It worked for me and many people.