115 votes

Meilleures pratiques pour la localisation et la mondialisation des chaînes et des étiquettes

Je suis un membre d'une équipe avec plus de 20 développeurs, et chaque développeur travaille sur un module séparé (à quelque chose près de 10 modules). Dans chaque module, on pourrait avoir au moins 50 CRUD formes, ce qui signifie que nous avons actuellement près de 500 ajouter des boutons, des boutons enregistrer, de modifier des boutons, etc.

Cependant, parce que nous voulons mondialisée de notre application, nous devons être en mesure de traduire des textes dans notre application. Par exemple, partout, le mot ajouter devrait devenir ajouter pour les utilisateurs français.

Ce que nous avons fait jusqu'à maintenant, c'est que pour chaque affichage dans l'INTERFACE utilisateur ou de la Couche de Présentation, nous avons un dictionnaire de paires clé/valeur de traductions. Puis, tandis que le rendu de la vue, nous traduisons des textes et des chaînes à l'aide de ce dictionnaire. Cependant, cette approche, que nous avons d'avoir quelque chose près de 500 ajouter de 500 dictionnaires. Cela signifie que nous avons manqué à SEC principal.

D'autre part, si nous centralisons les chaînes communes, comme mettre les ajouter en un seul endroit, et en demandant aux développeurs d'utilisateur partout, nous rencontrons le problème de ne pas être sûr si une chaîne est déjà défini dans le centralisée dictionnaire ou pas.

L'une des autres options peut-être ne pas avoir de dictionnaire de traduction et d'utiliser les services de traduction en ligne comme Google Translate, Bing Traducteur, etc.

Un autre problème que nous avons rencontré, c'est que certains développeurs sous la contrainte de livrer le projet à temps ne me souviens pas les clés de traduction. Par exemple, pour le texte du bouton "ajouter", un développeur a utilisé ajoutez alors qu'un autre développeur a utilisé de nouvelles, etc.

Quelle est la meilleure pratique, ou plus méthode bien connue pour la mondialisation et la localisation des ressources de chaîne de la demande?

50voto

Afshin Mehrabani Points 4174

Autant que je sache, il y a une bonne bibliothèque appelée localeplanet pour la Localisation et de l'Internationalisation en JavaScript. En outre, je pense que c'est natif et n'a pas de dépendances à d'autres bibliothèques (ex: jQuery)

Voici le site de la bibliothèque: http://www.localeplanet.com/

Aussi regarder cet article par Mozilla, vous pouvez trouver une très bonne méthode et d'algorithmes pour le côté client de la traduction: http://blog.mozilla.org/webdev/2011/10/06/i18njs-internationalize-your-javascript-with-a-little-help-from-json-and-the-server/

