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

Sut mae'n gweithio

Gosodwch y pecyn TacoTranslate gan ddefnyddio npm:

npm install tacotranslate

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

Yn rhyngwyneb defnyddiwr cymhwysiad TacoTranslate, crewch brosiect a llywiwch at ei dab allweddi API. Crewch un allwedd read a un allwedd read/write. Byddwn yn eu cadw fel newidynnau amgylchedd. Y allwedd read yw'r hyn a elwir yn public gennym, a'r allwedd read/write yw secret. Er enghraifft, gallech eu hychwanegu at ffeil .env yn wraidd eich prosiect.

Bydd hefyd angen i chi ychwanegu dau newidyn amgylcheddol ychwanegol: TACOTRANSLATE_DEFAULT_LOCALE a TACOTRANSLATE_ORIGIN.

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

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

Sicrhewch na fyddwch byth yn datgelu'r allwedd API gyfrinachol read/write i amgylcheddau cynhyrchu ar ochr y cleient.

Sefydlu TacoTranslate

Cychwynnwch 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 ym mhob man o fewn eich cais i arddangos testun wedi'i gyfieithu! Cofiwch edrych ar ein dogfennaeth am ragor o wybodaeth, ac am ganllawiau gweithredu sy'n benodol i'ch ffurfweddiad.

import {Translate} from 'tacotranslate/react';

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

Manteision defnyddio TacoTranslate

• Arbed amser: Awtomeiddio'r broses ddiflas o leoleiddio a chasglu llinynnau, gan arbed i chi amser gwerthfawr.
• Gwerth am arian: Lleihau'r angen am gyfieithiadau â llaw, gan leihau'ch costau leoleiddio.
• Cywirdeb gwell: Mae cyfieithiadau a gynorthwyir gan AI yn sicrhau canlyniadau cywir o ran cyd-destun ac o safon uchel.
• Ateb sy'n raddadwy: Yn hawdd ychwanegu cefnogaeth i ieithoedd newydd wrth i'ch ap a'ch sylfaen cwsmeriaid dyfu.

Dechreuwch heddiw!

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

Rydym yn argymell bod gennych amgylchedd staging caeedig a diogel lle gallwch brofi'ch cais cynhyrchu, gan ychwanegu llinynnau newydd cyn mynd yn fyw. Bydd hyn yn atal unrhyw un unrhyw un rhag dwyn eich allwedd API gyfrinachol, a gall hyn hefyd achosi i'ch prosiect cyfieithu orlwytho drwy ychwanegu 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!