Nexus.js

Full-stack framework — islands-first HTML, Svelte 5 runes, server actions, file-based routes, streaming SSR, and production-ready deployment.

Website — nexusjs.dev · Documentation · Examples · Changelog

🚀 What is Nexus?

Nexus is a security-first, production-ready web framework that combines:

• 🏝️ Islands Architecture — Ship minimal JavaScript; only hydrate interactive components
• ⚡ Svelte 5 Runes — $state, $derived, $effect for reactive UI
• 🔒 Built-in Security — CSRF protection, CSP headers, rate limiting, Shield-lite, Vault
• 📡 Server Actions — Type-safe RPC without API routes
• 🗂️ File-based Routing — +page.nx, +layout.nx, [params]
• 🌊 Streaming SSR — First byte in <50ms with suspense boundaries
• 📦 GraphQL Integration — Shield-protected API with complexity analysis
• 🔄 Legacy Bridge — Migrate Express/Node apps gradually with zero downtime

Why Nexus?

Most frameworks force you to choose between simplicity and production-readiness. Nexus gives you both:

• Start simple — Create a page in 10 lines, no boilerplate
• Scale securely — Built-in CSRF, XSS prevention, secret management
• Migrate safely — Wrap existing Express apps, proxy legacy backends
• Deploy anywhere — Docker, VPS, serverless (edge runtime coming soon)

Quick Start

Create a new app

npm create @nexus_js/nexus my-app
cd my-app
npm install
npm run dev

Visit http://localhost:3000 and start building!

Your first page

Create src/routes/+page.nx:

---
// Server-only code (runs once per request)
const greeting = "Hello, Nexus!";

export async function load(ctx) {
  return { user: { name: "Developer" } };
}
---

<h1>{greeting}</h1>
<p>Welcome, {pretext.user.name}</p>

<!-- Interactive island -->
<div client:load>
  <script>
    let count = $state(0);
  </script>
  <button onclick={() => count++}>
    Clicked {count} times
  </button>
</div>

