Do you want to be a better web developer? Do you want to learn how to implement amazing front-end user interfaces? The videos in this channel will take you there...and possibly even further.
If you like the content and find it useful, please share it with your friends and enemies!
You said that 2 to the power of 1 is four. Two to the power of 1 is two. You also said that "The binary value of 11 is 5 in the decimal world." The binary value of 11 is 3 in decimal.
Tonya - thanks for flagging these mistakes! I think this is something that will require me to re-record these videos, so I'll prioritize them higher in my queue.
Cool tutorial. Would be better if you used external style sheets and found a solution without inline styles. you cant realistically use inline styles on a large application becasue of security issues. Styled-Components enables interpolation so that styles can be inherited from eachother. so you could use that for the delay effect
How can the frame rate be automatic on different devices? I mean the frame rate can vary on different devices. I don't want the frame rate to always be 60.
If you want your frame rate to vary on different devices, then you can simply omit all of the code shown here. A call to requestAnimationFrame without any of supporting code is all you need.
@@thang8617 Correct. You only need to implement this if you wish to fix the frame rate. For variable frame rate, you can ignore all of this code. The starting state in the video is the final state you will need 😀
No, it will not help with that. The canvas is just like a raster image. You can ensure the initial appearance is sharp, but when you start zooming in further, the individual pixels will become more visible.
@@user-lz2wf5dz2f If you have an SVG in the DOM, they are vector based. Those naturally remain crisp when zooming in. For the canvas, you will need to detect the zoom and redraw all of your visuals at the new zoom level to ensure that the pixels are drawn to scale.
@@kirupa I guess the way the DOM works is that all the elements are SVGs? Because when I zoom they are still crisp. Is the detecting zoom a solution you've encountered before? Surely there's an easier built in solution?
@@AlphaBeta-vq6ks Just redrawing the visuals again. That's the only viable option where you detect the zoom level and draw all the shapes at a size proportional to the zoom level.
@@kirupa Ohhh well, i really likead alot maybe you could add how to do animations and transitions in React, you know without third-party libraries.. just a thought or maybe idk you really nailed it your book 👍👍👍👍
Thank you so much my friend!!! I was trying to do ovelapping in a multiple layer animation and before I watch your video everything went wrong! And now it is working easy!
wait is this book "Absolute Beginner’s Guide to Algorithms: A Practical Introduction to Data Structures and Algorithms in JavaScript" yours ?? i love it
Glad you found it, and I am glad it helped you out! I had that same problem when I was looking for it a while ago. Seems like such a popular effect, yet all of the versions I saw were unnecessarily complicated 😅
Are you bragging with IDX on your dev machine? Or you sharing useful knowledge with people? If you are sharing knowledge - provide some useful info like, from where to download this tool, how to install this tool, how to run it, etc
"tell your friends and enemies all about it" ha, ha. Got my very old webcam not only working on linux but displaying its stream on a webpage. I'm taking the rest of the day off !
Hi KIRUPA, thank you for sharing this. I really love the simple and intuitive way you explain things. I just wonder if there are more references available to understand these concepts or ideas related to products, apps, or businesses? Thanks!
The logo, the website, the integration with Codespaces, the 3d graphics, it's all top-notch. I would love to see this idea take off! Hackathon organizers might really like this kind of thing.
I can not open it says I have to enter the whitelist but I've been trying like I do not know how many months, is it because you can not in españaa? @kirupa
This is another alternative: const animation = myElement.getAnimations()[0]; // getAnimations returns an array with all the element's animations. animation.cancel(); animation.play();
