Localization In Ember

How to effectivly globalize and localize an ember application

(and web apps in general)

Created by Chris Rice / Github: Kilowhisky

What we are after

Whats the difference?

Globalization is the process of designing and developing applications that function for multiple cultures.

Localization is the process of customizing your application for a given culture and locale.


What things need globalization?

  1. Number parsing
  2. Date parsing
  3. Regex
  4. Currency
  5. Non-Latin Characters

123.43 -> 123,43

10/01/2016 -> 2016/10/01

Mitigation is in the API and platform specific

Globalization basics

Here are some quick tips for API communication.
  • Never pass a string formatted date. Always .toJSON()!
  • Never pass a string formatted number.
  • Always use and store in UTF-8!
  • Be flexible in validation. Try not to apply your locale's conventions. (phone numbers,etc..)
  • Be sure to localize error messages!
  • Decide early on if you want to support right-to-left languages or other alphabets.

What needs localization?

  1. Numbers
  2. Dates
  3. Text
  4. Plugins
  5. API Responses

Basic Premise of localizing a web app

  1. Detect the users localization automatically
  2. Tell the browser we want to localize
  3. Tell our API that we want to localize
  4. Manipulate our application into awesomeness

What will we need?

  • ember-i18n addon that is the de facto standard localizing an ember application
  • ember-moment addon that helps with date localization
  • ember-cli-moment-shim if you don't like ember-moment you use this instead
  • ember-i18n-csv for exporting translations to csv so you can send them to a translator


Demo Time