Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

enter/exit page animations in Next.js

asidorenko_'s profile picture

Alex Sidorenko

33,503 subscribers

61,100 görüntüleme • 1 yıl önce •via X (Twitter)

SanatBilim & TeknolojiEğitim
LIVE

Anya Rossi• Live Now

Private livecam show

11 Yorum

Nithur profil fotoğrafı
Nithur1 yıl önce

cool one! no need for 'use client' directive?

Alex Sidorenko profil fotoğrafı
Alex Sidorenko1 yıl önce

Nope, no client-side JS is involved

Sakshham Bhagat profil fotoğrafı
Sakshham Bhagat1 yıl önce

have to try this. thanks for posting

Andre Barbosa profil fotoğrafı
Andre Barbosa1 yıl önce

All version ?

Alex Sidorenko profil fotoğrafı
Alex Sidorenko1 yıl önce

15.2+

Iramazan profil fotoğrafı
Iramazan1 yıl önce

thanks for sharing

Trading Developer profil fotoğrafı
Trading Developer1 yıl önce

Nice work!

Serhii Bedrytskyi profil fotoğrafı
Serhii Bedrytskyi1 yıl önce

Where you edit videos, Alex? Could you recommend something simple?

Alex Sidorenko profil fotoğrafı
Alex Sidorenko1 yıl önce

Screen Studio

Israel 🤖 profil fotoğrafı
Israel 🤖1 yıl önce

This but on a background color for theme switching?

Alex Sidorenko profil fotoğrafı
Alex Sidorenko1 yıl önce

Whatever you want. You have complete control of the old and new screens in css.

Benzer Videolar

New Compready website Stack: Next.js + @Figma Animations: Jitter + AE ~1 month design + dev 257% increase in conversions
0:33

New Compready website Stack: Next.js + @Figma Animations: Jitter + AE ~1 month design + dev 257% increase in conversions

Ivan Boroja

21,403 görüntüleme • 6 ay önce

Setting a cookie in server action automatically re-renders the current page and its layouts in Next.js
0:20

Setting a cookie in server action automatically re-renders the current page and its layouts in Next.js

Alex Sidorenko

107,205 görüntüleme • 8 ay önce

Metallica in Maroon & Orange! Exit Light, Enter Night ⚡️
0:30

Metallica in Maroon & Orange! Exit Light, Enter Night ⚡️

Brent Pry

82,876 görüntüleme • 1 yıl önce

I can't stop seeing #CSS View Transitions! here I'm animating new `node.textContent`, letting the browser handle the morph while bringing in custom animations (and stagger) for stage enter and stage exit 🥲 try it
0:51

I can't stop seeing #CSS View Transitions! here I'm animating new `node.textContent`, letting the browser handle the morph while bringing in custom animations (and stagger) for stage enter and stage exit 🥲 try it

Adam Argyle

469,407 görüntüleme • 2 yıl önce

How to use Next.js metadata if the page is a client component
0:33

How to use Next.js metadata if the page is a client component

Alex Sidorenko

91,579 görüntüleme • 1 yıl önce

Exit Drew Enter player/coach #WWERaw
1:38

Exit Drew Enter player/coach #WWERaw

WWE

917,328 görüntüleme • 2 yıl önce

Next.js preserves client state on the page during navigation when cacheComponents is enabled
0:20

Next.js preserves client state on the page during navigation when cacheComponents is enabled

Alex Sidorenko

161,065 görüntüleme • 7 ay önce

EXIT LIGHT, ENTER NIGHT ⚡️ #ThisIsHome | #M72VirginiaTech
1:55

EXIT LIGHT, ENTER NIGHT ⚡️ #ThisIsHome | #M72VirginiaTech

Virginia Tech Football

501,888 görüntüleme • 1 yıl önce

Exit Susan Nakhumicha. Enter Deborah Barasa.
0:59

Exit Susan Nakhumicha. Enter Deborah Barasa.

Caxstone P. Kigata

82,606 görüntüleme • 1 yıl önce

In London, they don't want to pay for transport, so they enter and exit through the disabled exit. A society like this is doomed to collapse.
0:23

In London, they don't want to pay for transport, so they enter and exit through the disabled exit. A society like this is doomed to collapse.

RadioGenoa

160,378 görüntüleme • 1 ay önce

Introducing A tool for creating animations of your code, in HD. With support for React, Vue, Astro, Python & many more. Built with Remotion, Next.js, shadcn, PlanetScale, & more.
0:53

Introducing A tool for creating animations of your code, in HD. With support for React, Vue, Astro, Python & many more. Built with Remotion, Next.js, shadcn, PlanetScale, & more.

David Parks

105,727 görüntüleme • 2 yıl önce

In Next.js (with cacheComponents), awaiting runtime data (like "params") defines the static/dynamic boundary of your page Move awaits closer to where they're needed
0:22

In Next.js (with cacheComponents), awaiting runtime data (like "params") defines the static/dynamic boundary of your page Move awaits closer to where they're needed

Alex Sidorenko

20,789 görüntüleme • 7 ay önce

Next.js Conf returns Oct 22 Live in SF. Streaming worldwide. Next.js 16. Workshops. Community. Lock in →
0:25

Next.js Conf returns Oct 22 Live in SF. Streaming worldwide. Next.js 16. Workshops. Community. Lock in →

Next.js

155,052 görüntüleme • 9 ay önce

cacheComponents in Next.js (canary)
0:42

cacheComponents in Next.js (canary)

Alex Sidorenko

38,423 görüntüleme • 8 ay önce

Introducing Auto Layout in Anime.js v4.3! - Animate display flex / grid / none, etc. - Enter / Leave animations - Animate DOM position changes - Interruptible animations - Staggered children animations - Supports any easing functions - Dead simple API Link below ⬇︎
0:36

Introducing Auto Layout in Anime.js v4.3! - Animate display flex / grid / none, etc. - Enter / Leave animations - Animate DOM position changes - Interruptible animations - Staggered children animations - Supports any easing functions - Dead simple API Link below ⬇︎

Julian Garnier

295,144 görüntüleme • 4 ay önce

New open-source dev tools marketing template dropped: - build with shadcn - content in MDX - static Next.js export (byo router) - boring elements (no fancy animations) - theme-aware images - ascii code snippets
0:47

New open-source dev tools marketing template dropped: - build with shadcn - content in MDX - static Next.js export (byo router) - boring elements (no fancy animations) - theme-aware images - ascii code snippets

Maximilian Kaske 🏓

24,620 görüntüleme • 6 ay önce

Modal in Next.js 13
1:19

Modal in Next.js 13

Alex Sidorenko

111,837 görüntüleme • 2 yıl önce

devtoolSegmentExplorer in Next.js 15.4
0:26

devtoolSegmentExplorer in Next.js 15.4

Alex Sidorenko

26,562 görüntüleme • 11 ay önce