Sveltekit Supabase Dashboard

Overview

The SvelteKit Supabase Dashboard is a simple dashboard built using the SvelteKit frontend framework and Supabase backend. It is inspired by the Supabase UI and offers various features such as multi-organization support, role-based access, user creation and deletion, tables and charts demo views, as well as a demo mode. The dashboard is built using several technologies, including Svelte and SvelteKit for the application framework, Supabase for the database and backend, TailwindCSS for the CSS framework, and various other libraries for icons, loading spinners, and charts.

Features

• Supabase inspired UI: The dashboard is designed to resemble the Supabase UI, providing a familiar and intuitive user interface.
• Multi organization: It supports multiple organizations, allowing users to manage and access data for different organizations.
• Role-based access: The dashboard provides role-based access control, allowing different users to have different levels of access based on their roles.
• User creation and deletion in dashboard UI: Users can be created and deleted directly from the dashboard user interface.
• Tables & Charts demo views: The dashboard offers demo views for tables and charts, providing a visual representation of the data.
• Demo mode: The dashboard includes a demo mode that shows hints and disables database updates for testing purposes.

Installation

To install the SvelteKit Supabase Dashboard, follow these steps:

1. Setup Supabase:

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

2. Clone the repo:

   git clone [repo-url]
   

3. Setup environment variables:

   • Create a new .env file
   • Edit the .env file to match your project URL and API keys

4. Initialize the database:

   • Execute sql/init_database.sql and sql/init_demo_data.sql in Supabase SQL Editor

5. Install and run:

   • To start in development mode:

     npm run dev
     

   • To build and start in production mode:

     npm run build
     npm run start
     

6. Deploy:

   • Follow the instructions here to deploy to Vercel

For more detailed development information and contribution guidelines, refer to the provided documentation.

Summary

The SvelteKit Supabase Dashboard is a feature-rich dashboard built using SvelteKit and Supabase. It offers a Supabase-inspired UI, multi-organization support, role-based access control, and various demo views for tables and charts. The installation process involves setting up Supabase, cloning the repository, configuring environment variables, initializing the database, and running the application. Detailed documentation and contribution guidelines are available for further development.