nextjs page transitions

Transitions de page TravelApp

Fourchette

, bonjour! Ce référentiel est une réécriture avec React & Next.js du travail original de Sarah Drasner avec Vue & Nuxt.

Démo en direct: https://page-transition.now.sh

Original

Cette démo montre un exemple de la façon d'atteindre des transitions de page natives sur le Web. Il y a beaucoup à améliorer ici - ce n'est pas censé être une application Web à part entière, juste une démo rapide pour montrer comment ce type d'implémentation pourrait théoriquement fonctionner. Ces concepts peuvent et doivent être exprimés différemment dans votre propre application, le ciel est la limite ici! Ceci est créé avec Nuxt et Vue.

Article expliquant que la démo est disponible sur https://css-tricks.com/native-like-animations-for-page-transitions-on-the-web

Demo en direct sur https://page-transition.com/

Voir la démo de l'application de voyage de transitions de page pour un cas d'utilisation réel: https://github.com/sdras/page-transitions-travelapp

Configuration de la construction

 # install dependencies
$ npm install # Or yarn install

# serve with hot reload at localhost:3000
$ npm run dev

# build for production and launch server
$ npm run build
$ npm start

Pour des explications détaillées sur le fonctionnement des choses, consultez les documents suivants.