Javascript Animations For Beginners
HTML-код
- Опубликовано: 2 окт 2024
- AVAILABLE NOW, LIMITED PRICE!
developedbyed....
🎁Support me on Patreon for exclusive episodes, discord and more!
/ dev_ed
🛴 Follow me on:
Twitch: / developedbyed
Twitter: / developedbyed
Instagram: / developedbyed
Github: github.com/dev...
#programming
Designing ends and js starts at 33:55
omg your a life safer this guy is boring...
thanks bruh so freaking hard to see someone design a goddamn cookie during 30mn...
@@dwajdawjawodjawo Don't watch his tutorials if you find him boring.
My gorgeous friend on the Internet please launch this course on Udemy as well 🥺
For piracy
@@stumbleguysproboy8471 😒
Beautiful emoji
Indeed 🥺
udemy? Whats the difference?
It's really a good tutorial i was always struggling with SVG animation, but now i have an idea about how to do it soo. And it seems a nice course of JS animations filled with GSAP animations hints.
Thank you!
Thanks so much Sir 💙
Design Start: 2:07
Images part: 3:42
Figma part: 4:57
Design End and JS Start: 33:55
Bought the course the day it came out and already did the first chapters. Super fun and learning a lot about animations. Thanks for the great content! Happy holidays and waiting for the puppy pics!
Simple and clear, finally all the most important in one video
Still learning Javascript and this looks very promising
It's been 6 months since I left Web Development. But the funny thing is I haven't unsubscribed to your youtube channel yet 😭😭😭
Hi Ed, if you are using flexbox on the cookie container, just use gap the get the space between the svg and the text
Is it coming on Udemy?
I like to keep my courses organised at one place, if possible.
bought the course and started learning! 2nd course from you this year 🎉 THANKS!
Finally I got a perfect mentor for js animations ✨ love from India 🇮🇳
You are the best man! Thanks!
Thank you so much...❤️
This guy is my fav asmr voice
merci pour cette vidéo elle est magnifique
First view first comment and first like
why do you DevEd use a Mac?
@Dev Ed why wouldn't you make a complete tutorial on gsap and scroll magic
Hey Abijeet! Are you a fresher and open to opportunities in web development currently? Have you created any projects in JavaScript frameworks?
Importing GSAP for a simple cookie notice and a few animations is hurting too much the performance.
Thank u ed
Can you please upload the course on Udemy?
Mac🤐
you wasted 34 Minutes on svg, html and css and then jumps to a library frameworks. Seriously man. mention that in title.
Hello Ed is it enough to become a front end developer after enrolling all your courses
Which VS Code theme are you using?
What a cool library ❤️
I am having trouble with using gsap! VS code is not abling me to write gsap.
Hey @Dev Ed, why you switch from windows to use macos?
this is not vanilla javascript right?
GSAP seems amazing
It showing Transaction Failed due to insufficient balance even though I have enough balance in my account while purchasing this course.
Could you please resolve my issue?
BTW, thank you for such a valuable content.
Awesome tutorial.....
I learned a lot thanks for the great tutorial
He is a Devtor Strange.
more content
showing/teaching critical stuff with node express bcrypt and stuff plz.
preferably with database [mssql]..
Nice bro
im already in love
The Best ❤
thank you!
Sold! I'm enrolled :)
why are you doing it with rems? isn't pixel better?
No, rem is responsive
Figma or ligma
Awesome tutorial!! Thank you for creating this! :-) Will def experiment with using GSAP :-)
I like your courses but they have too
Many errors. I bought the last course and it had a ton of errors for me to just type along…
Cool 😎
I am from india. is there any regional discount available?
Love this❤️
Vscode theme?
Really Cool !
how can we create the custom exit pop up. when someone exits the tab or browser
Please upload this course in udemy.
awesome
Please give JavaScript more projects
This video it's very helpful for me.Thank you
I'm having problems using gsap, it tells me it's not defined. Is there anything else I need to download before using it as a script tag on html?
are the cookie files that you showed in this video free to download on your github, if so which repo to use?
Op
Ed you are the best! I was just looking for it that you uploaded it
You're an amazing person you should know that, such great content at such a reasonable price!
thanks so much you are the best Mr Ed.
We need this course on Udemy
Hi Ed can you make a course on Express,node and APIs.
i think he has some 20 min videos on his channel... id say its not very begginer friendly but its an amazing video if u know the basics ..helped me alot
@@shreyasphadnis5550 is it? I have worked on express and APIs, but have some doubts and need good explanation
@@raunac1498 Yup you should surely check it here is the link
ruclips.net/video/vjf774RKrLc/видео.html
ruclips.net/video/2jqok-WgelI/видео.html
@@shreyasphadnis5550 thanks man👍
Excellent tutorial; thank you
very amazing , thanks Ed 😍
Hello Boss Ed
Thx u so much
Nice
Awesome!!
31.30 you could add flex-shrink:0; so the cookie doesn't shrink due to padding.
PS: good work.
Well we can also use min-width to cookie
Change your default browser to Chrome
Great video....
Please can you make a video on svg imported in html....because if I create a large svg design it's always bigger than it's container which causes overflowing on the Web page which I don't want..
You can always scale it down or increase the size of the container
@@mahmudurrashid9035 okay thanks I'll try that
What VScode theme do you use? I love your videos man thanks a lot
This is the Material theme (Ocean) by Equinusocio.
Make some react projects using redux toolkit
Reasons that this course is bad.
============================
01. You get small amount of content. because he is talking very slowly and spend doing things that out of the scope. for example, writing css (he even not good at it. he tries multiple times different css rules to check whats work whats onot work).
02. When you market your course as a Javascript animation course, it should be a raw javascript course not a 3rd party library course. who cares about library. they come and go.
@Syed Mohammad Sannan Thats totally bs. If someone release a course with a name "CSS for beginners" then I expect to learn pure css from that course not freaking bootstrap or someother css framework.
Not gonna lie, l prefer more web dev simplified guy he going straight to the point wit good explanation. Also its my feeling :)
Adds girl was a so beautiful 😋🥰
Why does this need to be done in JS, when this can be much easier achieved using modern CSS animations? It’s supported by all popular browsers and doesn’t require any additional libraries..
@Syed Mohammad Sannan you can do a lot these days with plain CSS. And sure, some things are not possible, but you can just tie that functionality to a class that you toggle with JS (on scroll/click etc). In the end of the day, most common things you’d wanna do on a regular basis can be done in pure CSS (with a potential JS trigger). No libraries, no dependencies, just stuff that’s supported out of the box by most browsers.
@Syed Mohammad Sannan but my whole point is that there is not need to depend on a 3rd party library that now has to be loaded up as well. CSS animations are pretty easy and toggling a class in JS is really easy too (if you need that at all). The only reason I see for using JS animations is when you need really complex stuff, like morphing vectors from one shape into the other etc. Otherwise plain old CSS will be more then good enough for most applications.
@Syed Mohammad Sannan I get that they have their uses, but in this specific use case (the cookie popup), it would’ve been easier to just do all of this in plan CSS (with a simple JS trigger). It’s perfectly maintainable too & you don’t have to worry about compatibility or breaking changes introduced by constant updates to 3rd party libraries. If you want something complex, then it makes sense to use a library. But for simple animations like the ones in this video, CSS is more than enough in my opinion.
@Syed Mohammad Sannan I agree, both are suitable for this case, but I personally prefer to avoid adding unnecessary complexity to my dependencies as much as possible, especially for something as simple as this. Just more things to load (meaning slower load times & DOM initiation) and more potential future failure points in the code (so, in reality, poorer maintainability). Of course the 3rd party library code looks all simple & pretty. But it’s like buying a G wagon just to drive around in the city - total overkill and very poor use of otherwise incredible utility, but at least it looks cool.
I’ll put it this way, unless your animations are an integral part of your app UI (which most of the time they are not), with thousands of lines of code, I think a 3rd party library is not exactly necessary.. just animate your occasional buttons, pop ups and minor UI components using (potentially even reusable) CSS animations and call it a day