Netlify Deploy

Netlify Deploy is a community skill for deploying web applications and static sites to the Netlify platform, covering build configuration, deploy previews, serverless functions, continuous deployment from Git repositories, and environment-specific build configuration.

What Is This?

Overview

Netlify Deploy provides deployment workflows for the Netlify platform including static site hosting, build pipeline configuration, serverless functions, edge functions, form handling, and redirect management. It covers both Git-based continuous deployment and manual CLI deploys. The skill addresses the full deployment lifecycle from local development through production with environment-specific configurations.

Who Should Use This

This skill serves frontend developers deploying static sites or single-page applications, teams using Jamstack architecture with serverless backend functions, and developers who want preview deployments for every pull request without managing infrastructure.

Why Use It?

Problems It Solves

Configuring web servers, SSL certificates, and CDN distribution for static sites requires infrastructure expertise unrelated to frontend development. Without deploy previews, reviewers cannot see changes visually before merging pull requests. Serverless functions hosted on separate platforms require cross-origin configuration and separate deployment pipelines. Build configuration differences between local and production environments cause deployments that fail despite working locally.

Core Highlights

Automatic deploy previews generate unique URLs for every pull request branch. Build plugins extend the deployment pipeline with custom processing steps. Serverless and edge functions deploy alongside the frontend from the same repository. Redirect and rewrite rules handle URL routing for single-page applications and API proxying without server configuration files.

How to Use It?

Basic Usage

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

[build.environment]
  NODE_VERSION = "20"

[[redirects]]
  from = "/api/*"
  to = "/.netlify/functions/:splat"
  status = 200

[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200

[context.deploy-preview]
  command = "npm run build:preview"

[context.production]
  command = "npm run build:production"
  [context.production.environment]
    API_URL = "https://api.example.com"

Real-World Examples

// netlify/functions/api.mjs
export default async (request, context) => {
  const url = new URL(request.url);
  const path = url.pathname.replace("/api/", "");

  if (request.method === "GET" && path === "items") {
    const items = [
      { id: 1, name: "Widget", price: 9.99 },
      { id: 2, name: "Gadget", price: 19.99 }
    ];
    return new Response(JSON.stringify(items), {
      headers: { "Content-Type": "application/json" }
    });
  }

  if (request.method === "POST" && path === "contact") {
    const body = await request.json();
    console.log("Contact form:", body.email, body.message);
    return new Response(
      JSON.stringify({ status: "received" }),
      { status: 201, headers: { "Content-Type": "application/json" } }
    );
  }

  return new Response("Not Found", { status: 404 });
};

Advanced Tips

Use Netlify build plugins to optimize images, generate sitemaps, or validate HTML during the build process. Configure branch-specific deploy contexts in netlify.toml for staging and production environments. Use environment variables through the Netlify dashboard for secrets rather than committing them to configuration files.

When to Use It?

Use Cases

Deploy a documentation site with automatic rebuilds when content changes are pushed. Host a React or Vue application with serverless API functions in the same repository. Set up preview deployments that allow stakeholders to review changes on unique URLs before merge.

Related Topics

Jamstack architecture, static site generators, serverless function platforms, CDN configuration, continuous deployment from Git repositories, and environment-specific build configuration.

Important Notes

Requirements

A Netlify account with a connected Git repository or the Netlify CLI for manual deploys. A build command that produces static output in a publish directory. Node.js for serverless function development.

Usage Recommendations

Do: use deploy-preview context for branch-specific build configurations. Test serverless functions locally with netlify dev before deploying. Configure custom headers for security policies including Content-Security-Policy and CORS settings.

Don't: commit API keys or secrets to netlify.toml when environment variables are available through the dashboard. Rely solely on client-side redirects when server-side redirects provide better performance and SEO. Ignore build logs when deployments fail, as they contain specific error details needed for diagnosis.

Limitations

Serverless function execution time is limited by platform-defined timeouts that vary by plan tier. Build minutes are metered and can be exhausted by frequent deploys on active repositories. Large sites with thousands of pages may experience longer build and deploy times that affect preview URL availability. Edge function execution has stricter size and runtime constraints than standard serverless functions.