React Native Moti - the universal animation package for React Native with @FernandoTheRojo

over 4 years ago•February 8, 2021
1:48:49
22,332 views
539 likes
C

Catalin Miron

Channel

Interviewed Person

Fernando Rojo

Description

Fernando Rojo (@FernandoTheRojo) just release a new animation library for React Native called Moti, powered by Reanimated 2. I've invited him to walk us through what's possible to animate and how easy it is to install and run it. React Native Moti highlights: - Universal: works on all platforms - 60 FPS animations run on the native thread - Mount/unmount animations, like Framer Motion - Powered by Reanimated 2 - Web support, out-of-the-box - Expo support - Intuitive API - Variant & keyframe animations - Strong TypeScript support - Highly-configurable animations - Sequence animations - Loop & repeat animations Links: - https://github.com/nandorojo/moti - https://twitter.com/FernandoTheRojo --- šŸ‘‰šŸ‘‰ Live stream powered by StreamYard (Affiliate link) https://streamyard.com?pal=4853295697100800 šŸ‘† Use the link and you'll be granted with $10 credit. ---- šŸ‘‰šŸ‘‰ Have any questions? Join Discord: https://discord.gg/vg7hUDU. Want to support me? - Patreon: https://patreon.com/catalinmiron - BuyMeACoffee: https://www.buymeacoffee.com/catalinmiron - Paypal: https://paypal.me/catalinmiron ---- You can find me on: - Github: http://github.com/catalinmiron - Twitter: http://twitter.com/mironcatalin - Website: http://batman.codes ---

Transcript

Group by:

cool guys so welcome to uh to my channel uh this one is going to be a different video although um i have here a beautiful guest with a blue greenish eyes it's yeah his name is fernando and he recently built a really nice animation library called moti which is based on reanimated 2 library uh that's running 60 fps no matter what everything it sits on the native thread uh ui thread so

you don't have to worry about dropping uh or having like really sluggish animations uh so yeah i'm here we will we will go through this library because i find it really interesting and and i'll definitely be using it on on my future tutorials and yeah let's let's see uh fernando welcome welcome to the show it's thanks for having me it's been a while since yeah i've actually

uh did any live coding or live streaming uh thank you so much for accepting the invitation and i'll start by let's let's give the audience just a little bit of history of i don't know just introduce yourself sure uh yeah i went to penn university of pennsylvania graduated a few years ago i live in new york now i've been working on a few different startups um for the past few years started doing a shoe company then i went through y combinator with a friend of mine from school and we tried to launch a social network

and we've just built a ton of products in the last few years using a wide range of stacks but all of it is focused around react native in some sense so that's how i ended up getting here to working on modi cool that's that's really great i i also saw that you're doing a couple of uh maybe like can you can you give him like more details about the project uh from uh for reac native uh like the styling

project yes based on team ui or something like that yeah so the first project i think that got a good amount of traction for react native that i built is called dripsy um dripsy is a theme-based styling library for react native and it basically tries to achieve two main things uh creating a really easy theme that you can use throughout your app and responsive design meaning that in

your react native app you just specify what screen size you're going to be on right so if someone's using a small mobile phone versus a desktop all you do is specify how you want your styles to look based on screen size uh and so that's that's dripsy i think it's like something like 400 stars on github which is probably my top one right now uh it's pretty exciting and i've been using that in production for a long time now and the idea came about after i used themeui for react web i think a lot of the ideas uh that i've had so far have mostly just been porting

things that have worked for years on web or on react and bring them to react native and then bring them back from react native into react native web and that's kind of the same story for modi yeah that's really great actually i i first saw drips the i think two months ago um i had like some work for for side project and i wanted to actually integrate some theme ui components but i end up doing

like different different stuff here oh one sec okay uh so actually my my camera went off uh because i'm recording in 4k even though this stream it's in uh 720 but so yeah i'll start sharing my screen here okay my my webcam will be back uh really soon we're infinite yeah this is the inception mode so i'll go here and why you fernando don't start

217 segments (grouped from 986 original)17573 words~88 min readGrouped by 30s intervals

Video Details

Duration
1:48:49
Published
February 8, 2021
Channel
Catalin Miron
Language
ENGLISH
Views
22,332
Likes
539