From netlify-skills
Guides deployment of web frameworks (Vite/React, Astro, TanStack Start, Next.js, Nuxt, SvelteKit, Remix) on Netlify, covering adapters, environment variables, and client-side routing.
How this skill is triggered — by the user, by Claude, or both
Slash command
/netlify-skills:netlify-frameworksThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Netlify supports any framework that produces static output. For frameworks with server-side capabilities (SSR, API routes, middleware), an adapter or plugin translates the framework's server-side code into Netlify Functions and Edge Functions automatically.
Netlify supports any framework that produces static output. For frameworks with server-side capabilities (SSR, API routes, middleware), an adapter or plugin translates the framework's server-side code into Netlify Functions and Edge Functions automatically.
During build, the framework adapter writes files to .netlify/v1/ — functions, edge functions, redirects, and configuration. Netlify reads these to deploy the site. You do not need to write Netlify Functions manually when using a framework adapter for server-side features.
Check these files to determine the framework:
| File | Framework |
|---|---|
astro.config.* | Astro |
next.config.* | Next.js |
nuxt.config.* | Nuxt |
vite.config.* + react-router | Vite + React (SPA or Remix) |
app.config.* + @tanstack/react-start | TanStack Start |
svelte.config.* | SvelteKit |
Each framework has specific adapter/plugin requirements and local dev patterns:
For single-page apps with client-side routing, add a catch-all redirect:
# netlify.toml
[[redirects]]
from = "/*"
to = "/index.html"
status = 200
404.html in your publish directory. Netlify serves it automatically for unmatched routes.Each framework exposes environment variables to client-side code differently:
| Framework | Client prefix | Access pattern |
|---|---|---|
| Vite / React | VITE_ | import.meta.env.VITE_VAR |
| Astro | PUBLIC_ | import.meta.env.PUBLIC_VAR |
| Next.js | NEXT_PUBLIC_ | process.env.NEXT_PUBLIC_VAR |
| Nuxt | NUXT_PUBLIC_ | useRuntimeConfig().public.var |
Server-side code in all frameworks can access variables via process.env.VAR or Netlify.env.get("VAR").
npx claudepluginhub netlify/context-and-tools --plugin netlify-skillsValidates build configuration, redirects, environment variables, and deployment readiness for deploying static sites or serverless functions to Netlify.
Guides installation, authentication, site linking, and deployment (Git-based or manual) with Netlify CLI. Covers netlify dev, environment variables, and local dev for frameworks.
Guides step-by-step deployment of static sites, React/Vue/Next.js/Nuxt frontends, Python (Flask/FastAPI/Django) or Node.js (Express/Nest) backends to Vercel, Netlify, Cloudflare Pages, Railway, Render. Prepares build configs, env vars, gitignore.