Ga naar inhoud

Internationalisering

Voeg meertalige ondersteuning toe aan je app. Gebruik de Proyecta Content API voor redactionele lokalisatie, of vraag de AI om een i18n-framework rechtstreeks in de code te integreren.

Proyecta ondersteunt twee complementaire benaderingen voor het internationaliseren van de apps die je bouwt:

  1. Inhoudslokalisatie via de Proyecta Content API — voor redactionele inhoud (blogposts, FAQ’s, marketingteksten) die in meerdere talen vertaald moet worden
  2. Code-level i18n via een vertaalframework — voor UI-teksten, datums, valuta’s en het schakelen tussen talen tijdens gebruik

Beide werken vandaag al. Welke je nodig hebt, hangt af van wat je wilt vertalen.

Proyecta zelf wordt geleverd met 24 talen, zodat het product thuis is in i18n. Dezelfde patronen zijn van toepassing op de apps die je erin bouwt.

Optie 1: Inhoudslokalisatie (Proyecta Content API)

Section titled “Optie 1: Inhoudslokalisatie (Proyecta Content API)”

Als je een inhoudsrijke site bouwt — blog, kennisbank, marketingpagina’s, productcatalogus — gebruik dan de ingebouwde locale-ondersteuning van de Content API.

// Create the locales you support
await proyecta.content.locales.create({
/* code: 'en', name: 'English' */
});
await proyecta.content.locales.create({
/* code: 'es', name: 'Español' */
});
await proyecta.content.locales.create({
/* code: 'fr', name: 'Français' */
});
// Then create entries that exist in multiple locales — fetch the right
// translation per request based on the user's locale.

Dit is de juiste keuze wanneer:

  • Redacteuren die geen code schrijven inhoud moeten vertalen
  • Je wilt dat vertalingen versiebeheer ondersteunen
  • Je lokaalspecifieke publicatie nodig hebt (gepland publiceren komt binnenkort — vermeldingen vereisen momenteel handmatig publiceren via de API)

Zie Contentbeheer voor de volledige Content API.

Voor UI-teksten — labels, knoppen, foutmeldingen, datums, valuta’s — vraag de AI om een i18n-framework rechtstreeks in je project te integreren:

Add internationalization to my app.
Support English, Spanish, French, and Arabic.
Add message catalogs in src/locales/.
Add a language switcher in the header.
Use locale-prefixed URLs like /en/about and /es/about.
Make sure RTL layout works correctly for Arabic.

De AI zal:

  1. Een framework kiezen — de AI gebruikt i18next met react-i18next (de standaard van Proyecta)
  2. Catalogusbestanden aanmaken in src/locales/ (één JSON per taal)
  3. Tekst omhullen met t()-aanroepen (van de useTranslation-hook van react-i18next)
  4. Een taalwisselaar-component toevoegen
  5. URL-routing instellen met locale-prefixen
  6. RTL-layouts (dir="rtl") afhandelen voor Arabisch, Hebreeuws, enz.
  7. Getallen, datums en valuta’s opmaken per locale

Zodra je basistaal op orde is, is de AI uitstekend in het produceren van de overige catalogusbestanden:

  • "Translate every string in src/locales/en.json into Spanish, French, German, and Japanese. Use natural, idiomatic phrasing — don't translate brand names."
  • "My app is fully built in English. Add Spanish translations for everything and an es/ route prefix."

Voor inhoud waarbij veel op het spel staat (juridische teksten, medisch, financieel), laat een menselijke vertaler de AI-output controleren voordat je het publiceert.

De meeste echte apps gebruiken allebei: code-level i18n voor de UI-omgeving (knoppen, foutmeldingen, navigatie) en de Content API voor redactionele inhoud (artikelen, productbeschrijvingen). Ze kunnen prima naast elkaar bestaan — je i18n-framework verwerkt de catalogusbestanden tijdens het builden, de Content API levert gelokaliseerde vermeldingen tijdens gebruik.

  1. Kies je basistaal en rond de teksten eerst af. Een bewegend doel vertalen is lastig.
  2. Vertalingen in batches uitvoeren. Vertaal niet terwijl je bezig bent — wacht tot een functie stabiel is.
  3. Test RTL vroeg als je Arabisch of Hebreeuws ondersteunt. RTL-bugs blijven verborgen totdat je er echt naar kijkt.
  4. Zet lang en dir op <html>. Browsers en schermlezers zijn ervan afhankelijk.
  5. Gebruik Intl voor opmaak. Schrijf datum- of valutaopmaak niet zelf — gebruik Intl.DateTimeFormat, Intl.NumberFormat.
  • Locale-beheer UI in de builder — kies locales, bekijk vertaaldekking en bewerk catalogi zonder Proyecta te verlaten
  • Automatisch vertalen bij opslaan voor nieuwe teksten
  • i18n-kant-en-klare projecttemplates met het framework vooraf geïntegreerd