Войти
  • 71Просмотров
  • 3 дня назадОпубликованоAverage

Page Transitions & Hydration Fixes | Full-Stack Web Dev #15

This is Episode #15 of my Nuxt Web Development series! In this episode, we implement page and element transitions. This allows us to give some visual flair to our site. We also look into resolving some of the existing hydration issues from previous episodes to reduce rendering problems. We do so by using the ClientOnly tag in conjunction with other small fixes. Subscribe to follow along with the rest of the series as we keep refining and expanding the full-stack Nuxt app. 00:00 - Introduction 00:40 - Enabling Global Page Transitions 01:13 - Fixing Root Node Errors 01:47 - Styling the Page Transition 02:53 - Custom Per-Page Transitions 04:52 - Animating the Navigation Bar 06:28 - Styling Navigation Transitions 08:31 - Fixing Transition Group Keys 09:15 - Resolving Hydration Mismatches 10:10 - Fixing useAsyncData Return Values 10:46 - Adding Autocomplete Attributes 12:00 - Conclusion