Skip to main content
Version: Next

Framework Integration Guides

Watt supports seamless integration with popular frontend frameworks and Node.js runtimes. Each framework integration provides built-in development tools, optimized builds, and deployment-ready configurations.

Choose the framework that best fits your project needs - whether you're building static sites, server-rendered applications, or complex Node.js services.

Frontend Frameworks​

Astro​

Modern static site generator with component hydration and built-in optimizations.

  • Overview - Getting started with Astro integration
  • Configuration - Complete configuration reference
  • Caching - Caching strategies and configuration

Next.js​

Full-stack React framework with server-side rendering and app router support.

Remix​

Full-stack web framework focused on web fundamentals and modern user experience.

  • Overview - Getting started with Remix integration
  • Configuration - Complete configuration reference
  • Caching - Caching strategies and configuration

Vite​

Fast build tool with hot module replacement for modern web projects.

Node.js Runtimes​

Node.js​

Generic Node.js stackable for custom applications and existing codebases.

NestJS​

Progressive Node.js framework for building scalable server-side applications.

Quick Start​

To add a framework to your Watt application:

  1. Add the stackable to your configuration:

    {
      "services": [
        {
          "id": "frontend",
          "path": "./frontend",
          "config": "platformatic.json"
        }
      ]
    }

  2. Create framework-specific configuration: Each framework has its own configuration file with framework-specific options and build settings.

  3. Run your application:

    watt start

Integration Features​

All framework integrations provide:

  • Development Mode - Hot reload and fast refresh during development
  • Production Builds - Optimized builds for deployment
  • Environment Configuration - Framework-specific environment variable handling
  • Logging Integration - Unified logging across all services
  • Metrics Collection - Built-in observability and monitoring
  • TypeScript Support - Full TypeScript integration where applicable

Need Help?​