Create a simple calculator using HTML, CSS, JavaScript

Let's create a cool calculator with HTML, CSS, JavaScript. This project is aimed to help beginners, who just started their javascript / frontend developer journey.

Please leave feedback in the comments, so I can improve my content to help you guys out more.

Where you can find me?
🔗 Links:

[JsAcademyOfficial]

New web development tutorial from me: Memory card game using Javascript, HTML, and CSS: 🔥

[bishounenbrat]

I can't believe how easy this was! You're a really good teacher.

[imnas]

Really great tutorial. Thank you very much. I've just fiinished js course and wanted to practice by making so calculator but all the videos on ytb are so overwhelming. Thankfully I found your video and in one hour ish I finished this project. Now I'm confident to make one calculator by my own

[totzisn]

Thank you so much for this tutorial! it was simple and very practicle im new to javascript and css and html and this was a great video for me to learn! keep it up!

[swws]

If you want to make the eval part a bit safer, you can add a Regex at the end like this

output.innerText = eval(output.innerText.replace(/[^-+/*\d]/g, ''));

This will make it so it only accepts numbers and the special characters included in the script

[reginaldamedee]

Subscribed! The eval function makes this much easier. I also had to look up the difference between innerHTML and innerText. Thank you for this tutorial!

[shuvambiswas]

Absolutely simple and exceptionally beginner friendly tutorial. Kudos to you!

[StephenBeale]

really nice, thanks. Loved the scale and speed - a great confidence builder. One tip for presentation - when you are working at the bottom of the screen, (e.g. @ 4:52 for about 30 seconds ) the player bar pops up and obscures your work, especially when I am flicking back and forth between YT and VS Code. Just a small thing but would help to follow along if most work is closer to the middle. Cheers.

[marcomacaluso]

easily understandable, short so its impossible to get distracted and just delivered really well. great video, thanks

[ampzmeter]

Subscribed! Awesome video, Iv just started my Java script module and want to try making a calculator as a mini project. Will definitely be watching the rest of your work!

[de-stressmusic]

This is a great tutorial, but for beginner programmers I would not recommend using eval() especially in real-world projects. To quote from MDN page "Warning: Executing JavaScript from a string is an enormous security risk. It is far too easy for a bad actor to run arbitrary code when you use eval(). See Never use eval()!, below."

[lungelomkhize]

Been struggling to make calculator the whole day and decided to search it and this guy did it in under 15 minutes LOL I need some sleep!!

[cyriljephery]

Thanks a lot for this tutorial, I'm learning Javascript and i needed a project to start with... this was simplified and precise....Subscribed

[pinkbalem]

I dont understand why u add the 'e' after declaring the click event listener at 7:01.. what does it do? and why shouldnt i just leave a blank ( ) ?

im just starting so i googled a lot about all the things you did on the vid but i cant find an answer to that, i dont know how to word my question to google.. but i hope u can answer it!

[rahat_]

Thanks man. was searching something like this. simple but effective

[Amber-wtcu]

Thank you! I'm learning JavaScript. This was a little/lot above my knowledge but it was finally nice to implement some JavaScript vs. endless amounts of freeCodeCamp.

[andreacassotti]

Thank you! I have never seen Javascript in action before and after this video it looks easier

[august]

Really well made tutorial video! Thanks a lot!
Now I would like to see how you do it without using eval()!

[BARABAA]

Hello I followed this tutorial and it doesn't work my problem is that it doesn't type when I click the buttons, please help me I'm in a rush

[walkahh]

am i missing a package or something? i was even at the point of copy and pasting everything exactly and it still didn't work. every single html js and css. did something break or something?