diff --git a/documentation/docs/00-introduction.md b/documentation/docs/00-introduction.md index 073e9183e8ef..bb43ddaee962 100644 --- a/documentation/docs/00-introduction.md +++ b/documentation/docs/00-introduction.md @@ -6,13 +6,13 @@ title: Introduction > SvelteKit is in early development, and some things may change before we hit version 1.0. This document is a work-in-progress. If you get stuck, reach out for help in the [Discord chatroom](https://svelte.dev/chat). > -> See the [migration guides](/migrating) for help upgrading from Sapper. +> See the [migration guides](/docs/migrating) for help upgrading from Sapper. ### What is SvelteKit? SvelteKit is a framework for building extremely high-performance web apps. -Building an app with all the modern best practices is fiendishly complicated. Those practices include [build optimizations](https://vitejs.dev/guide/features.html#build-optimizations), so that you load only the minimal required code; [offline support](#service-workers); [prefetching](#anchor-options-sveltekit-prefetch) pages before the user initiates navigation; and [configurable rendering](#page-options) that allows you to generate HTML [on the server](#appendix-ssr) or [in the browser](#page-options-router) at runtime or [at build-time](#page-options-prerender). SvelteKit does all the boring stuff for you so that you can get on with the creative part. +Building an app with all the modern best practices is fiendishly complicated. Those practices include [build optimizations](https://vitejs.dev/guide/features.html#build-optimizations), so that you load only the minimal required code; [offline support](/docs/service-workers); [prefetching](/docs/a-options#sveltekit-prefetch) pages before the user initiates navigation; and [configurable rendering](/docs/page-options) that allows you to generate HTML [on the server](/docs/appendix#ssr) or [in the browser](/docs/page-options#router) at runtime or [at build-time](/docs/page-options#prerender). SvelteKit does all the boring stuff for you so that you can get on with the creative part. It uses [Vite](https://vitejs.dev/) with a [Svelte plugin](https://github.com/sveltejs/vite-plugin-svelte) to provide a lightning-fast and feature-rich development experience with [Hot Module Replacement (HMR)](https://github.com/sveltejs/vite-plugin-svelte/blob/main/docs/config.md#hot), where changes to your code are reflected in the browser instantly. diff --git a/documentation/docs/01-routing.md b/documentation/docs/01-routing.md index 7f462a039156..9ba9e5792e40 100644 --- a/documentation/docs/01-routing.md +++ b/documentation/docs/01-routing.md @@ -4,17 +4,17 @@ title: Routing At the heart of SvelteKit is a _filesystem-based router_. This means that the structure of your application is defined by the structure of your codebase — specifically, the contents of `src/routes`. -> You can change this to a different directory by editing the [project config](#configuration). +> You can change this to a different directory by editing the [project config](/docs/configuration). There are two types of route — **pages** and **endpoints**. Pages typically generate HTML to display to the user (as well as any CSS and JavaScript needed for the page). By default, pages are rendered on both the client and server, though this behaviour is configurable. -Endpoints run only on the server (or when you build your site, if [prerendering](#page-options-prerender)). This means it's the place to do things like access databases or APIs that require private credentials or return data that lives on a machine in your production network. Pages can request data from endpoints. Endpoints return JSON by default, though may also return data in other formats. +Endpoints run only on the server (or when you build your site, if [prerendering](/docs/page-options#prerender)). This means it's the place to do things like access databases or APIs that require private credentials or return data that lives on a machine in your production network. Pages can request data from endpoints. Endpoints return JSON by default, though may also return data in other formats. ### Pages -Pages are Svelte components written in `.svelte` files (or any file with an extension listed in [`config.extensions`](#configuration)). By default, when a user first visits the application, they will be served a server-rendered version of the page in question, plus some JavaScript that 'hydrates' the page and initialises a client-side router. From that point forward, navigating to other pages is handled entirely on the client for a fast, app-like feel where the common portions in the layout do not need to be rerendered. +Pages are Svelte components written in `.svelte` files (or any file with an extension listed in [`config.extensions`](/docs/configuration)). By default, when a user first visits the application, they will be served a server-rendered version of the page in question, plus some JavaScript that 'hydrates' the page and initialises a client-side router. From that point forward, navigating to other pages is handled entirely on the client for a fast, app-like feel where the common portions in the layout do not need to be rerendered. The filename determines the route. For example, `src/routes/index.svelte` is the root of your site: @@ -78,7 +78,7 @@ interface Fallthrough { } ``` -> See the [TypeScript](#typescript) section for information on `App.Locals` and `App.Platform`. +> See the [TypeScript](/docs/typescript) section for information on `App.Locals` and `App.Platform`. A page like `src/routes/items/[id].svelte` could get its data from `src/routes/items/[id].js`: @@ -102,7 +102,7 @@ export async function get({ params }) { } ``` -> All server-side code, including endpoints, has access to `fetch` in case you need to request data from external APIs. Don't worry about the `$lib` import, we'll get to that [later](#modules-$lib). +> All server-side code, including endpoints, has access to `fetch` in case you need to request data from external APIs. Don't worry about the `$lib` import, we'll get to that [later](/docs/modules#$lib). The job of this function is to return a `{ status, headers, body }` object representing the response, where `status` is an [HTTP status code](https://httpstatusdogs.com): @@ -111,7 +111,7 @@ The job of this function is to return a `{ status, headers, body }` object repre - `4xx` — client error - `5xx` — server error -> If `{fallthrough: true}` is returned SvelteKit will [fall through](#routing-advanced-routing-fallthrough-routes) to other routes until something responds, or will respond with a generic 404. +> If `{fallthrough: true}` is returned SvelteKit will [fall through](/docs/routing#advanced-routing-fallthrough-routes) to other routes until something responds, or will respond with a generic 404. The returned `body` corresponds to the page's props: @@ -223,7 +223,7 @@ return { #### HTTP method overrides -HTML `