# Docs
**Source:** https://de.divanshu.doctunes.io/docs
**Language:** German

---

Dokumentationsindex

Live-Tests benötigt? 

Testen Sie Ihre Sub-Proxy-Rewrite-Pfade in unserem Live-Routen-Simulator.

Spielwiese öffnen →

Next.js 15 App Router •TypeScript •Multilipi Gateway

# DocTunes Dokumentations-Starter-Kit

Vollständige Anleitung zur Erstellung moderner Entwicklerdokumentationen, zur Konfiguration von Edge-Routing-Middleware und zur Einrichtung automatisierter mehrsprachiger Sub-Proxy-Übersetzungen.

## Erste Schritte

Um Ihr neues Dokumentationsportal mit unserem TypeScript-Starter-Kit zu starten, führen Sie den folgenden Befehl in Ihrem Terminal aus:

Terminalbefehl

```
# Klonen und Abhängigkeiten installieren
git clone https://github.com/doctunes/documentation-starter-kit.git my-docs
cd my-docs
npm install

# Entwicklungsserver auf localhost:3000 starten
npm run dev
```

Projektverzeichnisstruktur: 

- **middleware.ts** — Globaler mehrsprachiger Sub-Proxy-Rewrite-Handler
- **app/layout.tsx** — Globale HTML-Shell, Schriftartdeklarationen und Navigations-/Fußzeile
- **app/page.tsx** — Landing Page & Interaktive Hero
- **app/docs/page.tsx** — Haupt-Dokumentations-Hub
- **app/playground/page.tsx** — Interaktiver Routing-Simulator
- **components/** — Wiederverwendbare CodeBlock, Navbar, SearchModal usw.

## Mehrsprachige Middleware

Das Herzstück unserer Internationalisierungs-Engine ist die Edge `middleware.ts` im Stammverzeichnis des Projekts platziert. Sie fängt alle eingehenden Anfragen ab, prüft gegen einen Regex für über 80 Sprachpräfixe und schreibt die Anfrage sicher an den Übersetzungs-Proxy um.

middleware.ts (Root Edge Middleware)

```
|  |  |
| --- | --- |
| 1 | import { NextRequest, NextResponse } from 'next/server' |
| 2 |  |
| 3 | const LANGUAGE_PATH = new RegExp( |
| 4 | '^/(?:mn-mong|sr-cyrl|sr-latn|zh-hans|zh-hant|es-419|en-us|en-gb|en-ca|en-au|fr-fr|fr-ca|fr-be|fr-ch|de-de|de-at|de-ch|pt-pt|pt-br|es-es|mww|af|sq|am|ar|hy|as|az|ba|eu|bn|bs|pt|bg|ca|hr|cs|da|dv|nl|en|et|fo|fj|fl|fi|fr|gl|ka|de|el|gu|ht|ha|he|hi|hu|is|ig|id|iu|ga|it|ja|kn|kk|rw|ko|ku|ky|lo|lv|ln|lt|lg|mk|mg|ms|ml|mt|mr|ne|no|or|ps|fa|pl|pa|ro|ru|sm|sd|si|sk|sl|so|es|sw|sv|ty|ta|tt|te|th|bo|ti|to|tr|tk|uk|ur|ug|uz|vi|cy|xh|yo|zu)(?:/|$)', |
| 5 | 'i' |
| 6 | ) |
| 7 |  |
| 8 | export function middleware(request: NextRequest) { |
| 9 | if (!LANGUAGE_PATH.test(request.nextUrl.pathname)) { |
| 10 | return NextResponse.next() |
| 11 | } |
| 12 |  |
| 13 | const destination = new URL( |
| 14 | request.nextUrl.pathname + request.nextUrl.search, |
| 15 | 'https://sub-proxy.Multilipi.com' |
| 16 | ) |
| 17 | const headers = new Headers(request.headers) |
| 18 | headers.set('X-Translation-Mode', 'sub-directory') |
| 19 | headers.set('X-Original-Host', 'divanshu.doctunes.io') |
| 20 | return NextResponse.rewrite(destination, { request: { headers } }) |
| 21 | } |
| 22 |  |
| 23 | export const config = { matcher: '/:path*' } |
```

Wie Rewrites funktionieren 

Im Gegensatz zu Standard-HTTP-301/302-Weiterleitungen `NextResponse.rewrite()` modifiziert den Backend-Proxy-Ursprung, während die exakte URL in der Adressleiste des Benutzerbrowsers vollständig intakt bleibt.

## Sub-Proxy-Header

Beim Umschreiben auf `https://sub-proxy.multilipi.com`, werden zwei obligatorische Header eingefügt, um eine genaue Mandantenisolierung und den Übersetzungsmodus zu gewährleisten:

| Header-Name | Wert | Zweck |
| --- | --- | --- |
| X-Translation-Mode | sub-directory | Weist die Multilipi-Übersetzungs-Engine an, die Locale aus dem führenden Pfad zu parsen. |
| X-Original-Host | divanshu.doctunes.io | Gibt die registrierte Ursprungsdomäne für SSL- und Lizenzvalidierung an. |

## Unterstützte Locales (80+)

Der reguläre Ausdruck behandelt sowohl generische zweibuchstabige Sprachcodes (z. B. `es` , `de` , `fr` ) als auch lokalisierte regionale Dialekt-Tags (z. B. `zh-hans` , `pt-br` , `sr-cyrl` ):

/en-us /

/es-es /

/fr-fr /

/de-de /

/zh-hans /

/zh-hant /

/ja /

/hi /

/ar /

/pt-br /

/ru /

/ko /

/it /

/nl /

/sv /

/pl /

/tr /

/vi /

/th /

/el /

/cs /

/da /

/fi /

/he /

+ über 50 weitere globale Sprachen, die dynamisch abgeglichen werden.

## UI-Komponenten & Codeblöcke

Jede Seite enthält vorformatierte Dark-Mode-UI-Komponenten wie kopierbare Codeblöcke, reaktionsfähige Tabellen, Callout-Banner und modale Dialoge.

components/ExampleUsage.tsx

```
import CodeBlock from '@/components/CodeBlock'

export default function MyDocs() {
  return (
    <div className="space-y-4">
      <h3>Installation</h3>
      <CodeBlock 
        code="npm install @doctunes/core" 
        language="bash" 
        showLineNumbers 
      />
    </div>
  )
}
```

## API-Referenz

DocTunes bietet REST- & Edge-Hilfsfunktionen zur programmatischen Inspektion von Locale-Konfigurationen:

GET /api/v1/locales 200 OK

Gibt die Liste der aktiven Sub-Proxy-Locales, den Status und den Zielhostnamen zurück.

json

```
{
  "status": "online",
  "gateway": "https://sub-proxy.Multilipi.com",
  "originalHost": "divanshu.doctunes.io",
  "totalLocales": 84,
  "defaultLocale": "en"
}
```

## Bereitstellungsanleitung

Stellen Sie Ihr Projekt sofort auf Vercel, AWS Amplify, Cloudflare Pages oder selbst gehosteten Docker-Containern bereit:

Vercel CLI Bereitstellung

```
# Bereitstellung für die Produktion mit benutzerdefinierter Umgebung
npx vercel --prod
```