Penyelesaian terbaik untuk pengantarabangsaan (i18n) dalam aplikasi React
Adakah anda ingin mengembangkan aplikasi React anda ke pasaran baru? TacoTranslate memudahkan anda untuk melokalkan aplikasi React anda, membolehkan anda mencapai audiens global tanpa kesulitan.
Mengapa memilih TacoTranslate untuk React?
- Integrasi Lancar: Direka khas untuk aplikasi React, TacoTranslate menyerap dengan mudah ke dalam aliran kerja sedia ada anda.
- Pengumpulan String Automatik: Tidak perlu lagi mengurus fail JSON secara manual. TacoTranslate secara automatik mengumpul string dari pangkalan kod anda.
- Terjemahan Dikuasakan AI: Manfaatkan kuasa AI untuk menyediakan terjemahan yang tepat mengikut konteks dan sesuai dengan nada aplikasi anda.
- Sokongan Bahasa Segera: Tambah sokongan untuk bahasa baru hanya dengan satu klik, menjadikan aplikasi anda boleh diakses secara global.
Bagaimana ia berfungsi
Pasang pakej TacoTranslate melalui npm:
npm install tacotranslate
Apabila anda telah memasang modul, anda perlu membuat akaun TacoTranslate, projek terjemahan, dan kekunci API yang berkaitan. Buat akaun di sini. Ia adalah percuma, dan tidak memerlukan anda menambah kad kredit.
Dalam UI aplikasi TacoTranslate, cipta satu projek, dan pergi ke tab kekunci API. Cipta satu kekunci read
, dan satu kekunci read/write
. Kami akan menyimpannya sebagai pembolehubah persekitaran. Kekunci read
adalah apa yang kami panggil public
dan kekunci read/write
adalah secret
. Contohnya, anda boleh menambahkannya ke dalam fail .env
di root projek anda.
Anda juga perlu menambah dua pemboleh ubah persekitaran lagi: TACOTRANSLATE_DEFAULT_LOCALE
dan TACOTRANSLATE_ORIGIN
.
TACOTRANSLATE_DEFAULT_LOCALE
: Kod lokal lalai sebagai sandaran. Dalam contoh ini, kami akan menetapkannya kepadaen
untuk Bahasa Inggeris.TACOTRANSLATE_ORIGIN
: "Folder" di mana rentetan anda akan disimpan, seperti URL laman web anda. Baca lebih lanjut mengenai origin di sini.
TACOTRANSLATE_PUBLIC_API_KEY=123456
TACOTRANSLATE_SECRET_API_KEY=789010
TACOTRANSLATE_DEFAULT_LOCALE=en
TACOTRANSLATE_ORIGIN=your-website-url.com
Pastikan anda tidak pernah mendedahkan kunci API rahsia read/write
kepada persekitaran produksi sisi klien.
Menetapkan TacoTranslate
Inisialisasikan TacoTranslate dalam aplikasi React anda dengan membungkus aplikasi anda dalam pembekal konteks TacoTranslate:
import React, {useState} from 'react';
import TacoTranslate, {Translate} from 'tacotranslate/react';
const tacoTranslate = createTacoTranslateClient({
apiKey: 'YOUR_API_KEY',
});
export default function App() {
const [locale, setLocale] = useState('en');
return (
<TacoTranslate client={tacoTranslate} locale={locale}>
<Translate string="Hello, world!"/>
</TacoTranslate>
);
}
Anda kini boleh menggunakan komponen Translate
di mana-mana dalam aplikasi anda untuk memaparkan teks yang diterjemah! Pastikan untuk melihat dokumentasi kami untuk maklumat lanjut, dan untuk panduan pelaksanaan yang khusus untuk konfigurasi anda.
import {Translate} from 'tacotranslate/react';
export default async function Component() {
return (
<Translate string="Hello? This is TacoTranslate speaking." />
);
}
Kelebihan menggunakan TacoTranslate
- Penjimatan masa: Mengautomatikkan proses pemeteraian yang membosankan dan pengumpulan rentetan, menjimatkan masa berharga anda.
- Berpatutan: Mengurangkan keperluan untuk terjemahan manual, menurunkan kos pemeteraian anda.
- Ketepatan yang dipertingkatkan: Terjemahan yang dikuasakan oleh AI memastikan keputusan yang tepat mengikut konteks dan berkualiti tinggi.
- Penyelesaian Boleh Skala: Mudah menambah sokongan untuk bahasa baru apabila aplikasi dan pangkalan pelanggan anda berkembang.
Mula hari ini!
Aplikasi React anda akan diterjemahkan secara automatik apabila anda menambah mana-mana rentetan ke dalam komponen Translate
. Perlu diingat bahawa hanya persekitaran dengan kebenaran read/write
pada kunci API yang akan dapat mencipta rentetan baru untuk diterjemahkan.
Kami mengesyorkan mempunyai persekitaran penstagingan yang tertutup dan selamat di mana anda boleh menguji aplikasi produksi anda, menambah rentetan baru sebelum dilancarkan. Ini akan mengelakkan sesiapa daripada mencuri kunci API rahsia anda, dan berpotensi membebankan projek terjemahan anda dengan menambah rentetan tidak sah.
Be sure to check out the complete examples over at our GitHub profile. If you encounter any problems, feel free to reach out, and we’ll be more than happy to help.
TacoTranslate lets you automatically localize your React applications quickly to and from over 75 languages. Translate for free!