Smooth Page Transitions With Javascript Tutorial

Поділитися
Вставка
  • Опубліковано 11 січ 2025

КОМЕНТАРІ •

  • @alirezabagherpourshirazi6782
    @alirezabagherpourshirazi6782 5 років тому +666

    Dude no matter what you're describing, your personality is amazing man. I love it. keep moving

    • @theamjolnir9641
      @theamjolnir9641 5 років тому +7

      Positivity radiates from Ed and you can tell he's genuinely having fun!

    • @bluemagicuk
      @bluemagicuk 5 років тому +4

      yeah i agree - good energy from this dude, keep it rolling man

    • @thangtea18bec
      @thangtea18bec 5 років тому +3

      His personality is what more get me into this than content 😂 😂

    • @MohsenFarajYT
      @MohsenFarajYT 5 років тому

      its really pleasant to see a compatriot :) hello mate!

    • @techmasterzack-yt6521
      @techmasterzack-yt6521 4 роки тому +1

      yeah he is funny

  • @faissalabsml4393
    @faissalabsml4393 5 років тому +22

    I owe UA-cam algorithm a lot for suggesting this video, I love your personality, your content...Everything about your videos in general. I just subscribed and I'm gonna binge watch your videos after that. Thank you

    • @developedbyed
      @developedbyed  5 років тому +10

      Thank you so much my friend! Yeah for some reason youtube is really pushing my videos, so I am really happy about that!

  • @mr.developer2480
    @mr.developer2480 5 років тому +68

    You are the most likeable instructure on UA-cam. Thanks for being a real human than acting like a machine.... Awesome tuts.. Thanks

  • @wadehosking4446
    @wadehosking4446 5 років тому +104

    You had me at "Deep in the north, beyond the wall".

  • @bigfoot131
    @bigfoot131 5 років тому +2

    I can’t stress how long I’ve been looking for this page transition. And ur joyful personality makes this Chanel fun to learn and watch.

  • @tallitvak1149
    @tallitvak1149 5 років тому +35

    I LOVE YOU MAN!! !I SPENT DAYSSS FINDING A FREAKIN SIMPLE ROUTER!!! OMGGGG FINALYY I LOVE YOU!! !ILL SUPPORT YOU!! I WISH YOU THE BEST!!!!!

  • @BADDRICK95
    @BADDRICK95 5 років тому +1

    Seriously...
    Your videos teach us so much, so fast.
    It keeps me out of trouble at school and I'm also ahead of the other students.
    I also recommended you to my teacher.
    Thanks Brother

  • @dustincintron1682
    @dustincintron1682 5 років тому +4

    *EDIT* Nevermind! Had an issue in the beginning that you literally resolved as soon as I hit Play.
    Love the videos! Very helpful to a new dev like myself.
    Thanks for being awesome!

  • @diomz_artino
    @diomz_artino 5 років тому +3

    This is AMAZIIIIIING ! 2 days ago I said, my workflow right now is decent, I like this :), and the I watched this video and said WHAT !!! I'm on another level Now ! Thank you brother !

  • @freevoice8099
    @freevoice8099 5 років тому +13

    Oh man I'm so happy to find your channel it's just open my eyes to keep working on my self and learn new skills thanks man:)

  • @extremespartan117
    @extremespartan117 5 років тому +1

    Thabks for taking the time to make this! Your pace is good and you really know how to entertain.

  • @robertbalassan
    @robertbalassan 3 роки тому +1

    your vibe is just amazing! :)) not the usual tutorials for sure.

  • @renanfernandes2717
    @renanfernandes2717 3 роки тому +1

    I came for the tuts, stayed because your vibe. Thanks!

  • @baliyachtservices7505
    @baliyachtservices7505 4 роки тому +1

    Just found this channel. Awesome!
    And Dogstudio site is absolutely mind blowing

  • @chukwudaluayika8324
    @chukwudaluayika8324 3 роки тому +1

    I love you man, very helpful Tutorial. Your intros get me all the time

  • @ashisharora9694
    @ashisharora9694 5 років тому +7

    before check this tutorial i want to thanks u bcz u done so much hardwork to learnt this . thanks .

  • @sayanbanerjee1047
    @sayanbanerjee1047 5 років тому +4

    the way you initiate the video is beyond awesome! keep posting! lots of love from a female developer from india..!

  • @gurvirsingh1051
    @gurvirsingh1051 5 років тому +3

    I am happy you are growing on UA-cam keep it up your videos are very helpful !!!

  • @thisisgsrana
    @thisisgsrana 5 років тому +48

    We are loving this content. Please keep making this kind of full projects🖤🖤🖤

  • @edisvelicanin8854
    @edisvelicanin8854 5 років тому +1

    and here i thought i would just get to see tranaitions between sections inside one static html page.
    this is a great video, learned a lot.
    subscribed, nuff said.

  • @RyanReevesNompton
    @RyanReevesNompton 5 років тому +1

    You are incredible. You're the first channel I've turned on Notifications so I make sure I don't miss anything. Thank you so much for being amazing and making these tutorials for us all!

  • @justicetowett5083
    @justicetowett5083 4 роки тому +2

    Hey Ed, great stuff bro. Much appreciation from Kenya 😀

  • @josuearreola9998
    @josuearreola9998 3 роки тому +1

    This is so beautiful :( this channel deserves all subs!

  • @aybak3k
    @aybak3k 3 роки тому +1

    damn dude I love your attitude 😂 Ur really so friendly not a boring teacher at all in every intro i can't resist pausing da video (or sometimes leave it running lol) and go smash dat like thumb 👍♥️😂

  • @no2475
    @no2475 5 років тому +3

    This video is exactly what I was looking for, and it's explained very well. Thanks!

  • @rajarshimandal3235
    @rajarshimandal3235 4 роки тому +1

    Searched a lot of videos on page transitions and finally got an amazing one😊

  • @truthlee6423
    @truthlee6423 5 років тому +1

    I love the way you break down every steps by explain.

  • @Spartan_Mindset_World
    @Spartan_Mindset_World 5 років тому +264

    Use: npm init -y
    Instead of pressing enter 60 times

    • @developedbyed
      @developedbyed  5 років тому +72

      uuu great tip! Thanks!

    • @Spartan_Mindset_World
      @Spartan_Mindset_World 5 років тому +16

      @@developedbyed You're welcom. And i really like your tutorials by the way , big up ❤

    • @pengekcs
      @pengekcs 5 років тому +8

      better yet, use pnpm (same as npm but with the added benefit of much faster working + much less storage space used. pnpm / pnpmx. First install it by npm install -g pnpm then go!)

    • @zulzdn9348
      @zulzdn9348 5 років тому +2

      @@pengekcs complicated

    • @svnbit8408
      @svnbit8408 5 років тому +1

      Can this be used without a front end stack? So new to js and want to use it, but I'm not comfortable with all that stuff. Would like to eventually use on WordPress but just a static site for now would be good.barba js vs docs suck and I've seen no content on UA-cam for it. Your thoughts, pullleaze !! Thanks !

  • @aldrinbagayana7643
    @aldrinbagayana7643 5 років тому +8

    Hi there! Thanks for this amazing practical tutorial bro! Your enthusiasm made it sound like everything is easy with the way you explain almost every line of code and giving the reasons why you're writing them and the effect they give to the pages. Makes them easier to remember. Now I'm a lot more inspired to pursue this. Keep it up!

  • @Jakhongir84
    @Jakhongir84 5 років тому +19

    Man, where have you been? I love your content and all tutorials. Nice work. Subscribing...

  • @ademuysal3572
    @ademuysal3572 5 років тому

    Doesn't matter html javascript or anything. Your good energy enough for us

  • @nickmaxwellambient6615
    @nickmaxwellambient6615 5 років тому +1

    Hey man, this channel is fantastic. I'm learning a lot and you give off a really good vibe.

  • @dpffpself
    @dpffpself 5 років тому

    i've searched for this about 2years ago and couldn't got any answer but now you show the way... thank you 😭😭😭😭😭👍👍👍 i'm so mucg beginner that i'm not familiar with using Terminal&node js ..however i'm gonna try this!! Thank you!!!♥♥

  • @shreyapai5615
    @shreyapai5615 4 роки тому +2

    Heyyy the way you teach is so amazing. Love your videos! Thaankss a ton for the great content :D

  • @yodkwtf
    @yodkwtf 3 роки тому +1

    Great tutorial. There were few things here and there that I had to google (like depreciated gsap methods) but it worked out great. Thanks Ed!

  • @TrictoYT
    @TrictoYT 4 роки тому

    For some reason I love the way you teach

  • @MrSnowmobilefreak
    @MrSnowmobilefreak 5 років тому +1

    thanks for making this video, you did a great job balancing web designer thoughts real time with HTML,CSS as well as the main topic of the video. learned a ton from it. great personality. subscribed please make more!

  • @adityashirodkar4568
    @adityashirodkar4568 4 роки тому

    U bro.. I don't have words to describe you.. you just make me smile everytime u start the video..

  • @trantienducanh3944
    @trantienducanh3944 5 років тому +2

    You're the best Front End Dev Ever

  • @kohinoorcreations4931
    @kohinoorcreations4931 4 роки тому

    you are so lively , please keep posting such awesome tutorial

  • @eliciareynolds9027
    @eliciareynolds9027 3 роки тому

    after downloading Node.js, I was having a hard time having the terminal recognize the node program. Then, I looked at how DevEd wrote the name "node -v" and you need the space before you type the hyphen! "node-v" will not register correctly in the terminal. You must type "node -v". Thank you again DevEd! Love your informational videos, your bright personality, and your "gorgeous" intro! lol!

  • @ΚλαϊντιΑ
    @ΚλαϊντιΑ 5 років тому +3

    You deserve waay more subscribers man

    • @developedbyed
      @developedbyed  5 років тому +1

      This comment makes me feel happy! Thanks so much

    • @life_is_music7686
      @life_is_music7686 4 роки тому

      @@developedbyed whenever i make changes in the sass file, it doent show up what do i do plss tell

    • @life_is_music7686
      @life_is_music7686 4 роки тому

      @@developedbyed i beg u
      T_T

  • @leonardocoronel8108
    @leonardocoronel8108 5 років тому +1

    Man the way you make content is awesome, greetings from Argentina

  • @debotos
    @debotos 5 років тому +1

    This is called a real informative tutorial. Thanks, man!

  • @akshithhiremath1714
    @akshithhiremath1714 5 років тому +2

    You really enjoy what you do, and you show it in your videos :) Subscribed

  • @andresteacher8325
    @andresteacher8325 4 роки тому

    5 seconds after the video, omg I dont mind I have to listen for a while to learn , what a cool guy you are, greetings from colombia

  • @santiagomamani6111
    @santiagomamani6111 5 років тому +3

    I think i'm in love with this man. Amazing channel, loving all videos. 😀

  • @joaoferreira_yt
    @joaoferreira_yt 5 років тому

    I've just met you (that's my first video) and you got a new subscriber! Wonderful job. Keep going!

    • @eperou6299
      @eperou6299 5 років тому +1

      Same, i thought if he makes vids like this he would have 100k plus, but no m8

  • @matthenley6704
    @matthenley6704 5 років тому +1

    Thank you for these awesome videos! I love the personality, enjoyment, and knowledge you bring!

  • @Dnipro1_pole_mriy
    @Dnipro1_pole_mriy 5 років тому +12

    It's unbelievable!!! Thx for content

  • @ZiIIous
    @ZiIIous 5 років тому +3

    I like your positive attitude(is that what it's called?). The brightness of your aura empowered me. You made me feel like a loser.
    Before improving my knowledge, I have to improve as a person to get accepted, I guess...
    force a smile...force a smile....I can do it

  • @jkjk354
    @jkjk354 5 років тому

    This channel is priceless. you sir, are a great teacher.

  • @PS-le4mf
    @PS-le4mf 5 років тому

    Thank you for the content! I swear - if you did a limited class size of a 2x a week or so live coding seminar where we can do Q&A with the live comments and have some individual time like 10mins a week consulting to individually gear us towards our personal coding goals I'd sign up. I did this with a ForEx (foregin exchange) and Technical Analysis Stock trading class & it was one of the best experiences. I felt like I engaged with a community of like minded people and learned better because it was a great environment for newbies.

  • @Dawntech
    @Dawntech 5 років тому +2

    Great content, man! Keep up with the good work you've been making. Cheers from Brazil 🙂

  • @royhanreza1807
    @royhanreza1807 5 років тому +4

    this is what I've been looking for, thanks

  • @brunocarvalho287
    @brunocarvalho287 5 років тому +6

    Incredible!!! Thanks for share this great tutorial

  • @zainqureshi7596
    @zainqureshi7596 4 роки тому

    Dev Ed This is all your enthusiasm that shows how extremely you work hard for us😍

  • @south._g
    @south._g 4 роки тому +2

    I'm going to learn so much from this channel. Thank you 😊🙏🏼

  • @diegognoatto590
    @diegognoatto590 4 роки тому

    its been one year u released the last video on page transitions bro, so i came here to give you the holly grail of non existent content on the entire web to create an awesome tutorial that i know u can :) imagine barba js page transitions with lottie animations been controled by GSAP ;)

  • @webdesigner5770
    @webdesigner5770 5 років тому

    thank you so much for such an amazing sooth page transitions plz keep up the good work.

  • @latikawagh926
    @latikawagh926 4 роки тому

    i dont regret subscribing your channel...your have a good n happy vibe...keep going...we are here to support you😊...n bdw i wanted to do that pagination too...but didnt work out well🤣

  • @resalith
    @resalith 4 роки тому

    Awesome tutorial! Doesn't help much my crisis on wanting to go for full front-end development - it's so much fun >.

  • @anuragchaurasia263
    @anuragchaurasia263 4 роки тому

    Dude you are just an amazing instructor 👩‍🏫

  • @Zl.3087
    @Zl.3087 4 роки тому

    This video helped me a loooottt!! Thank you so much. Your videos are amazing 🤩

  • @CodeGround
    @CodeGround 4 роки тому

    this is awesome man. i love your design

  • @cintron3d
    @cintron3d 5 років тому

    High level explanation of what I gathered from literally skimming through the video for about 10 seconds.
    Put pages in containers, give pages an enter animation that calls a function when that animation is done. Create a router to load new pages in above the current page and listens for done callback. When the callback is received the router can drop the old page.
    Looks like you're using a framework called highway to do this but I think that's the basic concept.

  • @rpaju0451
    @rpaju0451 3 роки тому

    You made my day men I learned too many things today ❤❤

  • @wisdombright9821
    @wisdombright9821 5 років тому

    Your just funny and exciting in your own way. I love you're personality and that's why I subscribed to your channel.

  • @jephreyg-power310
    @jephreyg-power310 5 років тому

    wow.......... i strongly wish u know u're the BEST of its kind in web sturfs.... more GRACE

  • @diegorocha2186
    @diegorocha2186 5 років тому

    Greetings from Brazil!!! Your're amazing! Keep up the good work!

  • @raphaelsack6983
    @raphaelsack6983 5 років тому

    Guys, dont just look the Video, Subscribe to him, he deserves it

  • @span8898
    @span8898 5 років тому

    Thank you very much for your tutorial. A lot of fun to follow you !!

  • @chrismarcos116
    @chrismarcos116 5 років тому

    please keep making videos.... i am learning so much from them

  • @oliviadart612
    @oliviadart612 4 роки тому +3

    Your work here is amazing :’) so positive, pretty and bright

  • @gabrielamoncayozerga2214
    @gabrielamoncayozerga2214 5 років тому +2

    Love this tutorials so much 😍

  • @aykhanrh
    @aykhanrh 5 років тому +2

    omg. its sooooo beautifull man

  • @michaelk.jensen1611
    @michaelk.jensen1611 4 роки тому

    One more thing i like about your videos is the intro! when i see it, i think great another intro section, get ready to press right arrow arrow arrow arrow.. .. , .. oh its finished!

  • @bonniechang1377
    @bonniechang1377 5 років тому

    感謝Dev Ed 太厲害了!讓我更進一步。

  • @aswinganji7870
    @aswinganji7870 4 роки тому

    Thank you so much it helped me a super lot in my portfolio

  • @epiphanmushahwar6671
    @epiphanmushahwar6671 5 років тому +1

    that intro was the smoothest thing 👌👌

  • @kakarnyori5457
    @kakarnyori5457 4 роки тому

    We are proud of you!

  • @gboladepopoola4464
    @gboladepopoola4464 4 роки тому +2

    I absolutely love your sense of humor. Data router wrapper🌚. I find your videos very informative and fun. Gracias. Question...Can I do this in react?

  • @aswinganji7870
    @aswinganji7870 4 роки тому

    in the terminal i got n error even if i downloaded node.js
    but after sometime and really concentrating on your video,
    i found out that i nee to out a space after node and a dash and v then it worked .
    Thank you very much it helped me in my portfolio

  • @prerakhere
    @prerakhere 5 років тому

    Glad i found this channel! I will make my mom proud lol

  • @chrisdanikas7918
    @chrisdanikas7918 5 років тому

    awesome dude keep up the good tutorials!

    • @developedbyed
      @developedbyed  5 років тому

      I have so many good ones planned up!

  • @kjyhh
    @kjyhh 3 роки тому

    Love the setup brief.👍

  • @irfanbhuiyan620
    @irfanbhuiyan620 4 роки тому +11

    "we're almost at 5 thousand subscribers" wtf man 2019 may be a year and half back but goddamn what a growth from 5k to 455k (as of oct 2020)

  • @tomcatbuzz
    @tomcatbuzz 5 років тому +2

    Great Video, I am falling behind. Also for anyone that has an error saying TimelineLight is not a constructor :) make sure you spell it correctly "TimelineLite" not TimelineLight. Took me a few minutes to figure out what I did wrong.

  • @gigaspy5178
    @gigaspy5178 4 роки тому

    Love You both. (You and Your Content). Consider Complete React Course

  • @dimitrisKarakwttas
    @dimitrisKarakwttas 5 років тому

    Keep up the great work! you are awesome :)

  • @matfen7978
    @matfen7978 5 років тому

    Your channel is very informative and you make me very happy 🍕

  • @vinaykotturi1283
    @vinaykotturi1283 5 років тому

    Hi! Dev Ed this is awesome animation Your way of explanation was so clear.

  • @aresfrt
    @aresfrt 4 роки тому

    Absolute, you make great this job

  • @ViniciusPrado
    @ViniciusPrado 5 років тому

    Awesome effect!!! Congrats.

  • @yogenp
    @yogenp 5 років тому

    Nice content. Subscribed to your channel earlier. Love the new set up.

  • @mark33sv
    @mark33sv 3 роки тому

    this is a real complet program fron 0. tks a lot @DevEd

  • @naumanali6580
    @naumanali6580 5 років тому

    do post such type of amazing tutorials ;) and if possible post node js tutorials . PS : i would like to thank UA-cam for showing your video in recommended videos :D

  • @ilan117
    @ilan117 5 років тому

    dude you are awesome. thanks for the tutorials 👍

  • @itsshopboy
    @itsshopboy 5 років тому

    Thanks so much Ed. I love this

  • @SkuezTech
    @SkuezTech 4 роки тому +1

    33:24 WOW almost at 5 thousand subscribers 😮😮