1 Trick To Creating Awesome Websites! (JS ANIMATIONS!)

แชร์
ฝัง
  • เผยแพร่เมื่อ 17 ก.ย. 2020
  • Check out my courses to become a PRO!
    developedbyed.com/
    Today I am going to share with you my number one tip to improve the feeling/first impression of a website. Of course we are talking about adding awesome animations with javascript to improve your website presentation.
    🎁Support me on Patreon for exclusive episodes, discord and more!
    / dev_ed
    Code for you to download
    github.com/developedbyed/webs...
    🛴 Follow me on:
    Twitch: / developedbyed
    Twitter: / developedbyed
    Instagram: / developedbyed
    Github: github.com/developedbyed/
    #programming #javascript
  • วิทยาศาสตร์และเทคโนโลยี

ความคิดเห็น • 631

  • @SpaYco
    @SpaYco 3 ปีที่แล้ว +331

    who's that guy on the right trying to mimic your movement

    • @beinyourguard
      @beinyourguard 3 ปีที่แล้ว +27

      He's veD dE, his doppelganger

    • @MourideGoor
      @MourideGoor 3 ปีที่แล้ว +3

      @@beinyourguard lol A+

    • @Miles-co5xm
      @Miles-co5xm 3 ปีที่แล้ว +4

      he is also Ed but sheeran

    • @alwaysawakening4603
      @alwaysawakening4603 3 ปีที่แล้ว

      He is always trying to catch up with Eds smooth moves!

  • @shikharsinha6407
    @shikharsinha6407 3 ปีที่แล้ว +250

    "It's all darkness, just like our lives"
    That had me laughing then crying

    • @going_dark
      @going_dark 3 ปีที่แล้ว +1

      same here bhai

    • @Mightythunder0987
      @Mightythunder0987 3 ปีที่แล้ว

      I was dying lmao

    • @arjaycanas9000
      @arjaycanas9000 3 ปีที่แล้ว +1

      😂🤣

    • @bugtori
      @bugtori 2 ปีที่แล้ว +1

      WHEN HE SAID BACK TO THE CODE HE MADE ME SO FCKIN LOUD LAUGHING

  • @ewrroi3i34
    @ewrroi3i34 3 ปีที่แล้ว +218

    when you realize "innovation" is misspelled but you don't care because the animation is too cool!

    • @sankaranarayanan7847
      @sankaranarayanan7847 3 ปีที่แล้ว +2

      Ikr

    • @JCCraftB3
      @JCCraftB3 3 ปีที่แล้ว +6

      mispelling = inovative

    • @travisreed4443
      @travisreed4443 3 ปีที่แล้ว +6

      Holy crap, I literally didn't even notice this until now(and I've replayed the animation so many times)😂 Shows what a good animation can do

  • @magolao
    @magolao 3 ปีที่แล้ว +1

    I've been looking to make something just like this. THANK YOU

  • @sathvikkp201
    @sathvikkp201 3 ปีที่แล้ว +17

    Ed, you make courses and tutorials human.. Amazing work, appreciate it!

  • @andiandrei78
    @andiandrei78 3 ปีที่แล้ว +6

    I really like how you teach, it looks so real.
    - “it should work, what did I messed up”. So true

  • @samisinnari2699
    @samisinnari2699 3 ปีที่แล้ว +3

    I literally started with coding few months ago, and found this guy and I swear he is soo damn funny I fell in love in coding even more!! Keep up the good work mate!

  • @alwaysawakening4603
    @alwaysawakening4603 3 ปีที่แล้ว +1

    I love your tutorials my friend. Simple and elegant. Well done as always!

  • @sanghvian
    @sanghvian 3 ปีที่แล้ว +49

    Always refreshing to see any tutorial from you. "Best way to learn programming is by not learning programming"😂

  • @nate1988
    @nate1988 2 ปีที่แล้ว

    This was such an awesome little project. I am absolutely using this going forward -- many thanks for another great video!

  • @andrewjosephus
    @andrewjosephus 3 ปีที่แล้ว

    Thank you for making all these tutorials!! You are one of my favourite youtubers on this platform! Hope you are doing well :)

  • @michaelquirante1729
    @michaelquirante1729 3 ปีที่แล้ว

    I like your channel because you don't bs like most "developer/youtuber" does where they just talk about themselves and their journey. You actually help people and I applaud you for that. Keep these videos coming dude you are doing great! Cheers!

  • @walkingin6375
    @walkingin6375 3 ปีที่แล้ว +4

    Hey man, your channel has helped me a lot, while I'm learning Web Development.
    Just wanted to leave a like, and this comment.
    Take care. :)

  • @vladgutu6863
    @vladgutu6863 3 ปีที่แล้ว +20

    "- Let's grab 'big text'.
    -I'll tell you what else is big.."
    You cheeky boy😄😏

  • @reesericdotci
    @reesericdotci 3 ปีที่แล้ว +45

    dev ed: get the hell out of here! speaker: nooooooo dev ed: oops

  • @nobellanyarari1443
    @nobellanyarari1443 2 ปีที่แล้ว

    You're amazing and precise .. Thank you Ed .Nice tutorial . Grasped everything I needed to know!

  • @MrAcousticAnonymous
    @MrAcousticAnonymous 3 ปีที่แล้ว

    I probably could have built this and was gonna skip but your comentry & intro made me laugh so I stuck around. Ended up learning something and was very entertained. You have gained a sub good sir!

  • @guyarnav
    @guyarnav ปีที่แล้ว +2

    You are the best programming teacher I've ever used on this website. Your teaching style is amazing

  • @reapergrim5324
    @reapergrim5324 3 ปีที่แล้ว

    Hey man love you efforts it's so fun to watch and easy to learn . Hope you are doing well and stay happy❤️

  • @SteffOverflow
    @SteffOverflow 3 ปีที่แล้ว +40

    Speaker makes noice..
    Normal Person: Turns off speaker
    Ed: Unplugs speaker and throws it away ! 😂

    • @alistaw1866
      @alistaw1866 3 ปีที่แล้ว +1

      he's crazy and i love it 😂😂😂😂

  • @manishtripathi4097
    @manishtripathi4097 3 ปีที่แล้ว +94

    You'll make a course on react is the best news we can hear in 2020😭

    • @TheBelrick
      @TheBelrick 3 ปีที่แล้ว

      I was disappointed that he did use js animation instead of css. just a stylistic sort of thing

    • @nonamed56
      @nonamed56 3 ปีที่แล้ว

      @@TheBelrick why?

    • @TheBelrick
      @TheBelrick 3 ปีที่แล้ว

      @@nonamed56 websites are now getting REALLY bloated with LOTS of scripts being loaded and run.
      When profiling a site, look at how much time is spent on scripts.
      where possible, don't. CSS allows for animations without js.

    • @Creedoo
      @Creedoo 3 ปีที่แล้ว +1

      @@TheBelrick you do realize that the animations gsap library provides are way above what css can do ?

    • @TheBelrick
      @TheBelrick 3 ปีที่แล้ว

      @@Creedoo its about speed of development and reduction in scripting bloat. The ONLY things that matters is end user experience followed by that the website performs its intended functions.

  • @vaniad555
    @vaniad555 3 ปีที่แล้ว +2

    Once more good to wake up to your videos, thank you from Canada!

  • @inviswings
    @inviswings 3 ปีที่แล้ว

    Hello Ed, I always love your tutorial videos, and I have watched a lot of them and learned a lot from them. One little request from my side: can you put the library you are using in the title so in the future if I want to search it up and rewatch it I can find them? Cuz now I can only do that from memory of which video you have done on say for example, “Gsap” in this video. Thank you and may you have a blessed day

  • @kacperkowalski6862
    @kacperkowalski6862 2 ปีที่แล้ว

    Awesome job! I didnt know before how works animations , now its look like simple :)

  • @bocanegradev
    @bocanegradev 3 ปีที่แล้ว +3

    Very nice! You should show how it looks in responsive variations :)

  • @daboren1547
    @daboren1547 3 ปีที่แล้ว

    Love This !! really enjoy your video content !!

  • @sylvzarzycki7875
    @sylvzarzycki7875 3 ปีที่แล้ว +1

    This is why I subscribe to this channel. Quality content AND a hilarious teacher. Thanks, Ed!

  • @Unba8743
    @Unba8743 ปีที่แล้ว

    Absolutely love you tutorial,2 minute in the vid and i already want to scroll down to subscribed,much to my surprise,i already subbed,great video man

  • @aladdingatar
    @aladdingatar 3 ปีที่แล้ว

    I think you said you already did the react course, I really love your courses, more direct and clear explanation, helped me with more than 4 project, thank you for everything you present in your channel.

    • @aladdingatar
      @aladdingatar 3 ปีที่แล้ว

      I hope this massage reach u.

  • @Brandon-sr4qp
    @Brandon-sr4qp 3 ปีที่แล้ว

    Fantastic! Thanks for the introduction to gsap, sir.

  • @programmingpablo4963
    @programmingpablo4963 3 ปีที่แล้ว

    You are so underrated bro. Love your videos! Just got the "creative js course"

  • @davidoginga3983
    @davidoginga3983 2 ปีที่แล้ว

    I have watched tutorials, but none has been so fun and informative. BEST TUT EVER.

  • @KrixsLV
    @KrixsLV 3 ปีที่แล้ว

    Thanx for another great video! Learning a lot from you. Hope to see more videos !

  • @fuco5951
    @fuco5951 3 ปีที่แล้ว

    Dude this is amazing ! Thank you Dev Ed :)

  • @kiambarr5555
    @kiambarr5555 3 ปีที่แล้ว

    YAAASS!! This is what I've been waiting for!

  • @codzymajor
    @codzymajor 3 ปีที่แล้ว

    Wow, fantastic tutorial! Thank you so much!

  • @alinethani2236
    @alinethani2236 3 ปีที่แล้ว

    thanks for all the great tutorials you honestly help me out a lot

  • @matth8355
    @matth8355 3 ปีที่แล้ว

    You are now officially on eof my favorite code teachers. Good job my friend.

  • @theseriouslook
    @theseriouslook 3 ปีที่แล้ว +4

    Sir you are very cool, you are my motivation for web development,
    Very soon I'll also start my channel thanks to you.

  • @memerman9405
    @memerman9405 3 ปีที่แล้ว +2

    Discovered your Channel few days ago..
    I must say.. ur videos r addictive. ✌🏻

  • @mattoattacko
    @mattoattacko 3 ปีที่แล้ว

    Thank you for this mate. I really appreciate it. Be well 🤙

  • @ojeladeafolabi316
    @ojeladeafolabi316 3 ปีที่แล้ว

    This is an awesome tutorial, thanks Dev Ed.

  • @Autocraft123
    @Autocraft123 3 ปีที่แล้ว

    Love Your videos and your humor xD Thanks for sharing your knowledge!!! Appreciate it!

  • @viniciuscalixto6782
    @viniciuscalixto6782 3 ปีที่แล้ว

    Awesome awesome awesome!!! The animation is too cool!!! Tks buddy

  • @sonupankajtiwari
    @sonupankajtiwari 3 ปีที่แล้ว

    I love the way you teach tutorial. And these tutorials helps me a lot in hard time. If you know you know😁

  • @alexmatos2900
    @alexmatos2900 3 ปีที่แล้ว

    Awesome content, new ideas with a great workshop!

  • @ElLevidente
    @ElLevidente 3 ปีที่แล้ว +7

    Speaker: makes sound
    Ed: I'm about to end this mans whole career

  • @mister-bham
    @mister-bham 3 ปีที่แล้ว

    super awesome, thank you for sharing this
    love your videos !

  • @craiggazimbi
    @craiggazimbi 3 ปีที่แล้ว

    Your stuff is cool man, Thanks for the awesome Content!!

  • @Miscafer
    @Miscafer 3 ปีที่แล้ว

    Hey, i watch you from Colombia and is amazing your tutorials and knowledge, you've help me a lot of times in the life (lit), congratulations and ¡Muchos éxitos!

  • @louisethomas8437
    @louisethomas8437 3 ปีที่แล้ว

    Love you Ed!! Fab tutorial again!

  • @dhawalparmar7117
    @dhawalparmar7117 3 ปีที่แล้ว

    Your video is so awesome. I have learnt a lot from your resources

  • @tayyabrehman2408
    @tayyabrehman2408 3 ปีที่แล้ว

    I love your tutorials. I love your personality. Thanks for teaching us.!

  • @thebeastoffeasterpark
    @thebeastoffeasterpark 2 ปีที่แล้ว

    Awesome video, thanks for the kool info!

  • @Dijinio
    @Dijinio 3 ปีที่แล้ว +1

    I laughed so much during this great tutorial video :) Thank you!
    You should also consider doing stand up comedy...

  • @e11world
    @e11world 3 ปีที่แล้ว

    Excellent video.I'm digging how easy this is with GSAP.

  • @ghettotimoteo
    @ghettotimoteo 3 ปีที่แล้ว

    you make it easy to learn this, thank you!

  • @Merc350
    @Merc350 3 ปีที่แล้ว

    Thank you. Love your tutorials.

  • @amarjitsingh8954
    @amarjitsingh8954 3 ปีที่แล้ว

    Thank you for this quick guide and introducing me to GSAP.

  • @goesaroundcomingaround4059
    @goesaroundcomingaround4059 3 ปีที่แล้ว

    I liked how you explaining lessons
    I'm studying javascript , I loved your work

  • @mathewmurray8114
    @mathewmurray8114 3 ปีที่แล้ว

    Thanks man, really helping me get to grips with gsap. Have you got any plans for a Scrolltrigger tutorial?

  • @taylortoast2
    @taylortoast2 3 ปีที่แล้ว

    Again, great content. Thanks for filming. Hope you are well.

  • @ashutoshpotdar7411
    @ashutoshpotdar7411 2 ปีที่แล้ว

    Learning is one thing but your video really keeps me relax . Your vibes are super cool🔥🔥

  • @PedroGoncalves-gh7oy
    @PedroGoncalves-gh7oy ปีที่แล้ว

    You make learning so much fun !!

  • @AstroSirrus
    @AstroSirrus 2 ปีที่แล้ว

    Thanks for sharing this awesome tutorial!!!

  • @dereksimmons7041
    @dereksimmons7041 3 ปีที่แล้ว +1

    New sub. Great video as usual. The same effects can be done with CSS but it's easier to do it with GSAP in JS. Just my opinion.

  • @yuli1970
    @yuli1970 3 ปีที่แล้ว

    Wow, in 30 mins you just showed me how to use gsap 3 and made me definitely want to try it.

  • @DavidHernandez-jk2qw
    @DavidHernandez-jk2qw 2 ปีที่แล้ว +1

    This is so awesome!! , now I'm wondering how to make it responsive!

  • @ninjaasmoke
    @ninjaasmoke 3 ปีที่แล้ว

    I freaking LOVE your videos!
    It's like ASMR or something

  • @peterharry8328
    @peterharry8328 3 ปีที่แล้ว

    SOOOOOOOOOO Good! HELPFUL! THANK YOU DEV!

  • @giosaia
    @giosaia 3 ปีที่แล้ว

    This tutorial is awsome! Thank you so much!!!!!

  • @ASKAI200
    @ASKAI200 ปีที่แล้ว

    You're you too humble buddy, you make learning easy with your humor

  • @ozzolim
    @ozzolim 3 ปีที่แล้ว

    I really like your way(style to making everything looks like web development is tooooooo easyyyyy for you)

  • @patrickpaxton4858
    @patrickpaxton4858 3 ปีที่แล้ว +3

    Ed, not sure if you know this, but I swear you save people from depression, with you humor, absolute legend, thank you for all the content, over the years!!

    • @Seven77tw
      @Seven77tw ปีที่แล้ว

      @TurkBros. Production I'm sorry but he's not, you are

  • @diogosoares1309
    @diogosoares1309 3 ปีที่แล้ว

    You are one of my favourite teachers Ed! I hope you are doing good brother.

  • @hhhqqq3918
    @hhhqqq3918 3 ปีที่แล้ว

    I hope for the best for you. Great video brother!

  • @Werlox
    @Werlox 3 ปีที่แล้ว

    Love the new format. Only wish the camera angle was more front facing

  • @vehbikaraagac4068
    @vehbikaraagac4068 3 ปีที่แล้ว

    I love the style man

  • @martinhansen3673
    @martinhansen3673 3 ปีที่แล้ว

    I’ve seen multiple vids before (your videos - not talking about all the naughty vids 😬).
    But this time I went clicking on subscribe - you are absolutely hilarious (in a good way), which makes the purpose of the vids a breeze 👍
    Coding can be like eating a dusty book. Not here though - thanks! Keep it up

  • @carsmadness8555
    @carsmadness8555 3 ปีที่แล้ว

    Amazing Tutorials!! :)

  • @shamique
    @shamique 2 ปีที่แล้ว

    Pretty good walk-through!

  • @Salmancreationbd
    @Salmancreationbd 3 ปีที่แล้ว

    You are real Comedian Developer Teacher Ever we meeting :D
    Really Awesome Intro as well.

  • @kevinwaag9976
    @kevinwaag9976 3 ปีที่แล้ว

    This is amazing I didn't know about this library! so much easier!

  • @d-e-v-esh
    @d-e-v-esh 3 ปีที่แล้ว

    Thank you for the upcoming react course. Waiting for it...

  • @MrSnowmanAndfamily
    @MrSnowmanAndfamily 3 ปีที่แล้ว

    I absolutely love your videos. so Informative still so entertaining
    😍😍

  • @medoomar3438
    @medoomar3438 3 ปีที่แล้ว

    i enjoy watching and learning from you

  • @midnightwafflezz
    @midnightwafflezz 3 ปีที่แล้ว

    Ed ur so fun man and good at explaining, keep up the excellent work, saludos from mexico city.

  • @quytanairhouse
    @quytanairhouse 3 ปีที่แล้ว

    Wow!, this is a great video, I think it supports my project look better. Thank you so much

  • @elyasarkin0991
    @elyasarkin0991 3 ปีที่แล้ว

    Thank you so much. Very useful. 😃

  • @J90JAM
    @J90JAM 3 ปีที่แล้ว

    Do more of these! But more of how JS is commonly used on websites - buttons, on scroll etc.
    This could've been done with CSS alone.

  • @eugen2168
    @eugen2168 3 ปีที่แล้ว

    Great stuff bro ;)

  • @AlejandroGallardoRidesNstuff
    @AlejandroGallardoRidesNstuff 3 ปีที่แล้ว

    thanks dude! that was cool

  • @JP-uv5wh
    @JP-uv5wh 2 ปีที่แล้ว

    really nice video, thanks!

  • @CrazyPandaTuts
    @CrazyPandaTuts 3 ปีที่แล้ว

    nice tuts . i liked that bro. keep going

    • @jadijohnson2899
      @jadijohnson2899 3 ปีที่แล้ว

      th-cam.com/video/-ZKwMlbyr48/w-d-xo.html new html,css and javascript game project

  • @jotaulian_
    @jotaulian_ 3 ปีที่แล้ว

    This was awesome!!

  • @nyankochan2843
    @nyankochan2843 3 ปีที่แล้ว

    You’re so funny, and I really enjoy learning from you😊

  • @Isra-p1
    @Isra-p1 3 ปีที่แล้ว

    You are awesome Ed!

  • @googleuser-tr4pz
    @googleuser-tr4pz 3 ปีที่แล้ว

    Hi bro, thanks for the content, its great !!!
    Is just want to know what color theme so u use for visual studio? ?

  • @zachfenton608
    @zachfenton608 3 ปีที่แล้ว

    wonderful, worked like a gem, vielen Dank!

  • @aryankhade4376
    @aryankhade4376 3 ปีที่แล้ว

    Always wanted such gr8 content.... finally found someone who teaches gr8