Matt Perry de Framer y yo echamos un vistazo a la biblioteca de animación de React Framer Motion.
Primero, echamos un vistazo a lo simple que es la API. Controlas todo de manera muy declarativa a través de accesorios en elementos en tu JSX. Controlar la animación en esta capa es muy intuitivo y está conectado a la interfaz de usuario y al estado de una manera significativa.
Cada ejemplo que miramos es más del mundo real e involucra más características de lo que Framer Motion es capaz de hacer. A los desarrolladores de React les encantará la sintaxis de todo, y a todos los demás les encantarán los resultados increíblemente eficaces y fluidos.
Terminamos mirando al propio Framer, que usa esta biblioteca exacta internamente para hacer todas las cosas de animación que hace Framer. ¿Intrigado por Framer? Descarga Framer X.
Demostración 1: sintaxis básica
Demo 2: Variantes
Demostración 3: AnimatePresence y layoutTransition
Bonificación: compruebe la función "desplazarse para descartar" en la ventana emergente de la imagen.
