https://tube.grossholtz.net/videos/watch/7798bdf7-1f6c-41ab-bd1e-03a31a7bf579 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.vercel.app Source code: https://github.com/leonvanzyl/next13-finance-tracker 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 Mon, 06 Apr 2026 03:14:48 GMT https://validator.w3.org/feed/docs/rss2.html PeerTube - https://tube.grossholtz.net https://tube.grossholtz.net/client/assets/images/icons/icon-512x512.png https://tube.grossholtz.net/videos/watch/7798bdf7-1f6c-41ab-bd1e-03a31a7bf579 All rights reserved, unless otherwise specified in the terms specified at https://tube.grossholtz.net/about and potential licenses granted by each content's rightholder.