Netlify Frameworks

What Is This?

Overview

Netlify Frameworks is a collection of integration guides and tooling that enables developers to deploy modern web frameworks directly to the Netlify platform. Whether a project uses static site generation, server-side rendering, or a hybrid approach, Netlify provides the infrastructure and adapter layer needed to run each framework correctly in production. The platform supports any framework that produces static output, and extends that support to server-rendered frameworks through dedicated adapters and plugins.

Each framework has specific build requirements, output structures, and runtime expectations. Netlify Frameworks addresses these differences by providing framework-aware configuration that maps build outputs to the correct Netlify primitives, including edge functions, serverless functions, and static file hosting. This means developers spend less time writing deployment configuration and more time building features.

The supported framework list includes Vite with React, Astro, TanStack Start, Next.js, Nuxt, SvelteKit, and Remix. Each of these integrates with Netlify through either a dedicated adapter or an official Netlify plugin, which handles the translation between framework-specific output and Netlify's deployment model.

Who Should Use This

• Frontend developers deploying React or Vite projects who want zero-configuration static hosting with optional serverless functions.
• Full-stack developers building server-rendered applications with Next.js, Nuxt, or SvelteKit who need SSR support on Netlify.
• Teams migrating existing framework projects from other hosting providers to Netlify.
• Developers building content-heavy sites with Astro who want to combine static pages with server-rendered routes.
• Engineers working with Remix or TanStack Start who need adapter-based deployment to Netlify's edge and serverless infrastructure.
• DevOps engineers configuring CI/CD pipelines for framework projects on Netlify.

Why Use It?

Problems It Solves

• Eliminates manual configuration of build commands, publish directories, and function routing for each framework.
• Removes the complexity of mapping server-rendered routes to serverless or edge functions without custom glue code.
• Resolves framework-specific deployment failures caused by incorrect output directory assumptions or missing runtime adapters.
• Reduces time spent debugging SSR hydration and routing issues that arise from mismatched framework and hosting configurations.
• Prevents production incidents caused by missing environment variable handling or incorrect Node.js runtime versions.

Core Highlights

• Supports static, SSR, and hybrid rendering modes across all major frameworks.
• Official adapters for SvelteKit, Astro, and Remix handle server output automatically.
• Next.js and Nuxt are supported through the Netlify Next.js Runtime and Nuxt plugin respectively.
• Edge function support is available for frameworks that target the edge runtime.
• Automatic detection of framework type during build reduces required manual configuration.
• Each adapter maps framework routes to Netlify Functions or Edge Functions as appropriate.
• Compatible with Netlify's environment variable management and branch deploy previews.

How to Use It?

Basic Usage

For a Vite and React project, the build command and publish directory are the primary configuration points. Add these to a netlify.toml file at the project root:

[build]
  command = "npm run build"
  publish = "dist"

For Next.js, install the Netlify Next.js adapter and the configuration is handled automatically:

npm install @netlify/plugin-nextjs

[[plugins]]
  package = "@netlify/plugin-nextjs"

Specific Scenarios

For SvelteKit, replace the default adapter with the Netlify adapter in svelte.config.js:

import adapter from "@sveltejs/adapter-netlify";

export default {
  kit: {
    adapter: adapter()
  }
};

For Astro, add the Netlify adapter using the Astro CLI:

npx astro add netlify

This command updates astro.config.mjs automatically and installs the required dependency.

Real-World Examples

A marketing site built with Astro uses static generation for most pages and server-rendered routes for personalized content. The Netlify adapter routes static pages to the CDN and SSR pages to serverless functions without additional configuration.

A SaaS dashboard built with Next.js uses API routes and server components. The Netlify Next.js plugin maps API routes to Netlify Functions and serves the static shell from the CDN edge.

When to Use It?

Use Cases

• Setting up a new framework project for Netlify deployment from scratch.
• Configuring SSR for an existing static site that requires dynamic server-rendered routes.
• Troubleshooting build failures related to framework output directory mismatches.
• Enabling edge function support for latency-sensitive routes in a Next.js or Nuxt application.
• Migrating a Vercel or Render deployment to Netlify while preserving SSR behavior.
• Adding Netlify Forms or Identity to a framework project that previously used a different provider.
• Configuring preview deploys for pull requests across a multi-framework monorepo.

Important Notes

Requirements

• A netlify.toml file or Netlify UI configuration specifying the correct build command and publish directory.
• The correct adapter or plugin installed as a project dependency for SSR frameworks.
• Node.js version compatibility between the local environment and the Netlify build image.