# 176: Lucrul cu Framer Motion - CSS-Tricks

Anonim

Matt Perry de la Framer și eu aruncăm o privire la biblioteca de animație React Framer Motion.

În primul rând, aruncăm o privire la cât de simplă este API-ul. Controlați totul foarte declarativ prin elemente de recuzită pe elementele din JSX. Controlul animației la acest strat este foarte intuitiv și este conectat la interfață și la stare într-un mod semnificativ.

Fiecare exemplu pe care îl privim este mai real și implică mai multe caracteristici din ceea ce este capabil Framer Motion. Dezvoltatorii React vor adora sintaxa tuturor și tuturor celorlalți le vor plăcea rezultatele incredibil de performante și netede.

Încetăm să ne uităm la Framer în sine, care folosește această bibliotecă exactă intern pentru a face toate lucrurile de animație pe care le face Framer. Intrigat de Framer? Descărcați Framer X.

Demo 1: Sintaxă de bază

Demo 2: Variante

Demo 3: AnimatePresence și layoutTransition

Bonus: verificați funcționalitatea „derulați pentru a renunța” la fereastra popup.