From 0690d56e9f3a85572aa198828367e726b2bad2df Mon Sep 17 00:00:00 2001 From: Enrico Sacchetti Date: Sat, 12 Aug 2023 21:03:48 -0400 Subject: [PATCH 1/4] docs: add back faq - Add back 'what can I make with SvelteKit' to FAQ from #10380 - Remove dedicated page for 'what can I make with SvelteKit' --- documentation/docs/60-appendix/01-faq.md | 21 ++++++++++++++++++ .../10-what-can-i-make-with-sveltekit.md | 22 ------------------- 2 files changed, 21 insertions(+), 22 deletions(-) delete mode 100644 documentation/docs/60-appendix/10-what-can-i-make-with-sveltekit.md diff --git a/documentation/docs/60-appendix/01-faq.md b/documentation/docs/60-appendix/01-faq.md index d09276e2d936..1b6c06e13993 100644 --- a/documentation/docs/60-appendix/01-faq.md +++ b/documentation/docs/60-appendix/01-faq.md @@ -6,6 +6,27 @@ title: Frequently asked questions Please see [the Svelte FAQ](https://svelte.dev/faq) and [`vite-plugin-svelte` FAQ](https://github.com/sveltejs/vite-plugin-svelte/blob/main/docs/faq.md) as well for the answers to questions deriving from those libraries. +## What can I make with SvelteKit? + +SvelteKit can be used to create most kinds of applications. Out of the box, SvelteKit supports many features including: + +- Dynamic page content with [load](/docs/load) functions and [API routes](/docs/routing#server). +- SEO-friendly dynamic content with [server-side rendering (SSR)](/docs/glossary#ssr). +- User-friendly progressively-enhanced interactive pages with SSR and [Form Actions](/docs/form-actions). +- Static pages with [prerendering](/docs/page-options#prerender). + +SvelteKit can also be deployed to a wide spectrum of hosted architectures via [adapters](/docs/adapters). In cases where SSR is used (or server-side logic is added without prerendering), those functions will be adapted to the target backend. Some examples include: + +- Self-hosted dynamic web applications with a [Node.js backend](/docs/adapter-node). +- Serverless web applications with backend loaders and APIs deployed as remote functions. See [zero-config deployments](/docs/adapter-auto) for popular deployment options. +- [Static pre-rendered sites](/docs/adapter-static) such as a blog or multi-page site hosted on a CDN or static host. Statically-generated sites are shipped without a backend. +- [Single-page Applications (SPAs)](/docs/single-page-apps) with client-side routing and rendering for API-driven dynamic content. SPAs are shipped without a backend and are not server-rendered. This option is commonly chosen when bundling SvelteKit with an app written in PHP, .Net, Java, C, Golang, Rust, etc. +- A mix of the above; some routes can be static, and some routes can use backend functions to fetch dynamic information. This can be configured with [page options](/docs/page-options) that includes the option to opt out of SSR. + +In order to support SSR, a JS backend — such as Node.js or Deno-based server, serverless function, or edge function — is required. + +It is also possible to write custom adapters or leverage community adapters to deploy SvelteKit to more platforms such as specialized server environments, browser extensions, or native applications. See [integrations](./integrations) for more examples and integrations. + ## How do I use HMR with SvelteKit? SvelteKit has HMR enabled by default powered by [svelte-hmr](https://github.com/sveltejs/svelte-hmr). If you saw [Rich's presentation at the 2020 Svelte Summit](https://svelte.dev/blog/whats-the-deal-with-sveltekit), you may have seen a more powerful-looking version of HMR presented. This demo had `svelte-hmr`'s `preserveLocalState` flag on. This flag is now off by default because it may lead to unexpected behaviour and edge cases. But don't worry, you are still getting HMR with SvelteKit! If you'd like to preserve local state you can use the `@hmr:keep` or `@hmr:keep-all` directives as documented on the [svelte-hmr](https://github.com/sveltejs/svelte-hmr) page. diff --git a/documentation/docs/60-appendix/10-what-can-i-make-with-sveltekit.md b/documentation/docs/60-appendix/10-what-can-i-make-with-sveltekit.md deleted file mode 100644 index 2e22801ac4a9..000000000000 --- a/documentation/docs/60-appendix/10-what-can-i-make-with-sveltekit.md +++ /dev/null @@ -1,22 +0,0 @@ ---- -title: What can I make with SvelteKit? ---- - -SvelteKit can be used to create most kinds of applications. Out of the box, SvelteKit supports many features including: - -- Dynamic page content with [load](/docs/load) functions and [API routes](/docs/routing#server). -- SEO-friendly dynamic content with [server-side rendering (SSR)](/docs/glossary#ssr). -- User-friendly progressively-enhanced interactive pages with SSR and [Form Actions](/docs/form-actions). -- Static pages with [prerendering](/docs/page-options#prerender). - -SvelteKit can also be deployed to a wide spectrum of hosted architectures via [adapters](/docs/adapters). In cases where SSR is used (or server-side logic is added without prerendering), those functions will be adapted to the target backend. Some examples include: - -- Self-hosted dynamic web applications with a [Node.js backend](/docs/adapter-node). -- Serverless web applications with backend loaders and APIs deployed as remote functions. See [zero-config deployments](/docs/adapter-auto) for popular deployment options. -- [Static pre-rendered sites](/docs/adapter-static) such as a blog or multi-page site hosted on a CDN or static host. Statically-generated sites are shipped without a backend. -- [Single-page Applications (SPAs)](/docs/single-page-apps) with client-side routing and rendering for API-driven dynamic content. SPAs are shipped without a backend and are not server-rendered. This option is commonly chosen when bundling SvelteKit with an app written in PHP, .Net, Java, C, Golang, Rust, etc. -- A mix of the above; some routes can be static, and some routes can use backend functions to fetch dynamic information. This can be configured with [page options](/docs/page-options) that includes the option to opt out of SSR. - -In order to support SSR, a JS backend — such as Node.js or Deno-based server, serverless function, or edge function — is required. - -It is also possible to write custom adapters or leverage community adapters to deploy SvelteKit to more platforms such as specialized server environments, browser extensions, or native applications. See [How do I use X with SvelteKit](/docs/integrations) for more examples and integrations. From bb9e48552db5e5c11028a585edc3f4b23db71150 Mon Sep 17 00:00:00 2001 From: Enrico Sacchetti Date: Sat, 12 Aug 2023 21:36:52 -0400 Subject: [PATCH 2/4] docs: fix old integration links --- documentation/docs/10-getting-started/10-introduction.md | 2 +- .../docs/10-getting-started/20-creating-a-project.md | 2 +- .../docs/25-build-and-deploy/70-adapter-cloudflare-workers.md | 4 ++-- documentation/docs/60-appendix/05-integrations.md | 2 +- documentation/docs/60-appendix/10-migrating.md | 2 +- 5 files changed, 6 insertions(+), 6 deletions(-) diff --git a/documentation/docs/10-getting-started/10-introduction.md b/documentation/docs/10-getting-started/10-introduction.md index 82882af335c6..c5b559567fa9 100644 --- a/documentation/docs/10-getting-started/10-introduction.md +++ b/documentation/docs/10-getting-started/10-introduction.md @@ -12,7 +12,7 @@ title: Introduction SvelteKit is a framework for rapidly developing robust, performant web applications using [Svelte](https://svelte.dev/). If you're coming from React, SvelteKit is similar to Next. If you're coming from Vue, SvelteKit is similar to Nuxt. -To learn more about the kinds of applications you can build with SvelteKit, see the [FAQ](/faq#what-can-i-make-with-sveltekit). +To learn more about the kinds of applications you can build with SvelteKit, see the [FAQ](/docs/faq#what-can-i-make-with-sveltekit). ## What is Svelte? diff --git a/documentation/docs/10-getting-started/20-creating-a-project.md b/documentation/docs/10-getting-started/20-creating-a-project.md index 57070bcc0692..a65814e9a50f 100644 --- a/documentation/docs/10-getting-started/20-creating-a-project.md +++ b/documentation/docs/10-getting-started/20-creating-a-project.md @@ -11,7 +11,7 @@ npm install npm run dev ``` -The first command will scaffold a new project in the `my-app` directory asking you if you'd like to set up some basic tooling such as TypeScript. See the FAQ for [pointers on setting up additional tooling](../faq#integrations). The subsequent commands will then install its dependencies and start a server on [localhost:5173](http://localhost:5173). +The first command will scaffold a new project in the `my-app` directory asking you if you'd like to set up some basic tooling such as TypeScript. See [integrations](./integrations) for pointers on setting up additional tooling. The subsequent commands will then install its dependencies and start a server on [localhost:5173](http://localhost:5173). There are two basic concepts: diff --git a/documentation/docs/25-build-and-deploy/70-adapter-cloudflare-workers.md b/documentation/docs/25-build-and-deploy/70-adapter-cloudflare-workers.md index b35a2597b828..aa6de38a7ab1 100644 --- a/documentation/docs/25-build-and-deploy/70-adapter-cloudflare-workers.md +++ b/documentation/docs/25-build-and-deploy/70-adapter-cloudflare-workers.md @@ -116,8 +116,8 @@ export {}; ### Worker size limits -When deploying to workers, the server generated by SvelteKit is bundled into a single file. Wrangler will fail to publish your worker if it exceeds [the size limits](https://developers.cloudflare.com/workers/platform/limits/#worker-size) after minification. You're unlikely to hit this limit usually, but some large libraries can cause this to happen. In that case, you can try to reduce the size of your worker by only importing such libraries on the client side. See [the FAQ](../faq#how-do-i-use-a-client-side-only-library-that-depends-on-document-or-window) for more information. +When deploying to workers, the server generated by SvelteKit is bundled into a single file. Wrangler will fail to publish your worker if it exceeds [the size limits](https://developers.cloudflare.com/workers/platform/limits/#worker-size) after minification. You're unlikely to hit this limit usually, but some large libraries can cause this to happen. In that case, you can try to reduce the size of your worker by only importing such libraries on the client side. See [the FAQ](./faq#how-do-i-use-a-client-side-only-library-that-depends-on-document-or-window) for more information. ### Accessing the file system -You can't access the file system through methods like `fs.readFileSync` in Serverless/Edge environments. If you need to access files that way, do that during building the app through [prerendering](https://kit.svelte.dev/docs/page-options#prerender). If you have a blog for example and don't want to manage your content through a CMS, then you need to prerender the content (or prerender the endpoint from which you get it) and redeploy your blog everytime you add new content. \ No newline at end of file +You can't access the file system through methods like `fs.readFileSync` in Serverless/Edge environments. If you need to access files that way, do that during building the app through [prerendering](https://kit.svelte.dev/docs/page-options#prerender). If you have a blog for example and don't want to manage your content through a CMS, then you need to prerender the content (or prerender the endpoint from which you get it) and redeploy your blog everytime you add new content. diff --git a/documentation/docs/60-appendix/05-integrations.md b/documentation/docs/60-appendix/05-integrations.md index bbf456872f3c..b1ba346646e0 100644 --- a/documentation/docs/60-appendix/05-integrations.md +++ b/documentation/docs/60-appendix/05-integrations.md @@ -31,4 +31,4 @@ You will need to install `svelte-preprocess` with `npm install --save-dev svelte ## Integration FAQs -The SvelteKit FAQ has a [section on integrations](../faq#integrations), which may be helpful if you still have questions. +The SvelteKit FAQ has a [section on integrations](./faq#how-do-i-use-x-with-sveltekit), which may be helpful if you still have questions. diff --git a/documentation/docs/60-appendix/10-migrating.md b/documentation/docs/60-appendix/10-migrating.md index 5335f7a7d24c..a2900db4e8a5 100644 --- a/documentation/docs/60-appendix/10-migrating.md +++ b/documentation/docs/60-appendix/10-migrating.md @@ -146,7 +146,7 @@ To support this environment-agnostic behavior, `fetch` is now available in the g ## Integrations -See [the FAQ](../faq#integrations) for detailed information about integrations. +See [integrations](./integrations) for detailed information about integrations. ### HTML minifier From fcca243b193a28a2a9563c0b8655514106e50e6f Mon Sep 17 00:00:00 2001 From: Enrico Sacchetti Date: Sat, 12 Aug 2023 22:08:58 -0400 Subject: [PATCH 3/4] docs: fix deep slug link --- .../docs/25-build-and-deploy/70-adapter-cloudflare-workers.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/documentation/docs/25-build-and-deploy/70-adapter-cloudflare-workers.md b/documentation/docs/25-build-and-deploy/70-adapter-cloudflare-workers.md index aa6de38a7ab1..48d1335c206e 100644 --- a/documentation/docs/25-build-and-deploy/70-adapter-cloudflare-workers.md +++ b/documentation/docs/25-build-and-deploy/70-adapter-cloudflare-workers.md @@ -116,7 +116,7 @@ export {}; ### Worker size limits -When deploying to workers, the server generated by SvelteKit is bundled into a single file. Wrangler will fail to publish your worker if it exceeds [the size limits](https://developers.cloudflare.com/workers/platform/limits/#worker-size) after minification. You're unlikely to hit this limit usually, but some large libraries can cause this to happen. In that case, you can try to reduce the size of your worker by only importing such libraries on the client side. See [the FAQ](./faq#how-do-i-use-a-client-side-only-library-that-depends-on-document-or-window) for more information. +When deploying to workers, the server generated by SvelteKit is bundled into a single file. Wrangler will fail to publish your worker if it exceeds [the size limits](https://developers.cloudflare.com/workers/platform/limits/#worker-size) after minification. You're unlikely to hit this limit usually, but some large libraries can cause this to happen. In that case, you can try to reduce the size of your worker by only importing such libraries on the client side. See [the FAQ](./faq#how-do-i-use-x-with-sveltekit-how-do-i-use-a-client-side-only-library-that-depends-on-document-or-window) for more information. ### Accessing the file system From 4298e731a3a79d1b2759d9e97ee99a480539875b Mon Sep 17 00:00:00 2001 From: Enrico Sacchetti Date: Sun, 13 Aug 2023 08:51:49 -0400 Subject: [PATCH 4/4] chore: apply suggestion --- documentation/docs/60-appendix/05-integrations.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/documentation/docs/60-appendix/05-integrations.md b/documentation/docs/60-appendix/05-integrations.md index b1ba346646e0..2f99f14edfb9 100644 --- a/documentation/docs/60-appendix/05-integrations.md +++ b/documentation/docs/60-appendix/05-integrations.md @@ -31,4 +31,4 @@ You will need to install `svelte-preprocess` with `npm install --save-dev svelte ## Integration FAQs -The SvelteKit FAQ has a [section on integrations](./faq#how-do-i-use-x-with-sveltekit), which may be helpful if you still have questions. +The SvelteKit FAQ has a [how to do X with SvelteKit](./faq#how-do-i-use-x-with-sveltekit), which may be helpful if you still have questions.