Sigma Web Development Course - Web Development Tutorials in Hindi 🗿

Welcome to the Sigma Web Development Course - Web Development Tutorials in Hindi playlist! 🗿 📚 About this Playlist: Are you interested in learning web development but find most tutorials in English hard to follow? Look no further! This course is entirely in Hindi and is designed to take you from beginner to pro, one step at a time. 👨‍💻 Who is this for? Beginners who want to dive into web development Intermediate developers looking to sharpen their skills Anyone who prefers learning in Hindi 🛠️ What Will You Learn? HTML, CSS, and JavaScript Basics Front-end and Back-end Development Database Integration Real-world Projects And much more! 🔥 Quality Assurance: Rest assured, we've poured our hearts into creating high-quality tutorials for you. The best part? It's absolutely FREE and without any sponsors! 📅 Schedule: New videos will be added almost daily, so make sure to subscribe and hit the notification bell 🔔 to stay updated!

Curated by: CodeWithHarry (139 videos)

Currently Playing: Exercise 8 - Bounce Animation | Sigma Web Development Course - Tutorial #48

Latest Udemy Web dev Course With Certificate: https://goharry.in/webdev Access the Sigma web development course playlist: https://www.youtube.com/playlist?list=PLu0W_9lII9agq5TrH9XLIKQvv0iaF2X3w ➡️ Source Code: https://github.com/CodeWithHarry/Sigma-Web-Dev-Course ➡️ Notes and CheatSheets: https://www.codewithharry.com/notes/ ➡️ English Subtitles are now up for all the videos! Timestamps 🕰️ 00:00 Introduction 00:15 Sigma Web Developer Intro 00:25 Exercise 8 - Bounce Animation 04:04 Conclusion 04:21 Sigma Outro ►Checkout my English channel here: https://www.youtube.com/channel/UC7btqG2Ww0_2LwuQxpvo2HQ ►Instagram: www.instagram.com/codewithharry python, C, C++, Java, JavaScript and Other Cheatsheets [++]: Playlist: https://www.youtube.com/playlist?list=PLu0W_9lII9agrsRZjFECeFuWY5ev2pQlk ►Learn in One Video[++]: Python Course with 5 Projects: https://www.youtube.com/watch?v=fqF9M92jzUo Python[15 Hr]: https://www.youtube.com/watch?v=gfDE2a7MKjA&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 Python Advance[3.5 Hr]: https://www.youtube.com/watch?v=61a7UkDO50s&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 Python[1 Hr]: https://www.youtube.com/watch?v=qHJjMvHLJdg&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 Python[2 Hr]: https://www.youtube.com/watch?v=ihk_Xglr164&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 Python[15 Min]:https://www.youtube.com/watch?v=fr1f84rg4Nw&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 JavaScript[1 Hr]: https://www.youtube.com/watch?v=onbBV0uFVpo&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 C[1.3 Hr]-https://www.youtube.com/watch?v=YXcgD8hRHYY&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 php[1 Hr]: https://www.youtube.com/watch?v=xW7ro3lwaCI&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 php[2.3 Hr]:https://www.youtube.com/watch?v=1SnPKhCdlsU&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 php[Project]- https://www.youtube.com/watch?v=-al2bECumKg&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 HTML[30 Min]:https://www.youtube.com/watch?v=E3ByCRqE7Lo&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 CSS[8.5 Hr]:https://www.youtube.com/watch?v=Edsxf_NBFrw&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 CSS[1.4 Hr]:https://www.youtube.com/watch?v=u5-K_ua9sOw&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 Wordpress[3.2 Hr]:https://www.youtube.com/watch?v=GlLRYml8mCY&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 Angular[2 Hr]:https://www.youtube.com/watch?v=0LhBvp8qpro&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 Java[2.3 Hr]:https://www.youtube.com/watch?v=rV_3Lewxx6o&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 Web Scraping[1 Hr]:https://www.youtube.com/watch?v=uufDGjTuq34&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 MongoDB[2 Hr]:https://www.youtube.com/watch?v=oSIv-E60NiU&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 Numpy[1 Hr]:https://www.youtube.com/watch?v=Rbh1rieb3zc&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 Android Dev[12 Hr]- https://www.youtube.com/watch?v=mXjZQX3UzOs Linux[1 Hr]:https://www.youtube.com/watch?v=_tCY-c-sPZc&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 JQuery[1.1 Hr]:https://www.youtube.com/watch?v=YFlx1C8XwR0&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 Git and GitHub[1.1 Hr]:https://www.youtube.com/watch?v=gwWKnnCMQ5c&list=PLu0W_9lII9ahKZ42vg2w9ERPmShYbYAB7 ►Complete course [playlist]: React: https://www.youtube.com/playlist?list=PLu0W_9lII9agx66oZnT6IyhcMIbUMNMdt Python-https://www.youtube.com/playlist?list=PLu0W_9lII9agICnT8t4iYVSZ3eykIAOME OOP Python-https://www.youtube.com/playlist?list=PLu0W_9lII9ahfRrhFcoB-4lpp9YaBmdCP Java:https://www.youtube.com/playlist?list=PLu0W_9lII9agS67Uits0UnJyrYiXhDS6q JavaScript- https://www.youtube.com/playlist?list=PLu0W_9lII9ajyk081To1Cbt2eI5913SsL PHP-https://www.youtube.com/playlist?list=PLu0W_9lII9aikXkRE0WxDt1vozo3hnmtR C-https://www.youtube.com/playlist?list=PLu0W_9lII9aiXlHcLx-mDH1Qul38wD3aR C++-https://www.youtube.com/playlist?list=PLu0W_9lII9agpFUAlPFe_VNSlXW5uE0YL Git & GitHub-https://www.youtube.com/playlist?list=PLu0W_9lII9ahVQekD7ePHmnirTePXwIln Android Dev- https://www.youtube.com/playlist?list=PLu0W_9lII9aiL0kysYlfSOUgY5rNlOhUd Python GUI- https://www.youtube.com/playlist?list=PLu0W_9lII9ajLcqRcj4PoEihkukF_OTzA Web Development- https://www.youtube.com/playlist?list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg Python Django:https://www.youtube.com/playlist?list=PLu0W_9lII9ah7DDtYtflgwMwpT3xmjXY9 Projects Using HTML, CSS & Javascript- https://www.youtube.com/playlist?list=PLu0W_9lII9aiQiOwthuSvinxoflmhRxM3 Data Structure and Algo:https://www.youtube.com/playlist?list=PLu0W_9lII9ahIappRPN0MCAgtOu3lQjQi Follow Me On Social Media ►Website (created using Django Rest & Angular): https://www.codewithharry.com ►Facebook: https://www.facebook.com/CodeWithHarry ►Instagram: https://www.instagram.com/codewithharry/ Twitter: https://twitter.com/CodeWithHarry Comment "#HarryBhai" if you read this 😉😉

