Dokumentacja Intlayer

Witamy w oficjalnej dokumentacji Intlayer! Tutaj znajdziesz wszystko, czego potrzebujesz, aby zintegrować, skonfigurować i opanować Intlayer dla wszystkich Twoich potrzeb związanych z internacjonalizacją (i18n), niezależnie od tego, czy pracujesz z Next.js, React, Vite, Express, czy w innym środowisku JavaScript.

Wprowadzenie

Czym jest Intlayer?

Intlayer to biblioteka internacjonalizacji zaprojektowana specjalnie dla programistów JavaScript. Pozwala ona na deklarowanie treści w dowolnym miejscu Twojego kodu. Przekształca deklaracje wielojęzycznych treści w ustrukturyzowane słowniki w celu ich łatwej integracji z Twoim kodem. Wykorzystując TypeScript, Intlayer sprawia, że Twoje tworzenie oprogramowania jest solidniejsze i bardziej wydajne.

Intlayer udostępnia również opcjonalny edytor wizualny, który pozwala w prosty sposób edytować i zarządzać treścią. Ten edytor jest szczególnie przydatny dla programistów, którzy preferują wizualny interfejs do zarządzania treścią, lub dla zespołów generujących treści bez konieczności przejmowania się kodem.

Przykład użycia

.
└── 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",
      pl: "Witaj świecie",
    }),
  },
} satisfies Dictionary;

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>;
};

Dlaczego Intlayer, a nie alternatywy?

W porównaniu do wiodących rozwiązań takich jak next-intl lub i18next, Intlayer to rozwiązanie, które ma zintegrowane optymalizacje, takie jak:

Główne funkcje

Intlayer oferuje szereg funkcji dostosowanych do potrzeb nowoczesnego tworzenia stron internetowych. Poniżej znajdują się kluczowe funkcje wraz z linkami do szczegółowej dokumentacji dla każdej z nich:

• Wsparcie dla internacjonalizacji: Zwiększ globalny zasięg swojej aplikacji dzięki wbudowanemu wsparciu dla internacjonalizacji.
• Edytor Wizualny: Usprawnij swój przepływ pracy za pomocą wtyczek edytora zaprojektowanych dla Intlayer. Sprawdź Przewodnik po Edytorze Wizualnym.
• Elastyczność Konfiguracji: Dostosuj swoją konfigurację za pomocą rozbudowanych opcji konfiguracyjnych, wyszczególnonych w Przewodniku po konfiguracji.
• Zaawansowane Narzędzia CLI: Zarządzaj efektywnie swoimi projektami przy użyciu interfejsu wiersza poleceń Intlayer. Odkryj możliwości w Dokumentacji Narzędzi CLI.

Kluczowe Koncepcje

Słownik (Dictionary)

Organizuj swoje wielojęzyczne treści w pobliżu kodu, aby zachować spójność i łatwość w utrzymaniu.

• Rozpocznij
  Poznaj podstawy deklarowania treści w Intlayer.

• Tłumaczenie (Translation)
  Zrozum, jak tłumaczenia są generowane, przechowywane i wykorzystywane w Twojej aplikacji.

• Wyliczenie (Enumeration)
  Łatwo zarządzaj powtarzalnymi lub stałymi zestawami danych w różnych językach.

• Warunek (Condition)
  Dowiedz się, jak stosować logikę warunkową w Intlayer, aby tworzyć dynamiczne treści.

• Wstawianie (Insertion)
  Odkryj, jak wstawiać wartości w łańcuch znaków przy użyciu znaczników (placeholders).

• Pobieranie przez Funkcje (Function Fetching)
  Zobacz, jak dynamicznie pobierać treść za pomocą niestandardowej logiki, aby dopasować ją do przepływu pracy Twojego projektu.

• Markdown
  Dowiedz się, jak używać Markdown w Intlayer, aby tworzyć wzbogacone teksty.

• Osadzanie Plików (File embeddings)
  Odkryj, jak osadzać zewnętrzne pliki w Intlayer, aby korzystać z nich w edytorze treści.

• Zagnieżdżanie (Nesting)
  Zrozum, jak zagnieżdżać treści w Intlayer, aby budować złożone struktury.

Środowiska i Integracje

Zbudowaliśmy Intlayer z myślą o elastyczności, oferując płynną integrację w obrębie popularnych frameworków i narzędzi do budowania:

• Intlayer z Next.js 16
• Intlayer z Next.js 15
• Intlayer z Next.js 14 (App Router)
• Intlayer z Next.js Page Router
• Intlayer z React CRA
• Intlayer z Vite + React
• Intlayer z React Router v7
• Intlayer z Tanstack Start
• Intlayer z React Native i Expo
• Intlayer z Lynx i React
• Intlayer z Vite + Preact
• Intlayer z Vite + Vue
• Intlayer z Nuxt
• Intlayer z Vite + Svelte
• Intlayer z SvelteKit
• Intlayer z Express
• Intlayer z NestJS
• Intlayer z Hono
• Intlayer z Angular

Każdy przewodnik integracyjny zawiera najlepsze praktyki korzystania z funkcji Intlayer, takich jak renderowanie po stronie serwera (SSR), dynamiczne routowanie, czy renderowanie po stronie klienta, dzięki czemu możesz utrzymać szybką, przyjazną dla SEO i wysoce skalowalną aplikację.

Wnoszenie Wkładu i Opinie

Cenimy siłę open-source i tworzenia oprogramowania opartego o społeczność. Jeśli chciałbyś zaproponować usprawnienia, dodać nowy poradnik lub poprawić błędy w naszych dokumentach, śmiało wyślij Pull Request lub otwórz Issue w naszym repozytorium GitHub.

Gotowy, aby tłumaczyć swoją aplikację szybciej i wydajniej? Zanurz się w naszej dokumentacji, aby rozpocząć korzystanie z Intlayer już dziś. Doświadcz solidnego, zoptymalizowanego podejścia do internacjonalizacji, które sprawi, że Twoje treści będą uporządkowane, a Twój zespół bardziej produktywny.

Często Zadawane Pytania