ベストプラクティス

悪い翻訳を得る最も早い方法は、回避可能なアプリ構造の問題を避けるためにランタイムを調整することです。

実際のコンテキスト名を使用する

良いコンテキストキーは、コピーがどこに存在するかを説明します:

tsx
'use client';
 
import { Ways } from '@18ways/react';
 
export function AppPage() {
  return (
    <>
      <Ways context="checkout.payment-form">
        <PaymentForm />
      </Ways>
      <Ways context="dashboard.billing-history">
        <BillingHistory />
      </Ways>
      <Ways context="marketing.pricing-hero">
        <PricingHero />
      </Ways>
    </>
  );
}

Avoid anonymous buckets like page1, copy, or misc.

完全な考えを翻訳する

良い:

tsx
'use client';
 
import Link from 'next/link';
import { T } from '@18ways/react';
 
export function InvoiceLink() {
  return (
    <T>
      Download your latest invoice as{' '}
      <Link href="/invoices/latest.pdf">PDF</Link>
    </T>
  );
}

避けるべきこと:

18waysは、一般的なリンクケースを1つのメッセージとして処理できます。 <T><a href="#">ここをクリック</a>してもっと見る</T>は、分割されて再接続されるのではなく、1つの文としてそのままにしておくべきです。

tsx
import { T } from '@18ways/react';
 
export function InvoiceLink() {
  return (
    <>
      <T>Download</T>{' '}
      <T>your latest invoice</T>{' '}
      <T>as PDF</T>
    </>
  );
}

パッケージの境界を明確に保つ

  • Next.jsを使用している場合は、@18ways/nextを使用してロケールの解決とメタデータを処理してください。
  • Reactのみを使用している場合は、アプリ内でロケール状態を保持し、@18ways/reactを使用してください。
  • Reactの外にいる場合は、@18ways/coreを使用して、UI統合を自分で管理してください。

ルーティングをあなたの製品に合わせてください

公開マーケティングページは通常、SEOのためにパスベースのロケールルーティングを必要とします。内部ダッシュボードや内部ツールのルートは、しばしばそうではありません。だからこそ、現在のサイトでは/dashboard、/__design、および/__emailをパスルーティングから除外しています。

ソースコピーを人間らしく保つ

18waysは、ソーステキストが圧縮された翻訳キーのようではなく、実際の製品コピーのように読まれるときに最も効果的です。

良いソースコピーはモデルにより良いコンテキストを提供し、あなたのチームにコード内で読みやすいものを提供します。