Animated Login Form in React Native (#2 Animations)

Learn how to animate Login Forms in React Native using Reanimated 2.
This is part 2 out of a 2 episode series where we will learn how to animate elements from authentication screens in React Native. Today we will focus on the animations part, but if you want to see how we created the UI, check out our previous episode:
• Animated Login Form in...
🎒 Download the Asset Bundle (Source code, images, dummy data, slides):
assets.notjust.dev/animated-auth
📚 Join the waitlist for "The Full-stack Mobile Developer" to be notified when we release it again
academy.notjust.dev/
💬 Join the notJust Development gang and let's build together
/ discord
Tag me on social media when you finish this build, and I will give you feedback on your project.
➤ / vadimnotjustdev
➤ / vadimnotjustdev
➤ / vadimsavin
➤ / vadimnotjustdev
Timecodes:
Disclaimer: This build is for educational purposes only!! All views, opinions, technology choices expressed in this video are my own and do not represent the views, opinions, technology choices of any entity whatsoever with which I have been, am now, or will be affiliated.
#VadimSavin #notjustdev #reactnative

[@felipemelendez5741]

super well explained, this is awesome, thanks!

[@anum2471]

Thanks for the effort Lukas & Vadim! Lukas nailed the perfection level.

[@lukasgrinevicius5868]

Thaank You! 🤗

[@dannipals79]

React Native for the win. Thanks for the tutorial

[@And1997Ruz]

This was a great tutorial. Thank you, sir!

[@laachariabdelhaq4435]

Thanks for the effort Luckas

[@VenkateshN6819]

Thank you for the content. I learnt new things today

[@lukasgrinevicius5868]

Glad to hear!! 🤩

[@Muzly]

Just the video I've been waiting for.

[@lukasgrinevicius5868]

Glad to hear!! 🚀

[@zanfet]

Amazing video! Keep it up!!

[@drachensunde4552]

I was wondering if there is any way to fix the keyboard problem? When you click on the text input the keyboard covers it and you can't see what you are writing.

[@islamicvoicesandhistory138]

Please did you find solution? You obviously did. Can you please share please

[@yaseenrajpoot2366]

Vadim and co you guys are gem❤️

[@lukasgrinevicius5868]

We are trying our best! 😊

[@Shaaaah]

Nice content. Keep growing 🔥

[@lukasgrinevicius5868]

Thank You!! 🚀

[@spoorthiguptha5830]

Thanks for this amazing video wrt UI!! Could you please help in solving the keyboard issue in here. Tried the Keyboardawrescrollview but it wont help. Please suggest/guide. Thanks in advance.

[@fofort55]

Hi, when I run the demo app or my own app that uses your code, there is a delay of roughly a second between the splash disappearing and the background image appearing. Is there a way to fix that?

[@nav.r]

Loved your Video, but the only problem is the Keyboard on the Device. it covers the Form.

[@JKholmatov]

When will you start "The Full-stack Mobile Developer" course?

[@islamicvoicesandhistory138]

1)text inputs are editable from intro screen 2) fields become insignificant by overlapping with background img Anyone solved these? 😢

[@threefincreators2409]

please make a video on flat list

[@umairnaeem5820]

when I add "Animated.View" in the place of "View", then it shows an error, I am using an android simulator. Please help.

[@memostartup281]

Sir please make tutorial on how to install and setup react native video and media control package in react native version 0.69

[@ggnstaff6948]

Its awesome! thanks for that! but when i click in password textinput, all the bottom screen filled with keyboard and can't see the textinput. any solution for that?

[@sahasdangol9864]

we can use useAnimatedKeyboard to handle this issue.

[@abhijithca2500]

when i press the input field the key board pop ups and the bottom containers are going up under the image

[@ggnstaff6948]

same issue and i tried for keyboardavoidingview but still no solution

[@islamicvoicesandhistory138]

Did you find solution? Please share

[@yj9025]

zIndex is not working in my android emulator. I have tried elevation aswell and it doesn't work either , the formInputContainer is still on top.

[@abhijithca2500]

same for me also please help

[@CodeCraftersHubOff]

You Should Need to Change the View To "Animated.View" Initially am facing the same issue

[@umairnaeem5820]

@@CodeCraftersHubOff when I add "Animated.View" in the place of "View", then it shows an error, I am using an android simulator. Please help.

[@tayyabshakoor204]

react-native-reanimated not working properly in react native...please help me if anyone has done it...... Let me know so i can fix it in my Project

[@nats7367]

This is the same video tutorial made by UnsureProgrammer 3yrs ago

[@laxbrogabs22]

spent a lot of time on this and it doesn't work. Even tried copying his code from his bundle and that didn't work either. Don't waste 2 hours of your life like me

[@zanfet]

Dude this tutorial was so much fun! I made a super cool animation! Can I tag you on twitter when I publish it?

[@notjustdev]

So happy for you! Sure, tag us when you share it