Enterprise Security, Observability & Zero-Config Vercel Deployments 🚀

Massive milestone for x (@thexjs)! Over the past few days, I’ve shipped major core upgrades focused on turning @thexjs from a fast Bun React engine into an Enterprise-Grade Full-Stack Framework.

Here is a breakdown of everything added in the latest updates! 👇

1. ⚡ Vercel Build Output API v3 Adapter (@thexjs/adapter-vercel)

Deploying to Vercel is now zero-config. Instead of relying on legacy runtime hacks or manual vercel.json overrides, @thexjs/adapter-vercel hooks directly into the build pipeline to generate a clean .vercel/output/ directory:

• Edge Static Assets: Client-side hydration bundles & media served straight from Vercel’s global CDN (.vercel/output/static/).

• Standalone SSR Serverless Bundle: SSR routes and Server Actions inlined into a standalone Node.js-compatible ESM bundle (.vercel/output/functions/render.func/).

• Automated Routing Manifest: Generates config.json rules routing static files first, with SSR fallbacks.

1. 🛡️ Hardened Security Core

Security in production isn’t optional. @thexjs/core now comes pre-configured with essential security guardrails out of the box:

• 🔒 Build-Time Env Isolation (EnvLeakageError): The bundler strictly checks client bundles. If any server-only env variable (e.g., STRIPE_SECRET_KEY, DATABASE_URL) without the THEXJS_PUBLIC_ prefix leaks into client code, the build instantly halts.

• 🛑 Server Action CSRF Protection: All requests hitting /__x/actions/* are automatically verified for Origin and Referer headers, with support for double-submit cookie tokens.

• 🛡️ Native Security Headers & Rate Limiting: Built-in helpers for CSP, HSTS, X-Frame-Options, and a configurable in-memory rate limiter to protect endpoints against brute-force/DDoS attacks.

1. 📊 Enterprise Observability

Production servers shouldn’t be black boxes. I added production-ready tracing & monitoring:

• 📝 Structured JSON Logging: Replaced raw console.log output with structured JSON logs (timestamp, requestId, status, durationMs) ready for ingestion by Datadog, Loki, or Grafana.

• 🩺 Kubernetes / Container Probes (/healthz & /readyz): Native endpoints served ahead of all route matching so orchestrators can test process liveness and DB readiness.

• 🚨 APM Error Tracing (Sentry & OpenTelemetry): Added createSentryReporter & createOtelReporter hooks to automatically capture uncaught SSR or action errors in production.

🛠️ Updated @thexjs/core Config Example

Here’s how clean configuring security and observability looks now:

import { createApp, createSentryReporter } from "@thexjs/core";

const app = createApp({
  pagesDir: "./src/pages",
  actionsDir: "./src/actions",
  security: {
    csrf: { allowedOrigins: ["https://app.example.com"] },
    headers: { contentSecurityPolicy: "default-src 'self'" },
    rateLimit: { limit: 100, windowMs: 60_000 },
  },
  observability: {
    logging: true,
    errorReporter: createSentryReporter(Sentry),
    health: { checks: { database: () => db.ping() } },
  },
});