<style>
  h1 { color: #5b21b6; }
  button {
    padding: 0.5rem 1rem;
    background: #5b21b6;
    color: white;
    border: none;
    border-radius: 0.375rem;
    cursor: pointer;
  }
</style>

Core Features

🏝️ Islands Architecture

Ship only the JavaScript you need. Static HTML by default, JavaScript where needed:

<!-- Static -->
<h1>Fast, SEO-friendly content</h1>

<!-- Interactive island (hydrates in browser) -->
<div client:load>
  <script>
    let open = $state(false);
  </script>
  <button onclick={() => open = !open}>Toggle</button>
  {#if open}<p>Dynamic content</p>{/if}
</div>

Hydration strategies: client:load, client:idle, client:visible, client:media="(min-width: 768px)"

🔒 Security by Default

No configuration needed — security is built-in:

• ✅ CSRF Protection — Automatic token validation
• ✅ Content Security Policy — XSS prevention out of the box
• ✅ Rate Limiting — Per-action throttling
• ✅ Secret Management — Vault with hot-reload rotation
• ✅ Input Validation — Zod integration for type-safe forms
• ✅ Signed Actions — Prevent action replay attacks

📡 Server Actions

Type-safe backend calls without writing API routes:

---
import { z } from 'zod';

export async function createPost(formData, ctx) {
  // Rate limiting built-in
  if (!ctx.rateLimit('createPost', { max: 10, window: 60_000 })) {
    return { error: 'Too many requests', status: 429 };
  }

  // Validation with Zod
  const result = z.object({
    title: z.string().min(3),
    content: z.string().min(10),
  }).safeParse({
    title: formData.get('title'),
    content: formData.get('content'),
  });

  if (!result.success) return { error: 'Invalid input' };

  await db.posts.create(result.data);
  return { redirect: '/posts' };
}
---

<form method="post" action="/_nexus/action/createPost">
  <input name="title" required />
  <textarea name="content" required></textarea>
  <button type="submit">Create Post</button>
</form>

📦 GraphQL with Shield

Production-ready GraphQL with built-in security:

import { createGraphQLHandler } from '@nexus_js/graphql';
import { nexusVault } from '@nexus_js/security';

const handler = createGraphQLHandler({
  schema,
  shield: {
    maxCost: 500,        // Prevent expensive queries
    maxDepth: 8,         // Limit nesting
    allowIntrospection: false,
  },
  mask: {
    'User.passwordHash': null,      // Redact sensitive fields
    'User.apiKey': (val, ctx) => 
      ctx.user?.role === 'admin' ? val : null,
  },
  rateLimit: { max: 60, windowMs: 60_000 },
});

// Mount at /graphql
export default {
  server: {
    mounts: [{ path: '/graphql', handler }],
  },
};

🔄 Legacy Bridge

Migrate existing backends without downtime:

import { createRemoteExecutor, wrapExpressMiddleware } from '@nexus_js/graphql';

// Proxy to old GraphQL API
const legacyApi = createRemoteExecutor({
  url: 'https://old-api.company.com/graphql',
  headers: { 'x-api-key': vault.get('LEGACY_KEY') },
});

// Wrap Express middleware as Nexus action
export const legacyPayment = wrapExpressMiddleware(oldExpressHandler);

// HTTP fallback proxy
export default {
  server: {
    fallbackProxy: 'http://localhost:8080', // Old backend
  },
};

Examples

This repository includes production-ready examples:

• paylinks-saas — Payment link generator with Stripe, QR codes, and Vault UI
• basic — Minimal starter
• pokedex — Islands, forms, API integration
• nexusflow — Advanced routing patterns

Run any example:

cd examples/paylinks-saas
pnpm install
pnpm dev

Deployment

Docker (Recommended)

# Build image
docker build -t my-nexus-app .

# Run with docker-compose
docker-compose up -d

Manual Deployment

# Build for production
npm run build

# Start server
NODE_ENV=production npm start

Environment Variables

# Required
NEXUS_SECRET="your-32-character-secret"
DATABASE_URL="postgresql://..."

# Optional
NEXUS_PORT=3000
STRIPE_SECRET_KEY="sk_live_..."

See Deployment Guide for VPS, Docker, and CI/CD setup.

Monorepo Structure

nexus/
├── packages/
│   ├── cli/               # nexus dev, build, studio
│   ├── server/            # HTTP server, SSR, actions
│   ├── compiler/          # .nx parser & codegen
│   ├── runtime/           # Client-side (islands, navigation)
│   ├── graphql/           # GraphQL integration (NEW in 0.9.3)
│   ├── security/          # Vault, Shield, CSRF
│   ├── router/            # File-based routing
│   └── ...                # 20+ packages total
├── examples/
│   ├── paylinks-saas/     # Full SaaS example
│   ├── basic/
│   └── pokedex/
└── docs/                  # Contributor guides

Development

Requirements: Node.js ≥22, pnpm ≥9

# Clone repo
git clone https://github.com/bierfor/nexus.git
cd nexus

# Install dependencies
pnpm install

# Build all packages
pnpm build

# Run tests
pnpm test

# Start example
pnpm example

See CONTRIBUTING.md for detailed development guide.

Documentation

• Official Docs — Complete framework guide
• Learn — Interactive tutorials
• API Reference — Package documentation
• Changelog — Release notes

Community & Support

• GitHub Issues — Bug reports & feature requests
• Buy Me a Coffee — Support development

License

MIT © 2024-2026 Nexus.js Contributors

See LICENSE for details.

Feature snapshot

Contributing

Issues and pull requests are welcome. See CONTRIBUTING.md (setup, structure, commits, tests). To replace or recreate the GitHub remote with a clean tree only, follow docs/REPOSITORY.md.

License

MIT — see LICENSE.