Video Transcript

We have learnt transition and animation very well. Now it's time to check your transition and animation skills. I will give you a question that you have to solve. Do like the video and write Sigma patch in the comment section. Let's go to the computer screen. Let's roll the intro. Intro So friends, the exercise I want to give you now is on transition and animation. So I am going to make a folder here in the name of video 48 and after making this folder, I am going to open it in VS code. Here I will make a file in the name of index.html and put a comment. And what I will do is that I will ask you a question in the comment section and because this is going to be done with transition animation we will use transition animation, that was very easy to predict so now comes the problem which you have to solve you have this cube and here you have a background what you have to do is you have to make this cube bounce here like a ball and i will make it a ball by giving it a border radius so I will give it a border radius to make a ball so let's do it so I will come here and inspect this box I have put some CSS on it I will give it a border radius border radius and here I will give it in this way such that it becomes a ball 58 pixels, after 69 pixels it became a ball so I will make it 70 pixels only, its border radius let's go and after doing this this box has become a ball and I will put a semicolon here and you see it has become aolon and you see this ball is made what you have to do is to make this ball like a real ball this is a physics simulation and some of you will find it difficult but I will give you some hints because I know it can be a little difficult for you now you can do this question either with transition or animation I don't have any problem with that. Your choice will be, you want to do it with transition or animation. But I would like to give a hint to you if you find it difficult. The first hint I want to give you is that you have to make a separate animation in X and separate animation in Y. At least I will solve it in this way. Make two separate animations. If you want to bounce any ball bounce then the trajectory in the y axis is like that its speed decreases so think about such animations that its speed decreases first make the y animation then make the x animation and how will the x animation be? it will be linear because your speed in x does not decrease and if you are not able to understand how to do it then you try it see in X axis you have to take it from here to here and in Y axis you have to take it from here to here such that when it is coming from here to here then its speed is decreasing and becoming zero and you have to repeat that animation backwards how to do that I told you in the animation video and both the animations have to be that animation backwards I have told you how to do that in the animation video and both the animations have to be pasted together that's it, one linear animation and one animation you have to decide and if you want to do it with transition then you can do it with transition so it will be your choice, I will not tell you anything and it is available in solution yes I know it is a little advanced exercise but I want all of you to attempt it, at least attempt it. And if you don't get it, it's okay, come to the solution, listen to me, there is no problem, if you don't get it, there is no tension, don't think of yourself as useless. Don't think of these exercises as if you are useless if you don't get it. Many people think of exercise as if you are not able to do it, so you didn't understand, no. Actually, I will tell not able to do it, so you did not understand. Actually, I will tell you how to do complex animations with exercise. Then simple animations will look like a dessert to you. Your confidence will go up. So after doing this course, I want to make you a very successful web developer. That you will not get stuck anywhere. So if you don't do this kind of work, then this will not happen in the course. I have to do this. And let's meet in the video of its solution it is going to be very interesting, do watch it if you have not accessed this playlist, then do access it by clicking here or by clicking there, save it and the whole course has been uploaded in the github, so do access it too that's all for me in this video guys thank you so much guys for watching this video

Tracks in this Playlist