React Firebase Auth Template (With Protected Routes)

React Firebase Auth Template (With Protected Routes)

TLDR: got tired of setting up this lightweight stack over and over again for some clients so i made a template, and i’m just here to share to ya’ll.

🔭 Github Repository

🌐 App Demo

Features

🚀 Protected Routes
🚀 Firebase User Object in Global Context via useUser

🚀 User Authentication
🚀 Routing

It’s also blazingly fast 🔥 No really, try it out for yourself.

Getting Started

Clone the repository
Install dependencies: npm install

Go to ./config.ts and add your Firebase configuration
Run the app: npm run dev

What you need to know

/router/index.tsx is where you declare your routes

/context/AuthContext.tsx is where you can find the useUser hook

This hook gives you access to the user object from Firebase Auth globally

/Providers.tsx is where you can add more providers or wrappers


mmvergara
/
react-firebase-auth-template

React Firebase Auth template with Protected Routes

React Firebase Auth with Protected Routes

🌐 App Demo

Features

🚀 Protected Routes
🚀 Firebase User Object in Global Context via useUser

🚀 User Authentication
🚀 Routing

It’s also blazingly fast 🔥 No really, try it out for yourself.

Getting Started

Clone the repository
Install dependencies: npm install

Go to ./config.ts and add your Firebase configuration
Run the app: npm run dev

What you need to know

/router/index.tsx is where you declare your routes

/context/AuthContext.tsx is where you can find the useUser hook

This hook gives you access to the user object from Firebase Auth globally

/Providers.tsx is where you can add more providers or wrappers