diff --git a/docs/1.getting-started/8.server.md b/docs/1.getting-started/8.server.md new file mode 100644 index 0000000000..a0086f7aef --- /dev/null +++ b/docs/1.getting-started/8.server.md @@ -0,0 +1,86 @@ +--- +navigation.icon: uil:laptop-connection +description: Build full-stack applications, fetch data from your database, create APIs, or even generate static server-side content like a sitemap or a RSS feed, from a single codebase. +--- + +# Server + +Nuxt's server framework allows you to build **full-stack applications**. For example, you can fetch data from a database or another server, create an API or even generate static server-side content like a sitemap or an RSS feed - all from a single codebase. + +::ReadMore{link="/docs/guide/directory-structure/server"} +:: + +## Powered by Nitro + +Nuxt's server is [Nitro](https://github.com/unjs/nitro). Nitro was originally created for Nuxt but is now part of [UnJS](https://unjs.io/) and used for other frameworks - and can even be used on its own. + +Using Nitro gives Nuxt superpowers: + +- Full control of the server-side part of your app +- Universal deployment on any provider (many zero-config) +- Hybrid rendering + +## Full control of the server-side part of your app + +With Nitro, you can easily manage the server part of your Nuxt app, from API endpoints to middleware. + +Both endpoints and middleware can be defined like this: + +```ts [server/api/test.ts] +export default defineEventHandler({ + // ... Do whatever you want here +}) +``` + +And you can directly return `text`, `json`, `html` or even a `stream`. + +Out-of-the-box, Nitro supports **hot module replacement** and **auto-import** like the other parts of your Nuxt application. + +::ReadMore{link="/docs/guide/directory-structure/server"} +:: + +## Universal Deployment + +Nitro offers the ability to deploy your Nuxt app anywhere, from a bare metal server to the edge network, with a start time of just a few milliseconds. That's fast! + +Today, Nitro offers more than 15 presets to build your Nuxt app for different cloud providers and servers, including: + +- [Cloudflare Workers](https://workers.cloudflare.com/) +- [Netlify Functions](https://www.netlify.com/products/functions/) +- [Vercel Edge Network](https://vercel.com/docs/edge-network/introduction) + +Or for other runtimes: + +- [Deno](https://deno.land/) +- [Bun](https://bun.sh/) + +::ReadMore{link="/docs/getting-started/deployment"} +:: + +## Hybrid Rendering + +Do you need both static and dynamic pages in your Nuxt app? Nitro has your back! + +Nitro has a powerful feature called `routeRules` which allows you to define a set of rules to customize how each route of your Nuxt app is rendered (and more). + +```ts [nuxt.config.ts] +export default defineNuxtConfig({ + routeRules: { + '/': { prerender: true }, // Generated at build time for SEO purpose + '/api/*': { cache: { maxAge: 60 * 60 } } // Cached for 1 hour + '/old-page': { redirect: { to: { '/new-page', status: 302 } } // Redirection to avoid 404 + // ... + } +}) +``` + +[More rules are available](https://nuxt.com/docs/guide/concepts/rendering#hybrid-rendering) to customize the rendering mode of your routes. + +In addition, there are some route rules (for example, `ssr` and `experimentalNoScripts`) that are not Nitro rules but affect Nuxt's behavior when rendering your pages to HTML. + +Some route rules (`redirect` and `prerender`) also affect client-side behavior. + +Nitro is used to build the app for server side rendering, as well as pre-rendering. + +::ReadMore{link="/docs/guide/concepts/rendering"} +::