Dokumentacja Intlayer

Witamy w oficjalnej dokumentacji Intlayer! Znajdziesz tutaj 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 innym środowiskiem JavaScript.

Wprowadzenie

Czym jest Intlayer?

Intlayer to biblioteka do internacjonalizacji zaprojektowana specjalnie dla programistów JavaScript. Pozwala na deklarowanie Twoich treści w dowolnym miejscu w kodzie. Przekształca deklaracje wielojęzycznych treści w ustrukturyzowane słowniki, które można łatwo zintegrować w Twoim kodzie. Korzystając z TypeScript, Intlayer sprawia, że Twój rozwój jest silniejszy i bardziej efektywny.

Intlayer oferuje również opcjonalny edytor wizualny, który pozwala łatwo edytować i zarządzać Twoimi treściami. Ten edytor jest szczególnie przydatny dla programistów, którzy wolą wizualny interfejs do zarządzania treścią, lub dla zespołów generujących treści bez konieczności martwienia się o kod.

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",
    }),
  },
} satisfies Dictionary; // spełnia typ Dictionary (słownik)

export default componentContent; // eksportuje zawartość komponentu

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

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

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

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: Ulepsz swój proces tworzenia dzięki wtyczkom do edytorów zaprojektowanym dla Intlayer. Sprawdź Przewodnik po edytorze wizualnym.
• Elastyczność konfiguracji: Dostosuj swoje środowisko za pomocą rozbudowanych opcji konfiguracyjnych opisanych w Przewodniku po konfiguracji.
• Zaawansowane narzędzia CLI: Zarządzaj swoimi projektami efektywnie, korzystając z interfejsu wiersza poleceń Intlayer. Poznaj możliwości w Dokumentacji narzędzi CLI.

Podstawowe koncepcje

Słownik

Organizuj swoje wielojęzyczne treści blisko kodu, aby wszystko było spójne i łatwe w utrzymaniu.

• Pierwsze kroki
  Poznaj podstawy deklarowania treści w Intlayer.

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

• Enumeracja
  Łatwo zarządzaj powtarzającymi się lub stałymi zestawami danych w różnych językach.

• Warunek
  Naucz się, jak używać logiki warunkowej w Intlayer, aby tworzyć dynamiczne treści.

• Wstawianie
  Odkryj, jak wstawiać wartości do ciągu znaków za pomocą symboli zastępczych wstawiania.

• Pobieranie funkcji
  Zobacz, jak dynamicznie pobierać zawartość za pomocą niestandardowej logiki, aby dopasować ją do przepływu pracy Twojego projektu.

• Markdown
  Naucz się, jak używać Markdown w Intlayer do tworzenia bogatej zawartości.

• Osadzanie plików
  Odkryj, jak osadzać zewnętrzne pliki w Intlayer, aby używać ich w edytorze treści.

• Zagnieżdżanie
  Zrozum, jak zagnieżdżać zawartość w Intlayer, aby tworzyć złożone struktury.

Środowiska i integracje

Intlayer został zaprojektowany z myślą o elastyczności, oferując bezproblemową integrację z popularnymi frameworkami i narzędziami 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 Express
• Intlayer z NestJS
• Intlayer z Angular

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

Współtworzenie i opinie

Cenimy siłę open-source i rozwój oparty na społeczności. Jeśli chcesz zaproponować ulepszenia, dodać nowy przewodnik lub poprawić jakiekolwiek problemy w naszej dokumentacji, śmiało zgłoś Pull Request lub otwórz issue w naszym repozytorium GitHub.

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

Współtworzenie i opinie

Cenimy siłę open-source i rozwój oparty na społeczności. Jeśli chcesz zaproponować ulepszenia, dodać nowy przewodnik lub poprawić jakiekolwiek błędy w naszej dokumentacji, śmiało zgłoś Pull Request lub otwórz issue w naszym repozytorium GitHub.

Gotowy, aby tłumaczyć swoją aplikację szybciej i efektywniej? Zanurz się w naszej dokumentacji i zacznij korzystać z Intlayer już dziś. Doświadcz solidnego, usprawnionego podejścia do internacjonalizacji, które pozwala utrzymać porządek w treściach i zwiększa produktywność Twojego zespołu.