alt text

Try different access roles and views here.

• Supabase inspired UI
• Multi organization
• Role based access
• User creation and deletion in dashboard UI
• Tables & Charts demo views
• Demo mode (show hints and disable database updates)

• Svelte and SvelteKit as application framework
• Supabase as database and backend
• TailwindCSS as CSS framework
• DaisyUI as Tailwind CSS component library
• Supabase Auth Helpers as Auth utilities for working with Supabase
• Supabase custom claims for multi organization and role based access
• Charts.js and svelte-chartjs for charts
• Feather Icons and svelte-feather-icons for icons
• svelte-loading-spinners for loading spinners
• Vercel as deployment platform

• Improve development docs
• Fix TypeScript issues
• Add more chart views
• (削除) Update supabase-js v2 (削除ここまで)
• (削除) User profiles (削除ここまで)
• (削除) Light/Dark mode (削除ここまで)
• Improve mobile navigation
• PWA

Create new project at supabase.com and go to Settings->API to check your project URL and API keys

git clone https://github.com/xulioc/sveltekit-supabase-dashboard.git
cd sveltekit-supabase-dashboard

Create a new .env file

cp .env.example .env

Edit your .env file to match your project URL and API keys

# SUPABASE
PUBLIC_SUPABASE_URL="YOUR PROJECT URL"
PUBLIC_SUPABASE_ANON_KEY="YOUR PROJECT ANON KEY"
PRIVATE_SUPABASE_SERVICE_KEY="YOUR PROJECT SERVICE KEY"

Execute sql/init_databse.sql and sql/init_demo_data.sql in Supabase SQL Editor.

npm install

To start in development mode:

npm run dev

To build and start in production mode:

npm run build
npm run preview

To deploy to Vercel please follow instructions here.

Find more development details here.

Feel free to contribute. Issues and Pull Requests are welcome.

MIT