Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
React.js & i18n
Search
Eric Ferraiuolo
January 28, 2015
Programming
2
460
React.js & i18n
http://formatjs.io/
Eric Ferraiuolo
January 28, 2015
Tweet
Share
More Decks by Eric Ferraiuolo
See All by Eric Ferraiuolo
Node on the Road
ericf
1
92
Pure
ericf
7
930
YUI and The Future
ericf
2
690
YUI 3.10.0 — Go Fast
ericf
3
530
YUI, Open Source, and Community
ericf
0
400
Advocatus Diaboli – Throne of JS
ericf
8
16k
Y.App: Coordinating URL Navigation, Routing, and Managing Views
ericf
10
2k
Other Decks in Programming
See All in Programming
Rubyでつくるパケットキャプチャツール
ydah
0
110
Go の GC の不得意な部分を克服したい
taiyow
3
1k
はてなにおけるfujiwara-wareの活用やecspressoのCI/CD構成 / Fujiwara Tech Conference 2025
cohalz
0
490
オニオンアーキテクチャを使って、 Unityと.NETでコードを共有する
soi013
0
360
Lookerは可視化だけじゃない。UIコンポーネントもあるんだ!
ymd65536
1
120
ISUCON14感想戦で85万点まで頑張ってみた
ponyo877
1
500
PHPカンファレンス 2024|共創を加速するための若手の技術挑戦
weddingpark
0
130
どうして手を動かすよりもチーム内のコードレビューを優先するべきなのか
okashoi
3
850
React 19でお手軽にCSS-in-JSを自作する
yukukotani
5
550
LLM Supervised Fine-tuningの理論と実践
datanalyticslabo
8
1.8k
非ブラウザランタイムとWeb標準 / Non-Browser Runtimes and Web Standards
petamoriken
0
420
コンテナをたくさん詰め込んだシステムとランタイムの変化
makihiro
1
190
Featured
See All Featured
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
7
560
Adopting Sorbet at Scale
ufuk
74
9.2k
RailsConf 2023
tenderlove
29
970
YesSQL, Process and Tooling at Scale
rocio
170
14k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
33
2k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
132
33k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
29
2.1k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.4k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
59k
Done Done
chrislema
182
16k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
Put a Button on it: Removing Barriers to Going Fast.
kastner
59
3.6k
Transcript
React.js & i18n @ericf - Yahoo ReactConf
1.002 2/1/2015
But I only care about English in the USA!
English 5.2% 27% Native Speakers Internet Users Source: Wikipedia
None
None
None
Formatting
None
None
function numberWithCommas(x) { var parts = x.toString().split("."); parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g,
","); return parts.join("."); } “How to print a number with commas as thousands separators in JavaScript?” 25 Answers
Intl.NumberFormat Intl.DateTimeFormat Intl.Collator
new Intl.NumberFormat().format(1000); new Intl.DateTimeFormat({ month: 'long', day : 'numeric', year
: 'numeric' }).format(Date.now()); 1,000 January 28, 2015 Intl Built-ins
<FormattedNumber value={1000} /> <FormattedDate value={Date.now()} month="long" day="numeric" year="numeric" /> React
Intl 1,000 January 28, 2015
<p className=“post-meta”> Posted <FormattedRelative value={this.props.date} /> </p> Relative Times Posted
3 hours ago
“Hello, {name}!” “You’re {age, number} years old.” String Messages
var msg = `{numComments, plural, one {# comment}
other {# comments} }`; <FormattedMessage message={msg} numComments={1} /> Pluralization 1 comment
var msg = `{numComments, plural, one {# comment}
other {# comments} }`; <FormattedMessage message={msg} numComments={1200} /> Pluralization 1,200 comments
var App = React.createClass({ mixins: [IntlMixin], render: function () {
return <FormattedNumber value={this.props.price} style="currency" currency="USD" /> } }); React.render( <App locales="fr-FR" price={1099.95} />, document.getElementById("container") ); Intl Mixin 1 099,95 $US
7.7k 150+ React Intl min + gz languages English as
default
None
CLDR ICU JS Runtimes (Intl.*) Format.js Core Format.js Integrations
Intl.MessageFormat Intl.RelativeFormat Future Intl Built-ins?
Questions? formatjs.io @ericf - Yahoo ReactConf