Matt Perry iz Framera i ja pogledamo knjižnicu animacija React Framer Motion.
Prvo, pogledamo kako je API jednostavan. Sve kontrolirate vrlo deklarativno kroz rekvizite na elementima u vašem JSX-u. Upravljanje animacijom na ovom sloju vrlo je intuitivno i povezano je s korisničkim sučeljem i stanjem na značajan način.
Svaki primjer koji pogledamo stvarniji je i uključuje više značajki onoga što je Framer Motion sposoban. React programerima svidjet će se sintaksa svega, a svima ostalima nevjerojatni performansi i glatki rezultati.
Završavamo s pregledom samog Framera, koji interno koristi upravo tu knjižnicu za obavljanje svih animacijskih stvari koje Framer radi. Zaintrigirao Framer? Preuzmite Framer X.
Demo 1: Osnovna sintaksa
Demo 2: Varijante
Demo 3: AnimatePresence i layoutTransition
Bonus: provjerite funkciju "pomicanje do odbacivanja" na skočnom prozoru slike.