This content originally appeared on DEV Community and was authored by mmvergara
I’ve done all of the underlying stuff so you can just focus on creating the app and not having to go through the hassle of authentication
Github Repository
App Demo
Features
Protected Routes
Supabase Session Object in Global Context via
useSession
User Authentication
Routing and Route Guards
It’s also blazingly fast No really, try it out for yourself.
Getting Started
- Clone the repository
- Install dependencies:
npm install
- Create
.env
using the.env.example
as a template
VITE_SUPABASE_URL=
VITE_SUPABASE_ANON_KEY=
Run the app: npm run dev
What you need to know
-
/router/index.tsx
is where you declare your routes -
/context/SessionContext.tsx
is where you can find theuseSession
hook- This hook gives you access to the
session
object from Supabase globally
- This hook gives you access to the
-
/Providers.tsx
is where you can add moreproviders
orwrappers
mmvergara
/
react-supabase-auth-template
React Supabase Auth template with Protected Routes
React Supabase Auth with Protected Routes
Features
Protected Routes
Supabase Session Object in Global Context via
useSession
User Authentication
Routing and Route Guards
It’s also blazingly fast No really, try it out for yourself.
We also have a similar template for FIREBASE
Getting Started
- Clone the repository
- Install dependencies:
npm install
- Create
.env
using the.env.example
as a template
VITE_SUPABASE_URL=
VITE_SUPABASE_ANON_KEY=
- Run the app:
npm run dev
What you need to know
-
/router/index.tsx
is where you declare your routes -
/context/SessionContext.tsx
is where you can find theuseSession
hook- This hook gives you access to the
session
object from Supabase globally
- This hook gives you access to the
-
/Providers.tsx
is where you can add moreproviders
orwrappers
We also have a similar template for FIREBASE
This content originally appeared on DEV Community and was authored by mmvergara