Page transitions in the Next.js App Router (View Transition + Motion)
We can finally setup page transitions in the Next.js App Router using the View Transition API and Motion! In this video we'll walkthrough an example to set this up.
💾 Source code: https://github.com/Built-With-Code/ne...
⏭️ Watch This Next: • Scrolling Table of Contents with Framer Mo...
Next.js transition issue thread: https://github.com/vercel/next.js/iss...
Animation inspiration: https://alextkachev.com
📱 Follow online: / built_with_code
Have a question about anything in this video? Drop it in the comments!
⏰ Timecodes ⏰
0:00 - Intro
0:49 - Demo + Starter code
1:09 - ViewTransition API
6:48 - Adding Motion animations
8:19 - Outro
-------------------------------
Welcome to Built With Code, a channel focused on intermediate/advanced frontend web development topics. Some of my favorite tools are Next.js, TailwindCSS, and Framer Motion. If you find value from the videos, a like and/or subscribe is much appreciated!