Bản địa hóa ứng dụng React dễ dàng

Bạn có đang tìm cách mở rộng ứng dụng React của mình sang các thị trường mới không? TacoTranslate giúp việc bản địa hóa ứng dụng React của bạn trở nên vô cùng dễ dàng, cho phép bạn tiếp cận người dùng toàn cầu mà không gặp rắc rối.

Tại sao chọn TacoTranslate cho React?

Tích hợp liền mạch: Được thiết kế riêng cho các ứng dụng React, TacoTranslate tích hợp dễ dàng vào quy trình làm việc hiện có của bạn.
Thu thập chuỗi tự động: Không còn phải quản lý tệp JSON thủ công nữa. TacoTranslate tự động thu thập chuỗi từ mã nguồn của bạn.
Dịch được hỗ trợ bởi AI: Tận dụng sức mạnh của AI để cung cấp các bản dịch chính xác theo ngữ cảnh và phù hợp với giọng điệu của ứng dụng bạn.
Hỗ trợ ngôn ngữ ngay lập tức: Thêm hỗ trợ cho ngôn ngữ mới chỉ với một cú nhấp, giúp ứng dụng của bạn dễ tiếp cận trên toàn cầu.

Cách hoạt động

Cài đặt gói TacoTranslate bằng npm:

npm install tacotranslate

Khi bạn đã cài đặt mô-đun, bạn sẽ cần tạo một tài khoản TacoTranslate, một dự án dịch thuật và các khóa API tương ứng. Tạo tài khoản tại đây. Miễn phí, và không yêu cầu bạn cung cấp thẻ tín dụng.

Trong giao diện ứng dụng TacoTranslate, tạo một dự án và điều hướng đến tab API keys. Tạo một khóa read và một khóa read/write. Chúng tôi sẽ lưu chúng dưới dạng biến môi trường. Khóa read là cái mà chúng tôi gọi là public và khóa read/write là secret. Ví dụ, bạn có thể thêm chúng vào tệp .env ở thư mục gốc của dự án.

Bạn cũng cần thêm hai biến môi trường nữa: TACOTRANSLATE_DEFAULT_LOCALE và TACOTRANSLATE_ORIGIN.

TACOTRANSLATE_DEFAULT_LOCALE: Mã locale dự phòng mặc định. Trong ví dụ này, chúng tôi sẽ đặt nó thành en cho tiếng Anh.
TACOTRANSLATE_ORIGIN: “thư mục” nơi các chuỗi của bạn sẽ được lưu trữ, chẳng hạn như URL của trang web của bạn. Tìm hiểu thêm về origins tại đây.

.env

TACOTRANSLATE_PUBLIC_API_KEY=123456
TACOTRANSLATE_SECRET_API_KEY=789010
TACOTRANSLATE_DEFAULT_LOCALE=en
TACOTRANSLATE_ORIGIN=your-website-url.com

Hãy chắc chắn không bao giờ làm lộ khóa API bí mật read/write ra các môi trường sản xuất phía client.

Thiết lập TacoTranslate

Khởi tạo TacoTranslate trong ứng dụng React của bạn bằng cách bọc ứng dụng của bạn trong bộ cung cấp ngữ cảnh 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>
	);
}

Bây giờ bạn có thể sử dụng thành phần Translate ở bất kỳ đâu trong ứng dụng của bạn để hiển thị văn bản đã được dịch! Hãy xem tài liệu của chúng tôi để biết thêm thông tin và các hướng dẫn triển khai phù hợp với cấu hình của bạn.

import {Translate} from 'tacotranslate/react';

export default async function Component() {
	return (
		<Translate string="Hello? This is TacoTranslate speaking." />
	);
}

Lợi ích khi sử dụng TacoTranslate

Tiết kiệm thời gian: Tự động hóa quy trình bản địa hóa và thu thập chuỗi văn bản tẻ nhạt, giúp bạn tiết kiệm thời gian quý báu.
Tiết kiệm chi phí: Giảm nhu cầu dịch thủ công, từ đó giảm chi phí bản địa hóa.
Cải thiện độ chính xác: Các bản dịch được hỗ trợ bởi AI đảm bảo kết quả chính xác theo ngữ cảnh và chất lượng cao.
Giải pháp có khả năng mở rộng: Dễ dàng thêm hỗ trợ cho ngôn ngữ mới khi ứng dụng và cơ sở khách hàng của bạn phát triển.

Bắt đầu ngay hôm nay!

Ứng dụng React của bạn sẽ được dịch tự động khi bạn thêm bất kỳ chuỗi nào vào một thành phần Translate. Lưu ý rằng chỉ những môi trường có quyền read/write trên khóa API mới có thể tạo chuỗi mới để dịch.

Chúng tôi khuyến nghị bạn nên có một môi trường staging khép kín và được bảo mật nơi bạn có thể kiểm thử ứng dụng sản xuất của mình, thêm các chuỗi mới trước khi đưa vào hoạt động. Điều này sẽ ngăn chặn bất kỳ ai bất kỳ ai đánh cắp khóa API bí mật của bạn, và có thể làm phình to dự án dịch thuật của bạn bằng cách thêm các chuỗi không mong muốn.