Matt Perry fra Framer og jeg tar en titt på React animasjonsbiblioteket Framer Motion.
Først ser vi på hvor enkelt API-en er. Du kontrollerer alt veldig erklærende gjennom rekvisitter på elementer i JSX. Å kontrollere animasjon på dette laget er veldig intuitivt og koblet til brukergrensesnittet og tilstand på en meningsfull måte.
Hvert eksempel vi ser på er mer virkelige og involverer flere funksjoner av hva Framer Motion er i stand til. Reakt-utviklere vil elske syntaksen til det hele, og alle andre vil elske de utrolig performante og glatte resultatene.
Vi slutter å se på Framer selv, som bruker dette eksakte biblioteket internt til å gjøre alle animasjons tingene Framer gjør. Nysgjerrig av Framer? Last ned Framer X.
Demo 1: Grunnleggende syntaks
Demo 2: Varianter
Demo 3: AnimatePresence and layoutTransition
Bonus: sjekk ut "bla for å avvise" -funksjonaliteten i popup-bildet.