Web Development with SvelteKit

Practical tutorials and code guides for building web applications with SvelteKit — covering authentication, pagination, SEO, Supabase, UI components, stores, forms, and more

The SvelteKit web development tutorials document Amrit’s journey of building the Fractal Maṇḍala website from scratch. They serve as practical guides for developers working with SvelteKit and its ecosystem.

Authentication

Multiple guides cover authentication approaches:

  • Auth in SvelteKit through GitHub — setting up Auth.js with GitHub OAuth
  • Auth in SvelteKit 2 — updated patterns for SvelteKit 2
  • Supabase Auth — integrating Supabase authentication
  • DeepSeek Auth Dump — working with OpenAI-compatible auth flows
  • AutoFill in SvelteKit — form autofill patterns

UI Components and Patterns

  • Modals in SvelteKit — implementing modal dialogs with proper accessibility
  • Hovers in SvelteKit — hover states and dropdown menus
  • Toggles in SvelteKit — toggle switches and state management
  • TipTap Editor — integrating the TipTap rich text editor

Data and State Management

  • Global Stores in SvelteKit — managing theme, breakpoints, and global state
  • ChatGPT in SvelteKit — integrating LLM APIs
  • GPT Bots Built — building GPT-powered bots
  • Paginated Post Pages — implementing pagination for blog posts

SEO and Metadata

  • SEO Metadata in SvelteKit — setting up global store-driven SEO metadata
  • Supabase Integration — connecting SvelteKit to Supabase backend
  • Payments API — integrating Razorpay payment processing

Development Resources

  • Web Dev Bookmarks — curated collection of web development resources
  • Web Interface Guidelines — UI/UX guidelines for web applications
  • Documentation — notes on technical documentation practices
  • Stack and Design — technical stack decisions and design rationale

See Also