DocTunesPro
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)
1import { NextRequest, NextResponse } from 'next/server'
2
3const 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
8export 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
23export 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-NameWertZweck
X-Translation-Modesub-directoryWeist die MultiLipi-Übersetzungs-Engine an, die Locale aus dem führenden Pfad zu parsen.
X-Original-Hostdivanshu.doctunes.ioGibt 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 (
    

      
Installation

      
    

  )
}

API-Referenz

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

GET /api/v1/locales200 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