nextjs page transitions

Transisi Halaman TravelApp

Garpu

, Halo! Repositori ini adalah penulisan ulang dengan React & Next.js dari karya Orginal Sarah Drasner dengan Vue & Nuxt.

Demo Langsung: https://page-transitions.now.sh

Asli

Demo ini menunjukkan contoh bagaimana mencapai transisi halaman seperti asli di web. Ada banyak yang harus ditingkatkan di sini- itu tidak dimaksudkan untuk menjadi aplikasi web penuh, hanya demo cepat untuk menunjukkan bagaimana implementasi semacam ini dapat bekerja secara teoritis. Konsep -konsep ini dapat dan harus diekspresikan secara berbeda dalam aplikasi Anda sendiri, langit adalah batasnya di sini! Ini dibuat dengan Nuxt dan Vue.

Artikel yang menjelaskan demo tersedia di https://css-tricks.com/native-like-animations-for-page-transitions-t-the-the-web

Demo langsung di https://page-transitions.com/

Lihat Demo Aplikasi Perjalanan Transisi Halaman untuk Kasus Penggunaan Kehidupan Nyata: https://github.com/sdras/page-transitions-travelapp

Bangun Pengaturan

 # 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

Untuk penjelasan terperinci tentang cara kerja, checkout docs.js next.js.