6. How to Support i18n in Server Side
・Server Side = Python, PHP, Erlang and etc.
・GNU gettext generally is used
7. How to use gettext
1. Modify source code
2. Extract texts from source code(.pot)
3. Translate texts(.po)
4. Convert translated texts into binary
translated texts(.mo)
5. Load binary translated texts on server
8. ・Use template engine like Mako
・Use _ method of gettext.py
How to use gettext
1. Modify Source Code
9. How to use gettext
2. Extract Texts from Source Code(.pot)
・Create .pot file with pybabel or xgettext
10. How to use gettext
3. Translate Texts(.po)
・Create .po file from .pot file with msgmerge
・Edit .po file with vim or Poedit
11. How to use gettext
4. Convert Translated Texts into Binary Translated Texts(.mo)
・Create .mo file with msgfmt
12. ・Load .mo file on Tornado of Python
How to use gettext
5. Load Binary Translated Texts on Server
13. ・Separate translating from developing
・Translators edit po files
・Developers edit source codes
・Useful PO file editor like Poedit
Good Points of gettext
19. What’s AngularJS?
・JavaScript MVC Framework in Client Side
・Developed by Google
・Home Page:
https://angularjs.org/
・Examples:
http://www.angularjshub.com/examples/
20. What’s AngularJS?
Concepts of AngularJS
・2 Way Data Binding
・Change Value in Model = Change Value in View $(‘#hoge’).value(‘fuga’)
・Model
・Resource like REST API with $http, $q, and $resource
・Factory like Session Storage or Local Storage
・Directive / Filter / Template
・Behaviour as HTML
<div ng-model=”items” ng-repeat=”item in items | lowercase”><a>{{item}}</div>
・Controller
・Scope in HTML
<div ng-controller=”abcCtrl”></div><div ng-controller=”xyzCtrl”></div>
・Router
・Ajax Frendly URL with $router or angular-ui plugin
http://www.example.com/blog/#/page/1
・pushState / popState with HTML5 Mode
22. What’s angular-gettext?
・Support gettext on AngularJS
・Extract text from AngularJS codes
・Convert .po file into JSON or Object
・Home Page:
http://angular-gettext.rocketeer.be/
・Examples:
https://github.com/rubenv/angular-gettext-example
23. How to use angular-gettext
1. Modify source code
2. Extract texts from source code(.pot)
3. Translate texts(.po)
4. Convert translated texts into JSON(.json)
5. Load JSON on AngularJS or Server
24. ・Use translate directive on View
・Use gettext function on Controller
How to use angular-gettext
1. Modify Source Code
25. How to use angular-gettext
2. Extract Texts from Source Code(.pot)
・Create .pot file with Grunt and grunt-angular-gettext
・We can merge other .pot file which is created by pybael
with msguniq
26. How to use angular-gettext
3. Translate Texts(.po)
・Create .po file from .pot file with msgmerge
・Edit .po file with vim or Poedit
27. How to use angular-gettext
4. Convert translated texts into JSON(.json)
・Create .json file with Grunt and grunt-angular-gettext
28. ・Load JSON on AngularJS
How to use angular-gettext
5. Load JSON on AngularJS
29. ・translate directive
・We do NOT have to set translated texts into HTML
・JavaScript does NOT depend on Server Framework
・gettext
・Use a de fact standard
・Use the same as .po file of server side
・Translated texts is JSON format
・3rd party tool like jQuery Globalize use the JSON
Good Points of angular-gettext