Mind-blowing page animations are easy now... View Transitions API first look

Learn about the new View Transitions API in Astro and how it can add awesome route animations to your website.

#webdevelopment #javascript #code

[trimonmusic]

"Grid of Asses", this is why I chose Fireship for my programming education needs 👍

[wlockuz]

-Ass- as a mobile dev turned into a web dev, this makes me so happy.

[DanelonNicolas]

I love how you move this asses from one page to another

[LukeBarousse]

"That tells the API how to move your a$$ from one page to another" 🤣i'm dying lolz

[jcy]

Two lines of code for a nicer animation but be prepared to learn a new framework, re-learn how do develop JS AND spend hours debugging why all your JS interactions are broken. Yep, sums up frontend development accurately.

[ciach_]

"That explicitly tells the View Transitions API how to move your ass from one page to another" - Jeff, 2023

[georgios_georgiou]

Dang it love Jeff’s puns he deliberately made the ass page and item just to say now you can move your ass from one page to another 😂 give this man a pun Nobel already

[mitchellmnr]

You had me on my a$$ with this one.
Well played, well played!

[DryBones]

Thank you so much for this video. I linked it to someone to show off Astro's new support for this in v3 while at the same time accidentally discovering the solution to the bug of my button losing interactivity after upgrading my site to use these transitions. Super.

[combinio]

Amazing! I really enjoy the way where it is all going in terms of web-dev (classic MPA with SPA-best features).

[midas]

It's videos like this that make me proud to be a subscriber of Fireship content 🔥

[samkim]

Awesome video, learning and laughing at the same time.

[adicandra]

for the listener problem, just hook everything related to the page initialization(attaching event handler, etc) to "astro:after-swap" event, it will be called when page changed, so it's similar to "DOMContentLoaded" event in a sense.

[mfpears]

This feels like a low-code router in an unfinished SPA framework. It may be that the ideal solution is way simpler than existing SPA frameworks. So maybe just a little bit of experience with this will reveal some basic patterns that can scale. But I have a feeling it's going to be rough for a while.

[faheemrhodajackson]

Ass1 and Ass2... your assistance was greatly appreciated

[Shaheer-xsos]

Dude that stack is so uncommon, only you can come up with such a beautiful and unique thinking, hats off dude.... and I have also renamed my assests to.... ahm... anyways, nice content, keep it up BOI 😅✌

[taiwojolomi]

Fireship delivers knowledge and humor... Gets me everytime 😂💥💥

[kollpotato]

2:15 I am the one who added smooth transitions when toggling themes. I am proud of myself.

[MegaTeeruk]

Hanging out with Fireship is going on my bucket list with getting in a foot race with Tom Cruise.

[KJOB]

you making me want to rebuild my personal project that i havent even finish yet