@intlayer/docs 5.5.8

package/de/packages/intlayer/index.md

@@ -0,0 +1,478 @@
+# intlayer: NPM-Paket zur Verwaltung eines mehrsprachigen Wörterbuchs (i18n)
+
+**Intlayer** ist eine Suite von Paketen, die speziell für JavaScript-Entwickler entwickelt wurde. Es ist kompatibel mit Frameworks wie React, Next.js und Express.js.
+
+**Das `intlayer`-Paket** ermöglicht es Ihnen, Ihre Inhalte überall in Ihrem Code zu deklarieren. Es konvertiert mehrsprachige Inhaltsdeklarationen in strukturierte Wörterbücher, die nahtlos in Ihre Anwendung integriert werden können. Mit TypeScript verbessert **Intlayer** Ihre Entwicklung, indem es stärkere und effizientere Werkzeuge bereitstellt.
+
+## Warum Intlayer integrieren?
+
+- **JavaScript-gesteuertes Content-Management**: Nutzen Sie die Flexibilität von JavaScript, um Ihre Inhalte effizient zu definieren und zu verwalten.
+- **Typensicheres Umfeld**: Nutzen Sie TypeScript, um sicherzustellen, dass alle Ihre Inhaltsdefinitionen präzise und fehlerfrei sind.
+- **Integrierte Inhaltsdateien**: Halten Sie Ihre Übersetzungen in der Nähe ihrer jeweiligen Komponenten, um Wartbarkeit und Klarheit zu verbessern.
+
+## Installation
+
+Installieren Sie das erforderliche Paket mit Ihrem bevorzugten Paketmanager:
+
+```bash packageManager="npm"
+npm install intlayer
+```
+
+```bash packageManager="pnpm"
+pnpm add intlayer
+```
+
+```bash packageManager="yarn"
+yarn add intlayer
+```
+
+### Intlayer konfigurieren
+
+Intlayer bietet eine Konfigurationsdatei, um Ihr Projekt einzurichten. Platzieren Sie diese Datei im Stammverzeichnis Ihres Projekts.
+
+```typescript fileName="intlayer.config.ts" codeFormat="typescript"
+import { Locales, type IntlayerConfig } from "intlayer";
+
+const config: IntlayerConfig = {
+  internationalization: {
+    locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
+    defaultLocale: Locales.ENGLISH,
+  },
+};
+
+export default config;
+```
+
+```javascript fileName="intlayer.config.mjs" codeFormat="esm"
+import { Locales } from "intlayer";
+
+/** @type {import('intlayer').IntlayerConfig} */
+const config = {
+  internationalization: {
+    locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
+    defaultLocale: Locales.ENGLISH,
+  },
+};
+
+export default config;
+```
+
+```javascript fileName="intlayer.config.cjs" codeFormat="commonjs"
+const { Locales } = require("intlayer");
+
+/** @type {import('intlayer').IntlayerConfig} */
+const config = {
+  internationalization: {
+    locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
+    defaultLocale: Locales.ENGLISH,
+  },
+};
+
+module.exports = config;
+```
+
+> Für eine vollständige Liste der verfügbaren Parameter lesen Sie die [Konfigurationsdokumentation](https://github.com/aymericzip/intlayer/blob/main/docs/de/configuration.md).
+
+## Beispiel für die Verwendung
+
+Mit Intlayer können Sie Ihre Inhalte strukturiert überall in Ihrem Code deklarieren.
+
+Standardmäßig scannt Intlayer nach Dateien mit der Erweiterung `.content.{json,ts,tsx,js,jsx,mjs,mjx,cjs,cjx}`.
+
+> Sie können die Standarderweiterung ändern, indem Sie die Eigenschaft `contentDir` in der [Konfigurationsdatei](https://github.com/aymericzip/intlayer/blob/main/docs/de/configuration.md) festlegen.
+
+```bash codeFormat="typescript"
+.
+├── intlayer.config.ts
+└── src
+    ├── ClientComponent
+    │   ├── index.content.ts
+    │   └── index.tsx
+    └── ServerComponent
+        ├── index.content.ts
+        └── index.tsx
+```
+
+```bash codeFormat="esm"
+.
+├── intlayer.config.mjs
+└── src
+    ├── ClientComponent
+    │   ├── index.content.mjs
+    │   └── index.mjx
+    └── ServerComponent
+        ├── index.content.mjs
+        └── index.mjx
+```
+
+```bash codeFormat="commonjs"
+.
+├── intlayer.config.cjs
+└── src
+    ├── ClientComponent
+    │   ├── index.content.cjs
+    │   └── index.cjx
+    └── ServerComponent
+        ├── index.content.cjs
+        └── index.cjx
+```
+
+### Inhalte deklarieren
+
+Hier ist ein Beispiel für eine Inhaltsdeklaration:
+
+```tsx fileName="src/ClientComponent/index.content.ts" codeFormat="typescript"
+// Importieren von Funktionen und Typen aus Intlayer
+import { t, type Dictionary } from "intlayer";
+
+// Deklaration der Inhalte für die Client-Komponente
+const clientComponentContent = {
+  key: "client-component",
+  content: {
+    myTranslatedContent: t({
+      en: "Hello World",
+      fr: "Bonjour le monde",
+      es: "Hola Mundo",
+    }),
+    numberOfCar: enu({
+      "<-1": "Weniger als minus ein Auto",
+      "-1": "Minus ein Auto",
+      "0": "Keine Autos",
+      "1": "Ein Auto",
+      ">5": "Einige Autos",
+      ">19": "Viele Autos",
+    }),
+  },
+} satisfies Dictionary;
+
+export default clientComponentContent;
+```
+
+```jsx fileName="src/ClientComponent/index.content.mjs" contentDeclarationFormat="esm"
+import { t } from "intlayer";
+
+/** @type {import('intlayer').Dictionary} */
+const clientComponentContent = {
+  key: "client-component",
+  content: {
+    myTranslatedContent: t({
+      en: "Hello World",
+      fr: "Bonjour le monde",
+      es: "Hola Mundo",
+    }),
+    numberOfCar: enu({
+      "<-1": "Weniger als minus ein Auto",
+      "-1": "Minus ein Auto",
+      "0": "Keine Autos",
+      "1": "Ein Auto",
+      ">5": "Einige Autos",
+      ">19": "Viele Autos",
+    }),
+  },
+};
+
+export default clientComponentContent;
+```
+
+```jsx fileName="src/ClientComponent/index.content.cjs" contentDeclarationFormat="commonjs"
+const { t } = require("intlayer");
+
+/** @type {import('intlayer').Dictionary} */
+const clientComponentContent = {
+  key: "client-component",
+  content: {
+    myTranslatedContent: t({
+      en: "Hello World",
+      fr: "Bonjour le monde",
+      es: "Hola Mundo",
+    }),
+    numberOfCar: enu({
+      "<-1": "Weniger als minus ein Auto",
+      "-1": "Minus ein Auto",
+      "0": "Keine Autos",
+      "1": "Ein Auto",
+      ">5": "Einige Autos",
+      ">19": "Viele Autos",
+    }),
+  },
+};
+
+module.exports = clientComponentContent;
+```
+
+```json fileName="src/ClientComponent/index.content.json" codeFormat="json"
+{
+  "key": "client-component",
+  "content": {
+    "myTranslatedContent": {
+      "nodeType": "translation",
+      "translation": {
+        "en": "Hello World",
+        "fr": "Bonjour le monde",
+        "es": "Hola Mundo"
+      }
+    },
+    "numberOfCar": {
+      "nodeType": "enumeration",
+      "enumeration": {
+        "<-1": "Weniger als minus ein Auto",
+        "-1": "Minus ein Auto",
+        "0": "Keine Autos",
+        "1": "Ein Auto",
+        ">5": "Einige Autos",
+        ">19": "Viele Autos"
+      }
+    }
+  }
+}
+```
+
+### Wörterbücher erstellen
+
+Sie können Ihre Wörterbücher mit dem [intlayer-cli](https://github.com/aymericzip/intlayer/blob/main/packages/intlayer-cli/readme.md) erstellen.
+
+```bash packageManager="npm"
+npx intlayer dictionaries build
+```
+
+```bash packageManager="yarn"
+yarn intlayer build
+```
+
+```bash packageManager="pnpm"
+pnpm intlayer build
+```
+
+Dieser Befehl scannt alle `*.content.*`-Dateien, kompiliert sie und schreibt die Ergebnisse in das Verzeichnis, das in Ihrer **`intlayer.config.ts`** angegeben ist (standardmäßig `./.intlayer`).
+
+Ein typisches Ergebnis könnte so aussehen:
+
+```bash
+.
+└── .intlayer
+    ├── dictionary  # Enthält das Wörterbuch Ihrer Inhalte
+    │   ├── client-component.json
+    │   └── server-component.json
+    ├── main  # Enthält den Einstiegspunkt Ihres Wörterbuchs zur Verwendung in Ihrer Anwendung
+    │   ├── dictionary.cjs
+    │   └── dictionary.mjs
+    └── types  # Enthält die automatisch generierten Typdefinitionen Ihres Wörterbuchs
+        ├── intlayer.d.ts  # Enthält die automatisch generierten Typdefinitionen von Intlayer
+        ├── client-component.d.ts
+        └── server-component.d.ts
+```
+
+### i18next-Ressourcen erstellen
+
+Intlayer kann so konfiguriert werden, dass Wörterbücher für [i18next](https://www.i18next.com/) erstellt werden. Dafür müssen Sie die folgende Konfiguration zu Ihrer `intlayer.config.ts`-Datei hinzufügen:
+
+```typescript fileName="intlayer.config.ts" codeFormat="typescript"
+import { Locales, type IntlayerConfig } from "intlayer";
+
+const config: IntlayerConfig = {
+  /* ... */
+  content: {
+    // Sagt Intlayer, dass Nachrichten-Dateien für i18next generiert werden sollen
+    dictionaryOutput: ["i18next"],
+
+    // Das Verzeichnis, in das Intlayer Ihre Nachrichten-JSON-Dateien schreibt
+    i18nextResourcesDir: "./i18next/resources",
+  },
+};
+```
+
+```typescript fileName="intlayer.config.mjs" codeFormat="esm"
+import { Locales } from "intlayer";
+
+/** @type {import('intlayer').IntlayerConfig} */
+const config = {
+  /* ... */
+  content: {
+    // Sagt Intlayer, dass Nachrichten-Dateien für i18next generiert werden sollen
+    dictionaryOutput: ["i18next"],
+
+    // Das Verzeichnis, in das Intlayer Ihre Nachrichten-JSON-Dateien schreibt
+    i18nextResourcesDir: "./i18next/resources",
+  },
+};
+
+export default config;
+```
+
+```javascript fileName="intlayer.config.cjs" codeFormat="commonjs"
+const { Locales } = require("intlayer");
+
+/** @type {import('intlayer').IntlayerConfig} */
+const config = {
+  /* ... */
+  content: {
+    // Sagt Intlayer, dass Nachrichten-Dateien für i18next generiert werden sollen
+    dictionaryOutput: ["i18next"],
+
+    // Das Verzeichnis, in das Intlayer Ihre Nachrichten-JSON-Dateien schreibt
+    i18nextResourcesDir: "./i18next/resources",
+  },
+};
+
+module.exports = config;
+```
+
+> Für eine vollständige Liste der verfügbaren Parameter lesen Sie die [Konfigurationsdokumentation](https://github.com/aymericzip/intlayer/blob/main/docs/de/configuration.md).
+
+Ausgabe:
+
+```bash
+.
+└── i18next
+    └── resources
+        ├── en
+        │   ├── client-component.json
+        │   └── server-component.json
+        ├── es
+        │   ├── client-component.json
+        │   └── server-component.json
+        └── fr
+            ├── client-component.json
+            └── server-component.json
+```
+
+Zum Beispiel könnte die Datei **en/client-component.json** so aussehen:
+
+```json fileName="intlayer/dictionary/en/client-component.json"
+{
+  "myTranslatedContent": "Hello World",
+  "zero_numberOfCar": "Keine Autos",
+  "one_numberOfCar": "Ein Auto",
+  "two_numberOfCar": "Zwei Autos",
+  "other_numberOfCar": "Einige Autos"
+}
+```
+
+### next-intl-Wörterbücher erstellen
+
+Intlayer kann so konfiguriert werden, dass Wörterbücher für [i18next](https://www.i18next.com/) oder [next-intl](https://github.com/formatjs/react-intl/tree/main/packages/next-intl) erstellt werden. Dafür müssen Sie die folgende Konfiguration zu Ihrer `intlayer.config.ts`-Datei hinzufügen:
+
+```typescript fileName="intlayer.config.ts" codeFormat="typescript"
+import { Locales, type IntlayerConfig } from "intlayer";
+
+const config: IntlayerConfig = {
+  /* ... */
+  content: {
+    // Sagt Intlayer, dass Nachrichten-Dateien für next-intl generiert werden sollen
+    dictionaryOutput: ["next-intl"],
+
+    // Das Verzeichnis, in das Intlayer Ihre Nachrichten-JSON-Dateien schreibt
+    nextIntlMessagesDir: "./i18next/messages",
+  },
+};
+```
+
+```typescript fileName="intlayer.config.mjs" codeFormat="esm"
+import { Locales } from "intlayer";
+
+/** @type {import('intlayer').IntlayerConfig} */
+const config = {
+  /* ... */
+  content: {
+    // Sagt Intlayer, dass Nachrichten-Dateien für next-intl generiert werden sollen
+    dictionaryOutput: ["next-intl"],
+
+    // Das Verzeichnis, in das Intlayer Ihre Nachrichten-JSON-Dateien schreibt
+    nextIntlMessagesDir: "./i18next/messages",
+  },
+};
+
+export default config;
+```
+
+```javascript fileName="intlayer.config.cjs" codeFormat="commonjs"
+const { Locales } = require("intlayer");
+
+/** @type {import('intlayer').IntlayerConfig} */
+const config = {
+  /* ... */
+  content: {
+    // Sagt Intlayer, dass Nachrichten-Dateien für next-intl generiert werden sollen
+    dictionaryOutput: ["next-intl"],
+
+    // Das Verzeichnis, in das Intlayer Ihre Nachrichten-JSON-Dateien schreibt
+    nextIntlMessagesDir: "./intl/messages",
+  },
+};
+
+module.exports = config;
+```
+
+> Für eine vollständige Liste der verfügbaren Parameter lesen Sie die [Konfigurationsdokumentation](https://github.com/aymericzip/intlayer/blob/main/docs/de/configuration.md).
+
+Ausgabe:
+
+```bash
+.
+└── intl
+    └── messages
+        ├── en
+        │   ├── client-component.json
+        │   └── server-component.json
+        ├── es
+        │   ├── client-component.json
+        │   └── server-component.json
+        └── fr
+            ├── client-component.json
+            └── server-component.json
+```
+
+Zum Beispiel könnte die Datei **en/client-component.json** so aussehen:
+
+```json fileName="intlayer/dictionary/en/client-component.json"
+{
+  "myTranslatedContent": "Hello World",
+  "zero_numberOfCar": "Keine Autos",
+  "one_numberOfCar": "Ein Auto",
+  "two_numberOfCar": "Zwei Autos",
+  "other_numberOfCar": "Einige Autos"
+}
+```
+
+## CLI-Tools
+
+Intlayer bietet ein CLI-Tool, um:
+
+- Ihre Inhaltsdeklarationen zu prüfen und fehlende Übersetzungen zu vervollständigen
+- Wörterbücher aus Ihren Inhaltsdeklarationen zu erstellen
+- entfernte Wörterbücher von Ihrem CMS in Ihr lokales Projekt zu übertragen und umgekehrt
+
+Lesen Sie [intlayer-cli](https://github.com/aymericzip/intlayer/blob/main/docs/de/intlayer_cli.md) für weitere Informationen.
+
+## Intlayer in Ihrer Anwendung verwenden
+
+Sobald Ihre Inhalte deklariert sind, können Sie Ihre Intlayer-Wörterbücher in Ihrer Anwendung verwenden.
+
+Intlayer ist als Paket für Ihre Anwendung verfügbar.
+
+### React-Anwendung
+
+Um Intlayer in Ihrer React-Anwendung zu verwenden, können Sie [react-intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/de/packages/react-intlayer/index.md) verwenden.
+
+### Next.js-Anwendung
+
+Um Intlayer in Ihrer Next.js-Anwendung zu verwenden, können Sie [next-intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/de/packages/next-intlayer/index.md) verwenden.
+
+### Express-Anwendung
+
+Um Intlayer in Ihrer Express-Anwendung zu verwenden, können Sie [express-intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/de/packages/express-intlayer/index.md) verwenden.
+
+## Von `intlayer` bereitgestellte Funktionen
+
+Das `intlayer`-Paket bietet auch einige Funktionen, die Ihnen helfen, Ihre Anwendung zu internationalisieren.
+
+- [`getConfiguration()`](https://github.com/aymericzip/intlayer/blob/main/docs/de/packages/intlayer/getConfiguration.md)
+- [`getTranslation()`](https://github.com/aymericzip/intlayer/blob/main/docs/de/packages/intlayer/getTranslation.md)
+- [`getEnumeration()`](https://github.com/aymericzip/intlayer/blob/main/docs/de/packages/intlayer/getEnumeration.md)
+- [`getLocaleName()`](https://github.com/aymericzip/intlayer/blob/main/docs/de/packages/intlayer/getLocaleName.md)
+- [`getLocaleLang()`](https://github.com/aymericzip/intlayer/blob/main/docs/de/packages/intlayer/getLocaleLang.md)
+- [`getHTMLTextDir()`](https://github.com/aymericzip/intlayer/blob/main/docs/de/packages/intlayer/getHTMLTextDir.md)
+- [`getPathWithoutLocale()`](https://github.com/aymericzip/intlayer/blob/main/docs/de/packages/intlayer/getPathWithoutLocale.md)
+- [`getMultilingualUrls()`](https://github.com/aymericzip/intlayer/blob/main/docs/de/packages/intlayer/getMultilingualUrls.md)
+- [`getLocalizedUrl()`](https://github.com/aymericzip/intlayer/blob/main/docs/de/packages/intlayer/getLocalizedUrl.md)
+- [`getPathWithoutLocale()`](https://github.com/aymericzip/intlayer/blob/main/docs/de/packages/intlayer/getPathWithoutLocale.md)

package/de/packages/intlayer-cli/index.md

@@ -0,0 +1,41 @@
+# intlayer-cli: NPM-Paket zur Verwendung der Intlayer-CLI
+
+**Intlayer** ist eine Suite von Paketen, die speziell für JavaScript-Entwickler entwickelt wurde. Es ist mit Frameworks wie React, React und Express.js kompatibel.
+
+Das **`intlayer-cli`**-Paket ist ein NPM-Paket, das das `@intlayer/cli`-Paket konsumiert und es für die `intlayer`-Befehlszeilenschnittstellen verfügbar macht.
+
+> Beachten Sie, dass dieses Paket nicht erforderlich ist, wenn das [`intlayer`](https://github.com/aymericzip/intlayer/tree/main/docs/de/packages/intlayer/index.md)-Paket installiert ist. Im Vergleich zum `intlayer`-Paket ist das `intlayer-cli`-Paket ein leichteres Paket, das nur das CLI-Tool ohne `@intlayer/core`-Abhängigkeiten enthält.
+
+## Installation
+
+Installieren Sie das erforderliche Paket mit Ihrem bevorzugten Paketmanager:
+
+```bash packageManager="npm"
+npm install intlayer-cli -g
+```
+
+```bash packageManager="pnpm"
+pnpm add intlayer-cli -g
+```
+
+```bash packageManager="yarn"
+yarn add intlayer-cli -g
+```
+
+## Verwendung
+
+Hier ein Beispiel, wie das `intlayer-cli`-Paket verwendet wird:
+
+```bash
+npx intlayer dictionaries build
+```
+
+## CLI-Befehle
+
+Intlayer bietet ein CLI-Tool, um:
+
+- Ihre Inhaltsdeklarationen zu prüfen und fehlende Übersetzungen zu vervollständigen
+- Wörterbücher aus Ihren Inhaltsdeklarationen zu erstellen
+- entfernte Wörterbücher von Ihrem CMS in Ihr lokales Projekt zu übertragen und umgekehrt
+
+Konsultieren Sie [intlayer-cli](https://github.com/aymericzip/intlayer/blob/main/docs/de/intlayer_cli.md) für weitere Informationen.

package/de/packages/intlayer-editor/index.md

@@ -0,0 +1,113 @@
+# intlayer-editor: NPM-Paket zur Verwendung des visuellen Intlayer-Editors
+
+**Intlayer** ist eine Suite von Paketen, die speziell für JavaScript-Entwickler entwickelt wurde. Es ist kompatibel mit Frameworks wie React, React und Express.js.
+
+Das **`intlayer-editor`**-Paket ist ein NPM-Paket, das den visuellen Intlayer-Editor in Ihr React-Projekt integriert.
+
+## Wie der Intlayer-Editor funktioniert
+
+Der Intlayer-Editor ermöglicht die Interaktion mit dem entfernten Intlayer-Wörterbuch. Er kann auf der Client-Seite installiert werden und Ihre Anwendung in einen CMS-ähnlichen Editor verwandeln, um den Inhalt Ihrer Website in allen konfigurierten Sprachen zu verwalten.
+
+![Intlayer Editor Interface](https://github.com/aymericzip/intlayer/blob/main/docs/assets/intlayer_editor_ui.png)
+
+## Installation
+
+Installieren Sie das erforderliche Paket mit Ihrem bevorzugten Paketmanager:
+
+```bash packageManager="npm"
+npm install intlayer-editor
+```
+
+```bash packageManager="pnpm"
+pnpm add intlayer-editor
+```
+
+```bash packageManager="yarn"
+yarn add intlayer-editor
+```
+
+### Konfiguration
+
+In Ihrer Intlayer-Konfigurationsdatei können Sie die Editor-Einstellungen anpassen:
+
+```typescript
+const config: IntlayerConfig = {
+  // ... andere Konfigurationseinstellungen
+  editor: {
+    enabled: process.env.INTLAYER_ENABLED === "true", // Wenn false, ist der Editor inaktiv und kann nicht aufgerufen werden.
+    // Client-ID und Client-Secret sind erforderlich, um den Editor zu aktivieren.
+    // Sie ermöglichen die Identifizierung des Benutzers, der den Inhalt bearbeitet.
+    // Sie können durch das Erstellen eines neuen Clients im Intlayer-Dashboard - Projekte (https://intlayer.org/dashboard/projects) erhalten werden.
+    clientId: process.env.INTLAYER_CLIENT_ID,
+    clientSecret: process.env.INTLAYER_CLIENT_SECRET,
+  },
+};
+```
+
+> Wenn Sie keine Client-ID und kein Client-Secret haben, können Sie diese durch das Erstellen eines neuen Clients im [Intlayer-Dashboard - Projekte](https://intlayer.org/dashboard/projects) erhalten.
+
+> Um alle verfügbaren Parameter zu sehen, lesen Sie die [Konfigurationsdokumentation](https://github.com/aymericzip/intlayer/blob/main/docs/de/configuration.md)
+
+Das `intlayer-editor`-Paket basiert auf Intlayer und ist für JavaScript-Anwendungen verfügbar, wie React (Create React App), Vite + React und Next.js.
+
+Für weitere Details zur Installation des Pakets siehe den entsprechenden Abschnitt unten:
+
+### Integration mit Next.js
+
+Für die Integration mit Next.js lesen Sie den [Setup-Guide](https://github.com/aymericzip/intlayer/blob/main/docs/de/intlayer_with_nextjs_15.md).
+
+### Integration mit Create React App
+
+Für die Integration mit Create React App lesen Sie den [Setup-Guide](https://github.com/aymericzip/intlayer/blob/main/docs/de/intlayer_with_create_react_app.md)
+
+### Integration mit Vite + React
+
+Für die Integration mit Vite + React lesen Sie den [Setup-Guide](https://github.com/aymericzip/intlayer/blob/main/docs/de/intlayer_with_vite+react.md)
+
+### Beispiel für die Integration
+
+Um den visuellen Intlayer-Editor in Ihr React-Projekt zu integrieren, folgen Sie diesen Schritten:
+
+- Importieren Sie die Intlayer-Editor-Komponente in Ihre React-Anwendung:
+
+  ```tsx fileName="src/App.jsx"
+  import { IntlayerEditorProvider } from "intlayer-editor";
+  import { IntlayerProvider } from "react-intlayer";
+
+  export default function App() {
+    return (
+      <IntlayerProvider>
+        <IntlayerEditorProvider>
+          <IntlayerEditor>{/* Ihr App-Inhalt hier */}</IntlayerEditor>
+        </IntlayerEditorProvider>
+      </IntlayerProvider>
+    );
+  }
+  ```
+
+- Importieren Sie die Intlayer-Editor-Stile in Ihre Next.js-Anwendung:
+
+  ```tsx fileName="src/app/[locale]/layout.jsx"
+  import { IntlayerEditorStyles } from "intlayer-editor";
+
+  export default async function RootLayout({ children, params }) {
+    const { locale } = await params;
+    return (
+      <IntlayerClientProvider locale={locale}>
+        <IntlayerEditorProvider>
+          <html lang={locale}>
+            <body className={IntlayerEditorStyles}>{children}</body>
+          </html>
+        </IntlayerEditorProvider>
+      </IntlayerClientProvider>
+    );
+  }
+  ```
+
+## Verwendung des Editors
+
+Wenn der Editor installiert, aktiviert und gestartet ist, können Sie jedes von Intlayer indizierte Feld anzeigen, indem Sie mit dem Cursor über Ihren Inhalt fahren.
+
+![Hovering over content](https://github.com/aymericzip/intlayer/blob/main/docs/assets/intlayer_editor_hover_content.png)
+
+Wenn Ihr Inhalt umrandet ist, können Sie ihn lange drücken, um die Bearbeitungsleiste anzuzeigen.

package/de/packages/lynx-intlayer/index.md

@@ -0,0 +1,58 @@
+**Intlayer** ist eine Suite von Paketen, die speziell für JavaScript-Entwickler entwickelt wurde. Es ist kompatibel mit Frameworks wie React, React und Express.js.
+
+**Das `lynx-intlayer`-Paket** ermöglicht es Ihnen, Ihre Vite-Anwendung zu internationalisieren. Es enthält das Metro-Plugin, um die Konfiguration über Umgebungsvariablen im [Lynx-Bundler](https://lynxjs.org/index.html) festzulegen.
+
+## Warum Ihre Lynx-Anwendung internationalisieren?
+
+Die Internationalisierung Ihrer Lynx-Anwendung ist entscheidend, um ein globales Publikum effektiv zu erreichen. Sie ermöglicht es Ihrer Anwendung, Inhalte und Nachrichten in der bevorzugten Sprache jedes Benutzers bereitzustellen. Diese Fähigkeit verbessert die Benutzererfahrung und erweitert die Reichweite Ihrer Anwendung, indem sie für Menschen aus verschiedenen sprachlichen Hintergründen zugänglicher und relevanter wird.
+
+## Konfiguration
+
+Das `lynx-intlayer`-Paket arbeitet nahtlos mit dem [`react-intlayer`-Paket](https://github.com/aymericzip/intlayer/blob/main/docs/de/packages/react-intlayer/index.md) und dem [`intlayer`-Paket](https://github.com/aymericzip/intlayer/blob/main/docs/de/packages/intlayer/index.md) zusammen. Schauen Sie sich die entsprechende Dokumentation für weitere Informationen an.
+
+## Installation
+
+Installieren Sie das notwendige Paket mit Ihrem bevorzugten Paketmanager:
+
+```bash packageManager="npm"
+npm install lynx-intlayer
+```
+
+```bash packageManager="yarn"
+yarn add lynx-intlayer
+```
+
+```bash packageManager="pnpm"
+pnpm add lynx-intlayer
+```
+
+## Beispiel für die Nutzung
+
+Sehen Sie ein Beispiel, wie die Plugins in Ihre Vite-Konfiguration eingebunden werden können.
+
+```ts
+// lynx.config.ts
+import { defineConfig } from "@lynx-js/rspeedy";
+import { pluginIntlayerLynx } from "lynx-intlayer/plugin";
+
+export default defineConfig({
+  plugins: [
+    // ... andere Plugins
+    pluginIntlayerLynx(),
+  ],
+});
+```
+
+## Beherrschen der Internationalisierung Ihrer Vite-Anwendung
+
+Intlayer bietet viele Funktionen, um Ihnen bei der Internationalisierung Ihrer Vite-Anwendung zu helfen.
+
+**Um mehr über diese Funktionen zu erfahren, lesen Sie den [React-Internationalisierung (i18n) mit Intlayer und Lynx](https://github.com/aymericzip/intlayer/blob/main/docs/de/intlayer_with_lynx+react.md)-Leitfaden für Lynx-Anwendungen.**
+
+## Lesen Sie mehr über Intlayer
+
+- [Intlayer Website](https://intlayer.org)
+- [Intlayer Dokumentation](https://intlayer.org/doc)
+- [Intlayer GitHub](https://github.com/aymericzip/intlayer)
+
+- [Stellen Sie Ihre Fragen an unsere intelligente Dokumentation](https://intlayer.org/docchat)