Next.js, Tailwind & Firebase Tutorial #7 - Firebase Auth | Finance Tracker
In this tutorial series we'll create a production-ready Finance Tracker app using Next.js 13, Tailwind CSS and Firebase.
The app includes security using user authentication, protected routes, data storage using Firebase Firestore and styling the website using Tailwind CSS.
In lesson 7, we'll add Firebase authentication to our project.
Project demo: https://youtube-finance-tracker.verce...
Source code: https://github.com/leonvanzyl/next13-...
Next.js docs: https://nextjs.org
Tailwindcss docs: https://tailwindcss.com/
Firebase: https://firebase.google.com
CHAPTERS:
00:00 - Intro
00:31 - Enable Firebase Auth
01:19 - Update Firebase Config
01:46 - Install REACT-FIREBASE-HOOKS package
02:23 - Create Auth Context Store
06:20 - Update the Layout file
07:08 - Updating the navigation file
09:44 - SignIn Component
15:51 - Adding UID to Collections and Docs
16:54 - Add UID query to Finance Context
22:00 - A word on Security Rules
22:59 - Outro
#next #nextjs #tailwindcss #firebase #firestore #reactjs