sveltekit is a framework to build a full-stack application with features such as server-side rendering + svelte.
Svelte is a component library similar to
SvelteKit is a framework similar to
Next.js to build static applications
It provides the following features
- Server-side rendering and Single Page Application development
- Code splitting
- Build optimizations
- Progress apps features such as offline, prerender
- Supports pre-generate HTML in the server as well as in-browser at build/run time
- It is faster development and development loading is good
- Still in development, mature not enough
- Lack of documentation
- community support is limited and small
- Limited toots for a full-stack development
How to Create an application with sveltekit
Run the below command to create an application
npm init [email protected] sveltekitexample
A:\work\w3schools\svelte\sveltekitexample>npm init [email protected] . Need to install the following packages: [email protected] Ok to proceed? (y) y create-svelte version 2.0.0-next.122 Welcome to SvelteKit! This is beta software; expect bugs and missing features. Problems? Open an issue on https://github.com/sveltejs/kit/issues if none exists already. √ Where should we create your project? (leave blank to use the current directory) ... √ Which Svelte app template? » SvelteKit demo app √ Use TypeScript? ... No / Yes √ Add ESLint for code linting? ... No / Yes √ Add Prettier for code formatting? ... No / Yes √ Add Playwright for browser testing? ... No / Yes Your project is ready! ✔ ESLint https://github.com/sveltejs/eslint-plugin-svelte3 ✔ Prettier https://prettier.io/docs/en/options.html https://github.com/sveltejs/prettier-plugin-svelte#options ✔ Playwright https://playwright.dev Install community-maintained integrations: https://github.com/svelte-add/svelte-adders Next steps: 1: npm install (or pnpm install, etc) 2: git init && git add -A && git commit -m "Initial commit" (optional) 3: npm run dev -- --open To close the dev server, hit Ctrl-C Stuck? Visit us at https://svelte.dev/chat.
Next, Run dependencies using the npm install command.
Now, Run the server by typing the command
npm run dev
Here is an output
A:\work\w3schools\svelte\sveltekitexample>npm run dev > [email protected] dev > svelte-kit dev Pre-bundling dependencies: svelte svelte/store svelte/transition svelte/animate svelte/motion (...and 2 more) (this will be run only when your dependencies or config have changed) SvelteKit v1.0.0-next.288 network: not exposed local: http://localhost:3000 Use --host to expose a server to other devices on this network.