Deploy to Netlify: Complete Guide (2026)

Netlify is a cloud hosting platform that combines global CDN deployment, serverless functions, form handling, and continuous deployment from Git — making it the simplest way to deploy modern static sites and frontend applications.

What You’ll Learn

• Setting up Git-based continuous deployment on Netlify
• Configuring custom domains, environment variables, and SSL
• Using Netlify Forms, Functions, redirects, and headers
• Split testing and deploy previews for staging workflows

Why Netlify Matters

Netlify eliminates server management for frontend applications. Push to Git, Netlify builds and deploys automatically. The global CDN serves assets from 200+ edge nodes. Serverless Functions handle dynamic logic without managing infrastructure. For Jamstack and frontend-focused teams, Netlify is the dominant deployment platform.

DodaTech uses Netlify to deploy the DodaTech Tutorials website itself, with deploy previews for every pull request.

Learning Path

    flowchart LR
  A[Git Repository] --> B[Netlify Import]
  B --> C[Build & Deploy]
  C --> D[Custom Domain & SSL]
  D --> E[Functions & Forms<br/>You are here]
  E --> F[Split Testing & Previews]
  style E fill:#f90,color:#fff
  

Git-Based Deploy

Connect your Git repository (GitHub, GitLab, or Bitbucket) to Netlify:

1. Log in to netlify.com
2. Click “Add new site” → “Import an existing project”
3. Authorize Netlify to access your repositories
4. Select your repo and configure build settings

# netlify.toml — project configuration
[build]
  command = "npm run build"
  publish = "dist"
  base = "/"

[build.environment]
  NODE_VERSION = "20"

[[redirects]]
  from = "/api/*"
  to = "https://api.mybackend.com/:splat"
  status = 200

Expected build output in Netlify dashboard:

9:32:01 AM: Build ready to start
9:32:03 AM: Build script: npm run build
9:33:15 AM: Build successful (72s)
9:33:16 AM: Deploy published (unique URL: https://abc123.netlify.app)

Custom Domains

1. Go to Site settings → Domain management → Add custom domain
2. Enter your domain (e.g., example.com)
3. Update your DNS: add a CNAME record pointing www to your-site.netlify.app

DNS Record:
Type:  CNAME
Name:  www
Value: your-site.netlify.app

Netlify automatically provisions SSL certificates via Let’s Encrypt for all custom domains.

Environment Variables

Set environment variables per site (never commit secrets to Git):

# In Netlify UI: Site settings → Environment variables
DATABASE_URL=postgresql://...
API_KEY=sk-...
SITE_URL=https://example.com

Access in your build script:

// In your build process
console.log(process.env.SITE_URL); // "https://example.com"

Netlify Forms

Handle form submissions without a backend server:

<form name="contact" netlify>
  <input type="text" name="name" required />
  <input type="email" name="email" required />
  <textarea name="message"></textarea>
  <button type="submit">Send</button>
</form>

When submitted, Netlify captures the data in the dashboard, sends notification emails, and exposes it via API. No server code needed.

Netlify Functions

Serverless functions for dynamic logic:

// netlify/functions/hello.js
exports.handler = async (event, context) => {
  const { name } = event.queryStringParameters;

  return {
    statusCode: 200,
    body: JSON.stringify({
      message: `Hello, ${name || "World"}!`,
      timestamp: new Date().toISOString(),
    }),
  };
};

// netlify/functions/subscribe.js
exports.handler = async (event) => {
  if (event.httpMethod !== "POST") {
    return { statusCode: 405, body: "Method Not Allowed" };
  }

  const { email } = JSON.parse(event.body);

  // Validate, save to database, send to email service...
  console.log(`New subscriber: ${email}`);

  return {
    statusCode: 200,
    body: JSON.stringify({ success: true }),
  };
};

Expected function response:

GET /.netlify/functions/hello?name=Alice
→ {"message":"Hello, Alice!","timestamp":"2026-06-19T12:00:00Z"}

Deploy: just push to Git. Any file in netlify/functions/ becomes a serverless endpoint.

Redirects and Headers

Redirects

# netlify.toml redirects
[[redirects]]
  from = "/blog/*"
  to = "https://blog.example.com/:splat"
  status = 301

[[redirects]]
  from = "/old-page"
  to = "/new-page"
  status = 302

# SPA fallback — all routes serve index.html
[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200

Headers

[[headers]]
  for = "/*"
  [headers.values]
    X-Frame-Options = "DENY"
    X-XSS-Protection = "1; mode=block"
    Referrer-Policy = "strict-origin-when-cross-origin"

[[headers]]
  for = "/assets/*"
  [headers.values]
    Cache-Control = "public, max-age=31536000, immutable"

Split Testing

Run A/B tests on your deployments:

[[split_testing]]
  # In netlify.toml or via dashboard
  branches = ["main", "experiment-b"]
  traffic_split = [80, 20]

Netlify automatically splits traffic between branches. Each branch deploys independently, and you can compare conversion metrics in the dashboard.

Deploy Previews

Every pull request gets a unique preview URL:

Pull Request #42: "Add search feature"
Preview URL: https://deploy-preview-42--yoursite.netlify.app

Enable in Site settings → Deploy contexts → Deploy previews. Team members and stakeholders can review changes before merge without any additional infrastructure.

Common Errors

1. Build Fails with Module Not Found

Ensure package.json has all dependencies. Check that NODE_VERSION is set in netlify.toml or environment variables.

2. Forms Not Receiving Submissions

Forms require the netlify attribute. For SPAs, ensure the form exists in the initial HTML (pre-rendered or in a partial).

3. Functions Returning 404

Functions must be in netlify/functions/. The endpoint is /.netlify/functions/function-name. Check function logs in the Netlify dashboard.

4. Redirect Loop

SPA redirects (/* → /index.html) can cause loops if other redirect rules conflict. Order matters — put specific rules before the catch-all.

5. Custom Domain SSL Not Provisioning

DNS propagation can take up to 48 hours. Verify the CNAME record is correct and the domain points to your-site.netlify.app.

6. Environment Variables Not Available in Build

Variables set after the last build won’t be available until the next build. Trigger a new deploy after setting variables.

Practice Questions

1. How does Netlify deploy work? Connect a Git repository — every push triggers an automatic build and deploy. Netlify serves the built output from a global CDN.

2. Where do serverless function files live? In the netlify/functions/ directory. Each file becomes an endpoint at /.netlify/functions/filename.

3. How do you configure custom redirects in Netlify? Via netlify.toml with [[redirects]] rules or a _redirects file in the publish directory.

4. What are deploy previews? Unique URLs generated for every pull request, allowing stakeholders to review changes before merging.

5. How does Netlify handle form submissions? Add the netlify attribute to your <form> tag. Netlify captures submissions without server-side code.

Challenge: Deploy a site to Netlify with: (1) Git-based continuous deployment, (2) a custom domain with SSL, (3) a serverless function that accepts POST data, (4) a form handler, and (5) deploy previews enabled.

FAQ

What’s Next

Built by the developers of Doda Browser, DodaZIP, and Durga Antivirus Pro. Updated 2026-06-19.