Y datrysiad gorau ar gyfer rhyngwladoli (i18n) mewn apiau React

Sut mae'n gweithio

Gosodwch y pecyn TacoTranslate trwy npm:

npm install tacotranslate

Pan fyddwch wedi gosod y modiwl, bydd angen i chi greu cyfrif TacoTranslate, prosiect cyfieithu, ac allweddau API cysylltiedig. Creu cyfrif yma. Mae'n rhad ac am ddim, ac nid oes angen i chi ychwanegu cerdyn credyd.

Yn UI'r cymhwysiad TacoTranslate, creuwch brosiect, a llywiwch i'r tab allweddi API. Creuwch un read allwedd, a un read/write allwedd. Byddwn yn eu cadw fel newidynnau amgylcheddol. Y read allwedd yw'r hyn yr ydym yn ei alw'n public, a'r read/write allwedd yw secret. Er enghraifft, gallech eu hychwanegu at ffeil .env yn y ffolder gwraidd eich prosiect.

Bydd angen i chi hefyd ychwanegu dau newidyn amgylchedd arall: TACOTRANSLATE_DEFAULT_LOCALE a TACOTRANSLATE_ORIGIN.

• TACOTRANSLATE_DEFAULT_LOCALE: Y cod lleoliad wrth gefn diofyn. Yn yr enghraifft hon, byddwn yn ei osod i en ar gyfer Saesneg.
• TACOTRANSLATE_ORIGIN: Y “ffolder” lle caiff eich strings eu storio, megis URL eich gwefan. Darllenwch ragor am originau yma.

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

Gwnewch yn siŵr nad yw'r allwedd API gyfrinachol read/write byth yn cael ei ddatgelu i amgylcheddau cynhyrchu ar ochr y cleient.

Gosod TacoTranslate

Cychwynwch TacoTranslate yn eich cais React trwy lapio eich cais yn y darparwr cyd-destun 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>
	);
}

Gallwch nawr ddefnyddio'r cydran Translate unrhywle yn eich cymhwysiad i arddangos testun wedi'i gyfieithu! Gwnewch yn siŵr i edrych ar ein dogfennaeth am ragor o wybodaeth, ac am ganllawiau gweithredu penodol i'ch cyfluniad.

import {Translate} from 'tacotranslate/react';

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

Manteision defnyddio TacoTranslate

• Arbed amser: Yn awtomeiddio'r broses ddiflas o leoleiddio a chasglu llinynnau, gan arbed amser gwerthfawr i chi.
• Yn gost-effeithiol: Lleihau'r angen am gyfieithiadau â llaw, gan ostwng costau eich lleoleiddio.
• Gwell cywirdeb: Mae cyfieithiadau sy'n cael eu pweru gan AI yn sicrhau canlyniadau sy'n gywir o ran cyd-destun ac o ansawdd uchel.
• Datrysiad graddadwy: Ychwanegu cefnogaeth ar gyfer ieithoedd newydd yn hawdd wrth i eich ap a'ch sylfaen cwsmeriaid dyfu.

Dechreuwch heddiw!

Bydd eich cais React yn cael ei gyfieithu'n awtomatig pan ychwanegwch unrhyw llinynnau at gydran Translate. Sylwch mai dim ond amgylcheddau sydd â chaniatadau read/write ar allwedd API fydd yn gallu creu llinynnau newydd i'w cyfieithu.

Rydym yn argymell cael amgylchedd staging caeedig a diogel lle gallwch brofi eich cais cynhyrchu, gan ychwanegu llinynnau newydd cyn mynd yn fyw. Bydd hyn yn atal neb neb rhag dwyn eich allwedd API gyfrinachol, ac efallai achosi i'ch prosiect cyfieithu dyfu'n ormodol os ychwanegir llinynnau amhriodol.

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!