Deploy a Next.js 16 App on Rackline

In this tutorial

Introduction

Next.js 16 brings improved streaming, enhanced server actions, and a refined App Router. This tutorial walks you through creating a production-ready Next.js 16 application and deploying it to Rackline with environment variables, build optimizations, and a custom domain.

Prerequisites

• A Rackline account with an active droplet
• Node.js 22 or later installed locally
• Basic familiarity with React and Next.js

Step 1 — Scaffold Your Next.js 16 Project

Use create-next-app to bootstrap a new project. Next.js 16 defaults to the App Router and React 19 with server components enabled out of the box. The new release also includes Turbopack as the default bundler in development.

npx create-next-app@16 my-rackline-app \
  --typescript \
  --tailwind \
  --app \
  --src-dir

cd my-rackline-app

Step 2 — Configure Environment Variables

Create a .env.local file for development secrets and a .env.production file for production values. Rackline supports encrypted environment variables that are injected at build time and runtime. Never commit secrets to version control.

# Set environment variables via the CLI
rackline env set DATABASE_URL="postgresql://user:pass@db.rackline.net:5432/mydb" \
  --project my-rackline-app \
  --environment production

rackline env set NEXT_PUBLIC_API_URL="https://api.example.com" \
  --project my-rackline-app \
  --environment production

# List all configured variables
rackline env list --project my-rackline-app

Step 3 — Optimize Your Build Configuration

Next.js 16 introduces improved static analysis for automatic static optimization. Configure your next.config.ts to enable output tracing for minimal deployment bundles. This reduces your deploy size by up to 70% compared to a full node_modules copy.

// next.config.ts
import type { NextConfig } from "next";

const config: NextConfig = {
  output: "standalone",
  images: {
    remotePatterns: [
      { protocol: "https", hostname: "**.rackline.net" },
    ],
  },
  experimental: {
    optimizeCss: true,
  },
};

export default config;

Step 4 — Deploy to Rackline

With your project configured, deploy it using the Rackline CLI. The CLI detects Next.js automatically, runs the production build, and provisions a Node.js runtime on your droplet. It also configures Nginx as a reverse proxy with automatic SSL.

# Initialize Rackline in your project
rackline init --framework nextjs

# Deploy to production
rackline deploy --environment production

# View deployment logs
rackline logs --follow

Step 5 — Add a Custom Domain

Point your domain to Rackline by adding DNS records. Rackline provides automatic SSL certificate provisioning via Let's Encrypt with automatic renewal. Wildcard certificates are supported for subdomains.

# Add your domain
rackline domains add example.com --project my-rackline-app

# Verify DNS configuration
rackline domains verify example.com

# Check SSL status
rackline domains ssl-status example.com

Conclusion

Your Next.js 16 application is now live on Rackline with environment variables, optimized builds, and a custom domain with SSL. You can set up CI/CD with GitHub Actions to automate future deployments whenever you push to main.