Rendering Strategien

# Vue 3 + Vite (Standard SPA)
npm create vue@latest my-app
cd my-app && npm install
npm run build        # → dist/ → auf beliebigen Webserver hochladen

# React + Vite
npm create vite@latest my-app -- --template react

// nuxt.config.ts
export default defineNuxtConfig({
  ssr: true,  // Standard in Nuxt 3

  routeRules: {
    '/dashboard/**': { ssr: false },  // SPA für Auth-Bereich
    '/api/**':        { cors: true }
  }
})

// Server starten via PM2
pm2 start "node .output/server/index.mjs" --name my-app

// index.php – Daten holen und direkt als HTML ausgeben
<?php
$stmt = $pdo->query('SELECT title, body FROM posts ORDER BY id DESC');
?>
<ul>
<?php foreach ($stmt as $post): ?>
  <li><?= htmlspecialchars($post['title']) ?></li>
<?php endforeach; ?>
</ul>

# Nginx – Anbindung an PHP-FPM (kein Node nötig)
location ~ \.php$ {
    fastcgi_pass unix:/run/php/php8.5-fpm.sock;
}

// nuxt.config.ts
export default defineNuxtConfig({
  ssr: true,

  routeRules: {
    '/**': { prerender: true }  // alle Routen statisch
  }
})

# Build ausführen
npx nuxi generate
# → .output/public/ = statische Dateien → auf Webserver hochladen

# VitePress (Docs)
npx vitepress build docs

// nuxt.config.ts
export default defineNuxtConfig({
  routeRules: {
    '/products/**': { isr: 3600 },    // jede Stunde regenerieren
    '/news/**':     { isr: 300 },     // alle 5 Minuten
    '/about':       { prerender: true }, // reines SSG
    '/dashboard':   { ssr: false }     // SPA
  }
})

// Next.js (Pages Router)
export async function getStaticProps() {
  return { props: { data }, revalidate: 60 } // 60s TTL
}