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

[@anum2471]

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

[@lukasgrinevicius5868]

Thaank You! 🤗

[@felipemelendez5741]

super well explained, this is awesome, thanks!

[@Muzly]

Just the video I've been waiting for.

[@lukasgrinevicius5868]

Glad to hear!! 🚀

[@dannipals79]

React Native for the win. Thanks for the tutorial

[@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

[@And1997Ruz]

This was a great tutorial. Thank you, sir!

[@VenkateshN6819]

Thank you for the content. I learnt new things today

[@lukasgrinevicius5868]

Glad to hear!! 🤩

[@yaseenrajpoot2366]

Vadim and co you guys are gem❤️

[@lukasgrinevicius5868]

We are trying our best! 😊

[@laachariabdelhaq4435]

Thanks for the effort Luckas

[@zanfet]

Amazing video! Keep it up!!

[@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?

[@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.

[@JKholmatov]

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

[@umairnaeem5820]

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

[@nav.r]

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

[@threefincreators2409]

please make a video on flat list

[@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.

[@memostartup281]

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

[@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

[@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

[@islamicvoicesandhistory138]

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

[@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

[@nats7367]

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

[@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