Vue.js Application Hosting

Nuxt.js Works Best on Real Servers

Nuxt.js with SSR mode starts a Node.js server that handles every incoming request. Platforms that run Nuxt as serverless functions have to cold-start the entire Nuxt application on each new function instance, adding hundreds of milliseconds of latency on idle applications.

CloudPloy runs your Nuxt server as a persistent Node.js process. The application boots once and stays warm, handling all requests with consistent sub-100ms response times. Your Pinia stores, Nitro caches, and in-memory data stay alive between requests exactly as Nuxt was designed to work.

Nuxt's server routes under the server/api/ directory run with no execution time limits. Long-running operations like CSV exports, report generation, or image processing complete without being cut off mid-execution.

Full Stack Vue Without Stitching Services Together

A typical Nuxt production deployment on serverless platforms requires: the Nuxt server function, a separate database service, a Redis provider for caching, a CDN for static assets, and separate monitoring for each service. Each piece has its own billing, its own dashboard, and its own failure modes.

CloudPloy gives you all of this on one server. Your Nuxt app, PostgreSQL database, Redis cache, file storage, and background worker all run together. One monthly bill, one dashboard, one place to check when something goes wrong.

Deploy additional services alongside your Vue frontend - a separate API service, a webhook processor, or an admin panel - all managed from the same CloudPloy project. SSH access means you can debug any process directly when logs alone are not enough.

Nuxt 3 Server Configuration

For Nuxt 3 apps in SSR mode, the built output runs as a Node.js HTTP server. Configure the port via the NITRO_PORT environment variable. CloudPloy's Nginx reverse proxy handles HTTPS termination and forwards requests to your Nitro server on the configured port.

// nuxt.config.ts
export default defineNuxtConfig({
  nitro: {
    preset: 'node-server',
    compressPublicAssets: true,
  },
  runtimeConfig: {
    // Server-only secrets
    dbUrl: process.env.DATABASE_URL,
    // Public (client + server)
    public: {
      apiBase: process.env.API_BASE_URL
    }
  }
})

Use runtimeConfig instead of hardcoded environment variable references in your Vue components. This ensures proper SSR/CSR hydration and makes it easy to manage secrets through CloudPloy's environment variable panel.

Caching and Performance

Nuxt 3's Nitro server has a built-in caching layer. Use the cachedEventHandler utility in your server routes to cache expensive database queries or external API calls. Combined with Redis as the cache driver, this dramatically reduces database load under traffic spikes.

// server/api/products.ts
export default cachedEventHandler(
  async (event) => {
    const products = await db.query(
      'SELECT * FROM products'
    )
    return products
  },
  {
    maxAge: 60 * 5, // 5 minutes
    name: 'products-list',
  }
)

Configure CloudPloy's Redis instance as Nuxt's cache storage by setting NUXT_REDIS_URL in your environment variables. Cached responses persist between server restarts, so your application warms up instantly after a deploy.