Loading repository data…
Loading repository data…
itsolidude / repository
🚀 SimplySaaS is a SvelteKit 5 boilerplate with Supabase auth, shadcn-svelte UI, and TypeScript—built for developers who want full control. It includes email/password + OAuth, protected routes, error handling, and Superforms with Zod for seamless authentication. Fast, flexible, and production-ready. 🔥
A transparent discovery signal based on current public GitHub metadata.
This score does not audit code, security, maintainers, documentation quality, or suitability. Verify the repository and its current documentation before adoption.
A modern SvelteKit boilerplate with Supabase authentication, shadcn-svelte components, and TypeScript designed to jumpstart your SaaS project.
I've spent countless hours looking for a good Svelte 5 boilerplate that just works - one with a complete authentication setup including both email/password and OAuth, proper error handling, and all the essential features you need. The ones I found were either missing key features or built with UI libraries like DaisyUI or Mantine where I couldn't really control the code the way I wanted.
I hold somewhat of a grudge against Next.js since it was clearly made to lock you into Vercel's ecosystem. Svelte 5, on the other hand, was made with developer experience in mind. It gives you the freedom to build and deploy however you want.
I went with shadcn because I love that we actually own the code. You get the components right in your project where you can modify them however you need. No more being stuck with someone else's design decisions.
I made sure this template has everything you need for a production-ready auth system:
I'm making SimplySaaS free for everyone to build their own SaaS products. You can:
Just one rule (which is in the license):
🔐 Authentication & Security:
🎨 UI Components:
🚀 Developer Experience:
git clone https://github.com/yourusername/SimplySaaS.git
cd SimplySaaS
npm install
.env.local.env.local with your Supabase credentials:PUBLIC_SUPABASE_URL=your_project_url
PUBLIC_SUPABASE_ANON_KEY=your_anon_key
src/lib/features/auth/config/auth.ts:
For Google OAuth setup, follow this video tutorial (starting at 7:20). It shows how to:
No code changes are needed - just configuration in the Supabase dashboard.
Start the development server:
npm run dev
Visit http://localhost:5173 to see your app.
src/
├── lib/
│ ├── components/
│ │ ├── auth/ # Authentication components
│ │ │ ├── AuthForm.svelte
│ │ │ ├── GoogleSignIn.svelte
│ │ │ ├── Login.svelte
│ │ │ └── Register.svelte
│ │ └── ui/ # shadcn-svelte components
│ │ ├── avatar # User avatars
│ │ ├── button # Button components
│ │ ├── card # Card containers
│ │ ├── dropdown-menu # Dropdown menus
│ │ ├── error-message # Error feedback
│ │ ├── footer # Page footer
│ │ ├── form # Form components
│ │ ├── input # Input fields
│ │ ├── label # Form labels
│ │ ├── logo # Site logo
│ │ ├── navbar # Navigation bar
│ │ ├── profile-dropdown # User profile menu
│ │ ├── sheet # Slide-out panels
│ │ ├── spinner # Loading indicators
│ │ ├── success-message # Success feedback
│ │ ├── switch # Toggle switches
│ │ ├── table # Data tables
│ │ ├── tabs # Tab navigation
│ │ └── tooltip # Hover tooltips
│ ├── features/
│ │ └── auth/ # Auth feature module
│ │ ├── config/ # Auth paths and redirects
│ │ ├── hooks/ # Auth guards and Supabase setup
│ │ ├── schemas/ # Zod validation schemas
│ │ └── services/ # Auth business logic
│ ├── types/ # TypeScript type definitions
│ │ └── unplugin-icons.d.ts # Icon plugin types
│ ├── utils.ts # shadcn utility re-exports (keeps default shadcn imports working!!!!)
│ └── utils/ # Organized utility modules
│ ├── cn.ts # Tailwind class merging utility for shadcn
│ └── supabase-session-warnings.ts # Handles Supabase SSR warning suppression
├── routes/
│ ├── +error.svelte # Error handling
│ ├── +layout.server.ts # Root server layout
│ ├── +layout.svelte # Root layout
│ ├── +layout.ts # Root layout logic
│ ├── +page.svelte # Home page
│ ├── auth/ # Auth routes
│ │ ├── +layout.svelte # Auth layout
│ │ ├── +page.server.ts # Auth server logic
│ │ ├── +page.svelte # Auth page
│ │ ├── login/ # Login flow
│ │ │ ├── +page.server.ts
│ │ │ └── +page.svelte
│ │ ├── register/ # Registration flow
│ │ │ ├── +page.server.ts
│ │ │ └── +page.svelte
│ │ ├── reset/ # Password reset
│ │ │ ├── +page.server.ts
│ │ │ └── +page.svelte
│ │ ├── update-password/ # Password update
│ │ │ ├── +page.server.ts
│ │ │ └── +page.svelte
│ │ ├── verify/ # Email verification
│ │ │ ├── +page.server.ts
│ │ │ └── +page.svelte
│ │ ├── callback/ # OAuth callback
│ │ │ └── +server.ts
│ │ └── confirm/ # Email confirmation
│ │ └── +server.ts
│ └── private/ # Protected routes
│ ├── +layout.server.ts # Protected layout logic
│ ├── +layout.svelte # Protected layout
│ ├── dashboard/ # User dashboard
│ │ └── +page.svelte
│ └── settings/ # User settings
│ ├── +page.server.ts
│ └── +page.svelte
└── hooks.server.ts # Server hooks (auth setup)
Registration (/auth?mode=register):
Login (/auth?mode=login):
/auth/reset/auth/update-passwordAll routes under /private/* are automatically protected through the auth guard:
// src/lib/features/auth/hooks/auth-guard.server.ts handles protection
if (!event.locals.session && event.url.pathname.startsWith('/private')) {
throw redirect(303, '/auth');
}
// Also redirects authenticated users away from auth pages
if (event.locals.session && event.url.pathname === '/auth') {
throw redirect(303, '/private/dashboard');
}
I've decided to use a simple and flat utils structure while maintaining compatibility with third-party libraries:
/lib/utils.ts: A re-export file that maintains shadcn's expected import paths, keeping component installations working smoothly./lib/utils/: Contains all utility files with descriptive names that indicate their purpose:
cn.ts: Tailwind class merging utility used by shadcn componentssupabase-session-warnings.ts: Handles SSR-related warning suppression for Supabase auth (specifically one really annoying bug I mention in the file comment)This structure provides several benefits: