Lokalisasi tanpa repot untuk aplikasi React
Apakah Anda ingin memperluas aplikasi React Anda ke pasar baru? TacoTranslate membuatnya sangat mudah untuk melokalisasi aplikasi React Anda, memungkinkan Anda menjangkau audiens global tanpa kesulitan.
Mengapa memilih TacoTranslate untuk React?
- Integrasi Tanpa Hambatan: Dirancang khusus untuk aplikasi React, TacoTranslate terintegrasi dengan mudah ke dalam alur kerja Anda yang sudah ada.
- Koleksi String Otomatis: Tidak perlu lagi mengelola file JSON secara manual. TacoTranslate secara otomatis mengumpulkan string dari basis kode Anda.
- Terjemahan Berbasis AI: Manfaatkan kekuatan AI untuk memberikan terjemahan yang akurat secara kontekstual dan sesuai dengan nada aplikasi Anda.
- Dukungan Bahasa Instan: Tambahkan dukungan untuk bahasa baru hanya dengan satu klik, membuat aplikasi Anda dapat diakses secara global.
Cara kerjanya
Pasang paket TacoTranslate melalui npm:
npm install tacotranslate
Setelah modul terpasang, Anda perlu membuat akun TacoTranslate, sebuah proyek terjemahan, dan kunci API terkait. Buat akun di sini. Ini gratis, dan tidak mengharuskan Anda menambahkan kartu kredit.
Dalam antarmuka aplikasi TacoTranslate, buat sebuah proyek, dan navigasikan ke tab kunci API-nya. Buat satu kunci read
dan satu kunci read/write
. Kami akan menyimpannya sebagai variabel lingkungan. Kunci read
disebut sebagai public
dan kunci read/write
adalah secret
. Sebagai contoh, Anda dapat menambahkannya ke dalam file .env
di root proyek Anda.
Anda juga perlu menambahkan dua variabel lingkungan lagi: TACOTRANSLATE_DEFAULT_LOCALE
dan TACOTRANSLATE_ORIGIN
.
TACOTRANSLATE_DEFAULT_LOCALE
: Kode lokal cadangan default. Dalam contoh ini, kami akan mengaturnya keen
untuk bahasa Inggris.TACOTRANSLATE_ORIGIN
: “Folder” tempat string Anda akan disimpan, seperti URL situs web Anda. Baca lebih lanjut tentang origin di sini.
TACOTRANSLATE_PUBLIC_API_KEY=123456
TACOTRANSLATE_SECRET_API_KEY=789010
TACOTRANSLATE_DEFAULT_LOCALE=en
TACOTRANSLATE_ORIGIN=your-website-url.com
Pastikan untuk tidak pernah membocorkan kunci API rahasia read/write
ke lingkungan produksi sisi klien.
Menyiapkan TacoTranslate
Inisialisasi TacoTranslate dalam aplikasi React Anda dengan membungkus aplikasi Anda dalam penyedia 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 dapat menggunakan komponen Translate
di mana saja dalam aplikasi Anda untuk menampilkan teks yang diterjemahkan! Pastikan untuk melihat dokumentasi kami untuk informasi lebih lanjut, serta panduan implementasi yang sesuai dengan pengaturan Anda.
import {Translate} from 'tacotranslate/react';
export default async function Component() {
return (
<Translate string="Hello? This is TacoTranslate speaking." />
);
}
Manfaat menggunakan TacoTranslate
- Hemat waktu: Mengotomatiskan proses melelahkan dalam lokalisasi dan pengumpulan string, menghemat waktu berharga Anda.
- Efektif biaya: Mengurangi kebutuhan terjemahan manual, menurunkan biaya lokalisasi Anda.
- Akurasi yang ditingkatkan: Terjemahan berbasis AI memastikan hasil yang akurat secara konteks dan berkualitas tinggi.
- Solusi yang dapat diskalakan: Mudah menambah dukungan untuk bahasa baru seiring pertumbuhan aplikasi dan basis pelanggan Anda.
Mulai hari ini juga!
Aplikasi React Anda akan diterjemahkan secara otomatis ketika Anda menambahkan string apapun ke dalam komponen Translate
. Perlu diingat bahwa hanya lingkungan dengan izin read/write
pada kunci API yang dapat membuat string baru untuk diterjemahkan.
Kami menyarankan agar Anda memiliki lingkungan staging tertutup dan aman di mana Anda dapat menguji aplikasi produksi Anda, menambahkan string baru sebelum diluncurkan. Ini akan mencegah siapa pun mencuri kunci API rahasia Anda, dan berpotensi membengkakkan proyek terjemahan Anda dengan menambahkan string yang 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!