Intlayer Dokumentation

Willkommen in der offiziellen Intlayer-Dokumentation! Hier finden Sie alles, was Sie benötigen, um Intlayer zu integrieren, zu konfigurieren und zu meistern – für all Ihre Internationalisierungs- (i18n) Anforderungen, egal ob Sie mit Next.js, React, Vite, Express oder einer anderen JavaScript-Umgebung arbeiten.

Einführung

Was ist Intlayer?

Intlayer ist eine Internationalisierungsbibliothek, die speziell für JavaScript-Entwickler entwickelt wurde. Sie ermöglicht die Deklaration Ihres Inhalts überall in Ihrem Code. Sie wandelt die Deklaration mehrsprachiger Inhalte in strukturierte Wörterbücher um, die sich leicht in Ihren Code integrieren lassen. Durch die Verwendung von TypeScript macht Intlayer Ihre Entwicklung robuster und effizienter.

Intlayer bietet außerdem einen optionalen visuellen Editor, mit dem Sie Ihre Inhalte einfach bearbeiten und verwalten können. Dieser Editor ist besonders nützlich für Entwickler, die eine visuelle Oberfläche für die Inhaltsverwaltung bevorzugen, oder für Teams, die Inhalte erstellen, ohne sich um den Code kümmern zu müssen.

Beispiel für die Verwendung

.└── Components    └── MyComponent        ├── index.content.ts        └── index.tsx

import { t, type Dictionary } from "intlayer";

const componentContent = {
  key: "component-key",
  content: {
    myTranslatedContent: t({
      en: "Hello World",
      es: "Hola Mundo",
      fr: "Bonjour le monde",
    }),
  },
} satisfies Dictionary;

// Exportiert den Komponenteninhalt als Standardexport
export default componentContent;

import type { FC } from "react";
import { useIntlayer } from "react-intlayer";

export const MyComponent: FC = () => {
  const { myTranslatedContent } = useIntlayer("component-key");

  return <span>{myTranslatedContent}</span>;
};

Hauptfunktionen

Intlayer bietet eine Vielzahl von Funktionen, die auf die Bedürfnisse der modernen Webentwicklung zugeschnitten sind. Nachfolgend sind die wichtigsten Funktionen mit Links zu detaillierter Dokumentation aufgeführt:

• Unterstützung für Internationalisierung: Erweitern Sie die globale Reichweite Ihrer Anwendung mit integrierter Unterstützung für Internationalisierung.
• Visueller Editor: Verbessern Sie Ihren Entwicklungsworkflow mit Editor-Plugins, die für Intlayer entwickelt wurden. Schauen Sie sich den Leitfaden für den visuellen Editor an.
• Konfigurationsflexibilität: Passen Sie Ihre Einrichtung mit umfangreichen Konfigurationsoptionen an, die im Konfigurationshandbuch detailliert beschrieben sind.
• Erweiterte CLI-Tools: Verwalten Sie Ihre Projekte effizient mit der Befehlszeilenschnittstelle von Intlayer. Entdecken Sie die Möglichkeiten in der CLI-Tools-Dokumentation.

Kernkonzepte

Wörterbuch

Organisieren Sie Ihre mehrsprachigen Inhalte nahe am Code, um alles konsistent und wartbar zu halten.

• Erste Schritte
  Lernen Sie die Grundlagen der Deklaration Ihrer Inhalte in Intlayer kennen.

• Übersetzung
  Verstehen Sie, wie Übersetzungen in Ihrer Anwendung generiert, gespeichert und genutzt werden.

• Aufzählung
  Verwalten Sie einfach wiederholte oder feste Datensätze über verschiedene Sprachen hinweg.

• Bedingung
  Lernen Sie, wie Sie bedingte Logik in Intlayer verwenden, um dynamische Inhalte zu erstellen.

• Einfügung
  Entdecken Sie, wie Sie Werte in einen String mit Einfügeplatzhaltern einfügen können.

• Funktionsabruf
  Erfahren Sie, wie Sie Inhalte dynamisch mit benutzerdefinierter Logik abrufen, um den Workflow Ihres Projekts anzupassen.

• Markdown
  Lernen Sie, wie Sie Markdown in Intlayer verwenden, um reichhaltige Inhalte zu erstellen.

• Dateieinbettungen
  Entdecken Sie, wie Sie externe Dateien in Intlayer einbetten, um sie im Content-Editor zu verwenden.

• Verschachtelung
  Verstehen Sie, wie Sie Inhalte in Intlayer verschachteln, um komplexe Strukturen zu erstellen.

Umgebungen & Integrationen

Wir haben Intlayer mit Blick auf Flexibilität entwickelt und bieten nahtlose Integration in beliebte Frameworks und Build-Tools:

• Intlayer mit Next.js 15
• Intlayer mit Next.js 14 (App Router)
• Intlayer mit Next.js Page Router
• Intlayer mit React CRA
• Intlayer mit Vite + React
• Intlayer mit React Native und Expo
• Intlayer mit Lynx und React
• Intlayer mit Express

Jeder Integrationsleitfaden enthält bewährte Methoden zur Nutzung der Intlayer-Funktionen wie Server-Side Rendering, dynamisches Routing oder Client-Side Rendering, damit Sie eine schnelle, SEO-freundliche und hoch skalierbare Anwendung aufrechterhalten können.

Beiträge & Feedback

Wir schätzen die Kraft von Open-Source und gemeinschaftsgetriebener Entwicklung. Wenn Sie Verbesserungen vorschlagen, einen neuen Leitfaden hinzufügen oder Fehler in unserer Dokumentation korrigieren möchten, können Sie gerne einen Pull Request einreichen oder ein Issue in unserem GitHub-Repository eröffnen.

Bereit, Ihre Anwendung schneller und effizienter zu übersetzen? Tauchen Sie in unsere Dokumentation ein, um noch heute mit Intlayer zu starten. Erleben Sie einen robusten, optimierten Ansatz zur Internationalisierung, der Ihre Inhalte organisiert und Ihr Team produktiver macht.