React i18n tanpa kunci terjemahan

Sebagian besar pustaka React i18n bekerja dengan kunci terjemahan. Anda mengganti setiap teks di aplikasi Anda dengan kunci, menyimpan file terjemahan untuk setiap bahasa, dan mencari teks yang tepat saat runtime. Magic Translate melewatkan semua itu: Anda menulis teks Anda dalam bahasa Anda sendiri, dan itu diterjemahkan ketika halaman ditampilkan.

Cara kerja i18n dengan kunci terjemahan

Dengan perpustakaan berbasis kunci, tombol sederhana terlihat seperti ini:

// en.json
{ "checkout.button": "Continue to payment" }

// de.json
{ "checkout.button": "Weiter zur Zahlung" }

// Checkout.tsx
<button>{t('checkout.button')}</button>

Setiap teks baru berarti kunci baru, entri di setiap file bahasa dan terjemahan untuk setiap bahasa. Ketika Anda mengubah teks bahasa Inggris, bahasa lain sudah ketinggalan zaman sampai seseorang menerjemahkannya lagi.

Tombol yang sama tanpa kunci

Dengan Magic Translate, teks tetap di tempatnya:

import { T } from '@magic-translate/react';

<button>
  <T>Continue to payment</T>
</button>

Tidak ada file bahasa untuk dipelihara. Saat Anda mengubah teks, versi baru diterjemahkan saat berikutnya ditampilkan, dan terjemahan di-cache sejak saat itu.

Memulai

1. Mendaftar untuk Magic Translate dan dapatkan kunci API Anda. Paket gratis mencakup 5.000 karakter per bulan.
2. Instal klien dan bungkus aplikasi Anda di MagicTranslateProvider, seperti yang ditunjukkan dalam panduan React.
3. Bungkus teks Anda di <T>. Untuk props dan atribut, gunakan useT hook.

import { MagicTranslateProvider, T, Language } from '@magic-translate/react';

const App = () => (
  <MagicTranslateProvider apiKey="<your-api-key>" language={Language.FR}>
    <h1>
      <T>Welcome to our shop</T>
    </h1>
  </MagicTranslateProvider>
);

Jika Anda merender di server, gunakan React SSR sebagai gant inya, sehingga mesin pencari dan pengguna mendapatkan HTML yang sepenuhnya diterjemahkan.

Ketika kunci terjemahan masih merupakan pilihan yang lebih baik

Terjemahan mesin itu bagus, tetapi tidak ditinjau oleh seseorang. Jika setiap kata aplikasi Anda harus disetujui oleh penerjemah, misalnya untuk teks hukum atau medis, pustaka berbasis kunci dengan terjemahan manusia memberi Anda kontrol itu. Banyak aplikasi menggabungkan keduanya: Magic Translate untuk sebagian besar antarmuka, dan teks yang ditinjau di mana itu penting.

Pertanyaan yang sering diajukan

Apakah terjemahannya cukup cepat?

Terjemahan pertama dari sebuah teks dapat memakan waktu beberapa detik. Setelah itu, itu di-cache dan membutuhkan waktu 100 hingga 300 ms. Dengan React SSR, terjemahan terjadi di server, sehingga pengguna tidak pernah menunggunya.

Berapa biayanya?

Penggunaan dihitung dalam karakter yang diterjemahkan per bulan, dan teks yang sudah diterjemahkan tidak dihitung lagi. Lihat bagaimana penggunaan dihitung dan harganya.

Bahasa apa yang didukung?

Lebih dari 70. Lihat daftar lengkap bahasa yang didukung.