La partie commune à tous les articles/les bibliothèques, c'est qu'ils utilisent un i18n de la classe et un get méthode (à certains égards aussi la définition d'un plus petit nom de la fonction comme _) pour l'extraction/conversion de l' key de la value. Dans mon expliquant l' key signifie que la chaîne que vous souhaitez traduire et l' value moyen chaîne traduite.
Ensuite, vous avez juste besoin d'un document JSON pour stocker keys et value'.

Par exemple:

var _ = document.webL10n.get;
alert(_('test'));

Et voici le JSON:

{ test: "blah blah" }

Je crois que l'aide actuelle bibliothèques populaires des solutions est une bonne approche.

46voto

Omid Shariati Points 759

Je suis développeur de avec 5 ans d'expérience dans le web développement de composants et d'outils pour les développeurs web.

Lorsque vous êtes confronté à un problème à résoudre (et franchement, qui n'est pas ces jours-ci?), la stratégie de base généralement prises par nous de l'ordinateur gens est appelé "diviser pour régner". Il va comme ceci: • Conceptualiser le problème spécifique comme un ensemble de sous-problèmes. • Résoudre chaque petit problème. • Combiner les résultats dans une solution à un problème spécifique. Mais "diviser pour régner" n'est pas la seule stratégie possible. Nous pouvons également prendre une approche plus généraliste: • Conceptualiser le problème spécifique comme un cas particulier d'un problème plus général. • D'une certaine manière de résoudre le problème général. • L'adaptation de la solution du problème plus général du problème spécifique. -Eric Lippert

Je crois que de nombreuses solutions existent déjà pour ce problème dans les langages côté serveur comme ASP.Net/C#.

J'ai décrit quelques-uns des principaux aspects du problème

  • Question: Nous avons besoin de charger des données que pour la langue de votre choix

    Solution: Pour cela, nous sauver de la date des fichiers distincts pour chaque langue

ex. res.de.js, res.fr.js, res.en.js, res.js(pour la langue par défaut)

  • Problème: les fichiers de Ressources pour chaque page doit être séparées, de sorte que nous obtenons seulement les données dont nous avons besoin

    Solution: Nous pouvons utiliser des outils qui existent déjà, comme https://github.com/rgrove/lazyload

  • Question: Nous avons besoin d'une paire clé/valeur de la structure pour enregistrer nos données

    Solution: je vous propose un objet javascript au lieu de string/string à l'air. On peut bénéficier de l'intellisense à partir d'un IDE

  • Question: de façon Générale, les membres doivent être stockés dans un dossier public et toutes les pages doivent avoir accès

    Solution: Pour cela, je fais un dossier à la racine de l'application web appelée Global_Resources et un dossier pour stocker les fichiers global pour chacun des sous-dossiers, nous l'avons appelé 'Local_Resources'

  • Question: Chacun des sous-systèmes/sous-dossiers/modules membre doit l'emporter sur la Global_Resources membres de leur étendue

    Solution:- je considéré comme un fichier pour chaque

Structure De La Demande

root/
    Global_Resources/
        default.js
        default.fr.js
    UserManagementSystem/
        Local_Resources/
            default.js
            default.fr.js
            createUser.js
        Login.htm
        CreateUser.htm

Le code correspondant pour les fichiers:

Global_Resources/default.js

var res = {
    Create : "Create",
    Update : "Save Changes",
    Delete : "Delete"
};

Global_Resources/default.fr.js

var res = {
    Create : "créer",
    Update : "Enregistrer les modifications",
    Delete : "effacer"
};

Le fichier de ressources pour la langue souhaitée doit être chargé sur la page sélectionnée à partir de Global_Resource - Ce qui devrait être le premier fichier qui est chargé sur toutes les pages.

UserManagementSystem/Local_Resources/default.js

res.Name = "Name";
res.UserName = "UserName";
res.Password = "Password";

UserManagementSystem/Local_Resources/default.fr.js

res.Name = "nom";
res.UserName = "Nom d'utilisateur";
res.Password = "Mot de passe";

UserManagementSystem/Local_Resources/createUser.js

// Override res.Create on Global_Resources/default.js
res.Create = "Create User"; 

UserManagementSystem/Local_Resources/createUser.fr.js

// Override Global_Resources/default.fr.js
res.Create = "Créer un utilisateur";

manager.js fichier (ce fichier doit être charger la dernière)

res.lang = "fr";

var globalResourcePath = "Global_Resources";
var resourceFiles = [];

var currentFile = globalResourcePath + "\\default" + res.lang + ".js" ;

if(!IsFileExist(currentFile))
    currentFile = globalResourcePath + "\\default.js" ;
if(!IsFileExist(currentFile)) throw new Exception("File Not Found");

resourceFiles.push(currentFile);

// Push parent folder on folder into folder
foreach(var folder in parent folder of current page)
{
    currentFile = folder + "\\Local_Resource\\default." + res.lang + ".js";

    if(!IsExist(currentFile))
        currentFile = folder + "\\Local_Resource\\default.js";
    if(!IsExist(currentFile)) throw new Exception("File Not Found");

    resourceFiles.push(currentFile);
}

for(int i = 0; i < resourceFiles.length; i++) { Load.js(resourceFiles[i]); }

// Get current page name
var pageNameWithoutExtension = "SomePage";

currentFile = currentPageFolderPath + pageNameWithoutExtension + res.lang + ".js" ;

if(!IsExist(currentFile))
    currentFile = currentPageFolderPath + pageNameWithoutExtension + ".js" ;
if(!IsExist(currentFile)) throw new Exception("File Not Found");

Espérons que cela aide :)

13voto

BalaKrishnan웃 Points 954

jQuery.i18n est un plugin jQuery léger pour l'activation de l'internationalisation dans vos pages web. Il vous permet de package personnalisé les chaînes de ressource".les propriétés de fichiers, tout comme en Java des offres de Ressources. C'charges et analyse des offres de ressources (.les propriétés) basé sur le langage ou la langue rapporté par navigateur.

pour en savoir plus au sujet de ce prendre un coup d'oeil à la Façon de s'internationaliser vos pages à l'aide de JQuery?

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X