React Firebase Authentication - Protected Routes - Context - (Firebase v9) ?
In this video I go over Firebase v9 Authentication in React JS. We will be able to create a new user by email address, sign in, sign out, and check to see if a user is logged in or not. We will use react-router-dom v6 to navigate pages after signing in. We will also use protected routes. This means you will be required to be signed-in as a user to view the specified page otherwise the user is routed to the sign in page. Context will be used so we can access the user details in any of our React components wrapped in our Provider. All the UI styling is done with tailwind css. Check the time stamps below. Feedback welcome - thanks for watching!
If you enjoyed the video and would like me to demonstrate social sign-in (google/facebook) with firebase or how to store the user data into a firestore database then please let me know in the comments below! ?
ZeroTo Mastery:
- Master React JS Course - https://bit.ly/Learn-React-JS
- Complete Web Developer in 2023 - https://bit.ly/Complete-Web-Developer-2023
Coding Challenges!
https://bit.ly/Code-Challenges
Timestamps:
0:00 - Intro
00:31 Create react app
02:01 Install tailwind css
03:16 Update to react 18
04:36 Install react-router-dom
06:07 Create Sign-in/Signup components
17:52 Install/configure Firebase
23:45 Use Context
28:30 Create new user
38:50 Check to see if user is signed in onAuthStateChange
44:30 Signout
47:28 Sign in user
54:38 Protected routes
Github repo ?
https://github.com/fireclint/firebase-auth-context
? My Coding Equipment ?
Logitech MX Wireless Keyboard - https://amzn.to/3xKPFiN
Logitech MX Master 2S Wireless Mouse - https://amzn.to/3O5WmRD
SAMSUNG 49-Inch Gaming Monitor - https://amzn.to/3mvUy8M
Shure MV7 USB Podcast Microphone - https://amzn.to/3O00nqG
Mic Boom Arm - https://amzn.to/3NHn6YU
Monitor Desk Light Bar - https://amzn.to/3xzKlyj
? Connect with me on IG ?
https://instagram.com/fireclint
☕ Support the channel ☕
https://www.buymeacoffee.com/clintbriley
Что делает видео по-настоящему запоминающимся? Наверное, та самая атмосфера, которая заставляет забыть о времени. Когда вы заходите на RUVIDEO, чтобы посмотреть онлайн «React Firebase Authentication - Protected Routes - Context - (Firebase v9) ?», вы рассчитываете на нечто большее, чем просто загрузку плеера. И мы это понимаем. Контент такого уровня заслуживает того, чтобы его смотрели в HD 1080, без дрожания картинки и бесконечного буферизации.
Честно говоря, Rutube сегодня — это кладезь уникальных находок, которые часто теряются в общем шуме. Мы же вытаскиваем на поверхность самое интересное. Будь то динамичный экшн, глубокий разбор темы от любимого автора или просто уютное видео для настроения — всё это доступно здесь бесплатно и без лишних формальностей. Никаких «заполните анкету, чтобы продолжить». Только вы, ваш экран и качественный поток.
Если вас зацепило это видео, не забудьте взглянуть на похожие материалы в блоке справа. Мы откалибровали наши алгоритмы так, чтобы они подбирали контент не просто «по тегам», а по настроению и смыслу. Ведь в конечном итоге, онлайн-кинотеатр — это не склад файлов, а место, где каждый вечер можно найти свою историю. Приятного вам отдыха на RUVIDEO!
Видео взято из открытых источников Rutube. Если вы правообладатель, обратитесь к первоисточнику.