Svelte Starter Docs

🎮Live Demo

📑 Files & Functions Docs (starterdocs.js.org)

⚒️ Svelte Serverless Starter DOCS: Drizzle OAuth Cloudflare Svelte

📚 Drizzle ORM - lightweight ORM compatible with Cloudflare D1 and drizzle-kit to manage schema migrations

👤 OAuth Lucia - Google oAuth sign-in and/or email signup via Resend mailer api, with 4 email templates: reset password, change email, verify email, welcome. Settings and admin panel for users.

☁️ Cloudflare for Svelte - serverless autoscaling API and D1 database, great hosting platform with free tier

🖼️ SvelteKit - full stack interface and API routes framework. Many developers prefer Svelte over React.

🧩 Interface Components

🎨 Tailwind CSS + Bits UI + shadcn-svelte - popular UI components, with  lucide icons and demos like Sidebar and Magic UI Animations

📝 formsnap + sveltekit-superforms with zod validation and rate-limiting in server memory

🌲 pino - error logs

✅ Vitest - unit testing UI

⭐ Extras & Alternatives: List of Svelte Libraries, Material UI, SkeletonUI, Flowbite, Icon sets

📦 Easy to switch in alternatives: Such as running on AWS, GCE, Azure instead of Cloudflare. Change Drizzle setup to connect to any db like Supabase, and add popular platform APIs with Lucia.

🖼️ Screenshots

⬇️ Installation

1. Install prerequisites Node.js or Bun curl -fsSL https://bun.sh/install | bash. Optional: Setup shell with dev tools like nvim, fish, system info with Server-Shell-Setup
2. Clone to localhost or server git clone https://github.com/vtempest/svelte-docs-starter.
   Optional: Press . when on the Github repo page to fork and run in Github Workspaces.
3. CD to project directory cd svelte-docs-starter.
4. Install dependencies bun install.
5. mv .env.example .env ; mv wrangler.example.toml wrangler.toml and set the domain and API keys in .env.
6. Auth providers, get id/secret from Google.
7. Set OAuth origin http://localhost and http://localhost:5173 on local or https://domain.com on server.
8. Set redirect http://localhost:5173/auth/oauth/google/callback or https://api.domain.com/auth/oauth/google/callback.
9. Optional: For email auth, get API from Resend mailer and verify domain.
10. Log in with your Cloudflare account by running: bunx wrangler login.
11. Create your D1 database via dashboard or with bunx wrangler d1 create serverless-docs-db or your custom db name.
12. Copy the console output database_name and database_id.
13. Go to wrangler.toml and change database_name and database_id.
14. Go to drizzle.config.ts and change db name in dbName.
15. Go to package.json and change db name in db:push:* and db:backup:prod.
16. Generate and migrate the schema to dev or prod db: bun run db:migrate; bun run db:push:dev; bun run db:push:prod.
17. Develop on local with bun dev.
18. Deploy to prod with bun serve.
19. Domain: Cloudflare Dashboard -> Workers and Pages -> [your worker name] -> Settings
20. Add-to-Home on Mobile Web: Design logo and generate icons for with PWA Asset Generator or Favicon.io
21. User Analytics: Get Google Analytics ID from Google Analytics or SimpleAnalytics and add to app.html.
22. Email Forwarding: Setup Cloudflare Email Routing and GMail's Send From Verification