#What is SvelteLab?

SvelteLab is a supercharged REPL for SvelteKit, or in other words a development environment for quickly crafting and sharing Svelte code. Instantly try out an idea, reproduce that bug or share a cool pattern or problem and share it with the world!

SvelteLab tries to balance between ease of use and productivity, to chase the code sharing experience the Svelte community deserves. Powered by WebContainer API, Codemirror 6 and, xterm.js the possibilities are endless. Join the Discord and GitHub to help us be the best we can!

#Why?

Paolo and Antonio are both Svelte lovers and wanted to bring something useful to the Svelte ecosystem for the SvelteHack 2023.

One thing that helped the adoption of Svelte was it’s wonderful REPL: with it you can have the whole power of Svelte directly in your browser without installing anything. It being lightweight makes it perfect to quickly prototype something and share it with the world.

However, it does not run SvelteKit. Kit is a web app framework based on Svelte. It features bundling configuration, routing, SSR, CSR, TypeScript and more and is the officially supported method for creating Svelte apps and libraries of any kind.

With SvelteLab, we are using the WebContainer API to run NodeJS and SvelteKit inside your browser, to provide the benefits of SvelteKit with the convenience of the REPL, plus some supercharged features like a command palette, code formatting and vim keybindings.

SvelteLab does not aim to compete with StackBlitz, VSCode or other more fully featured browser based IDE setups, since we focus on creating and sharing smaller SvelteKit projects. Since SvelteLab is focused on SvelteKit, it can integrate tighter into the ecosystem, featuring a couple of Templates with popular Technologies, instant SvelteKit Docs search, quick SvelteKit route file creation, and Svelte Add integrations.