Svelte Docs Starter

🎮Live Demo

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

⚒️ Serverless DOCS Stack: 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

🛣️ vite-plugin-kit-routes - url routes

🌲 pino - logging

✅ Vitest - unit testing web UI

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

📦Easy to switch in alternative packagages, such as running on AWS, GCE, Azure with Docker. 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 my-db-prod.
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