YoVDO

Smooth Page Transitions with Astro & the Shared Element Transition API

Offered By: Learn With Jason via YouTube

Tags

Web Development Courses Computer Science Courses User Experience Courses Animation Courses Single-Page Applications Courses Astro Courses

Course Description

Overview

Save Big on Coursera Plus. 7,000+ courses at $160 off. Limited Time Only!
Explore how to create smooth page transitions in multi-page applications using Astro and the Shared Element Transition API in this comprehensive video tutorial. Learn from Maxi Ferreira as he demonstrates techniques to make multi-page apps feel like single-page apps. Discover the benefits of Astro, understand the Shared Element Transition API, and implement SPA-like behavior in your projects. Follow along as Maxi guides you through styling transitions with CSS, adding slide animations, and addressing common pitfalls. Gain insights into performance comparisons with traditional SPAs and find resources for further learning. Perfect for web developers looking to enhance user experience with seamless page transitions in their Astro-based projects.

Syllabus

- Welcome
- Who is Maxi Ferreira?
- What made you want to try Astro?
- Where did your interest in the shared element API start?
- Where should I stat with Shared Element Transition API?
- Creating SPA like behaviour
- Style the transition with CSS
- Adding a slide right keyframe
- Turbo gotchas
- Would these animations be faster than in a traditional SPA?
- Where can we learn more?


Taught by

Learn With Jason

Related Courses

Desarrollo de Aplicaciones Web: Nivel de Presentación
University of New Mexico via Coursera
Front End Frameworks
Google via Udacity
Front-End JavaScript Frameworks: Angular
The Hong Kong University of Science and Technology via Coursera
Front-End Web Development with React
The Hong Kong University of Science and Technology via Coursera
Desarrollo de pƔginas con Angular
Universidad Austral via Coursera