Page Transitions In React (Part 2) - React Router V6 and Framer Motion Tutorial
Page Transitions In React (Part 2) - React Router V6 and Framer Motion Tutorial
#43 #react #framer_motion #reactrouter #tutorial
In the previous episode, we built a responsive navigation bar with beautiful animations just using CSS. Today we continue with the page transition with smooth animation. So the tool we use today is React router dom and framer motion.
⌚️Timestamps:
00:00 Demo
00:31 Intro
01:55 React Router Setup
19:53 Making page transition with Framer Motion
26:47 Complete the code
31:24 Outro
🍿The last video: Animated Responsive Navbar (Part 1) - React & CSS Animation Tutorial for Beginners
• Animated Responsive Navbar (Part 1) - Reac...
My finished project (GitHub): https://github.com/thekietvuong/The-R...
Stack Overflow: Animate presence exit not working in framer motion
https://stackoverflow.com/questions/6...
The red fox information website:
https://www.nwf.org/educational-resou...
The framer motion website: https://www.framer.com/motion/
Install React Router Dom: npm install react-router-dom@6
Install SCSS: npm install node-sass
Install Framer Motion: npm install framer-motion
Check out my Etsy shop:
https://www.etsy.com/shop/DesignByKiet
🎵Track: Good Days - Yung Logos
Youtube Library Audio