-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathindex.html
13 lines (13 loc) · 13.6 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
<!doctype html>
<html lang="en" dir="ltr" class="plugin-pages plugin-id-default" data-has-hydrated="false">
<head>
<meta charset="UTF-8">
<meta name="generator" content="Docusaurus v3.7.0">
<title data-rh="true">Format.JS | Format.JS</title><meta data-rh="true" name="viewport" content="width=device-width,initial-scale=1"><meta data-rh="true" name="twitter:card" content="summary_large_image"><meta data-rh="true" property="og:url" content="https://formatjs.github.io/"><meta data-rh="true" property="og:locale" content="en"><meta data-rh="true" name="docusaurus_locale" content="en"><meta data-rh="true" name="docusaurus_tag" content="default"><meta data-rh="true" name="docsearch:language" content="en"><meta data-rh="true" name="docsearch:docusaurus_tag" content="default"><meta data-rh="true" property="og:title" content="Format.JS | Format.JS"><meta data-rh="true" name="description" content="Internationalize your web apps on the client & server."><meta data-rh="true" property="og:description" content="Internationalize your web apps on the client & server."><link data-rh="true" rel="icon" href="/img/favicon.ico"><link data-rh="true" rel="canonical" href="https://formatjs.github.io/"><link data-rh="true" rel="alternate" href="https://formatjs.github.io/" hreflang="en"><link data-rh="true" rel="alternate" href="https://formatjs.github.io/" hreflang="x-default"><script data-rh="true">function insertBanner(){var n=document.createElement("div");n.id="__docusaurus-base-url-issue-banner-container";n.innerHTML='\n<div id="__docusaurus-base-url-issue-banner" style="border: thick solid red; background-color: rgb(255, 230, 179); margin: 20px; padding: 20px; font-size: 20px;">\n <p style="font-weight: bold; font-size: 30px;">Your Docusaurus site did not load properly.</p>\n <p>A very common reason is a wrong site <a href="https://docusaurus.io/docs/docusaurus.config.js/#baseUrl" style="font-weight: bold;">baseUrl configuration</a>.</p>\n <p>Current configured baseUrl = <span style="font-weight: bold; color: red;">/</span> (default value)</p>\n <p>We suggest trying baseUrl = <span id="__docusaurus-base-url-issue-banner-suggestion-container" style="font-weight: bold; color: green;"></span></p>\n</div>\n',document.body.prepend(n);var e=document.getElementById("__docusaurus-base-url-issue-banner-suggestion-container"),s=window.location.pathname,o="/"===s.substr(-1)?s:s+"/";e.innerHTML=o}document.addEventListener("DOMContentLoaded",(function(){void 0===window.docusaurus&&insertBanner()}))</script><link rel="stylesheet" href="/assets/css/styles.faee81a5.css">
<script src="/assets/js/runtime~main.0468938c.js" defer="defer"></script>
<script src="/assets/js/main.357c06ea.js" defer="defer"></script>
</head>
<body class="navigation-with-keyboard">
<script>!function(){function t(t){document.documentElement.setAttribute("data-theme",t)}var e=function(){try{return new URLSearchParams(window.location.search).get("docusaurus-theme")}catch(t){}}()||function(){try{return window.localStorage.getItem("theme")}catch(t){}}();t(null!==e?e:"light")}(),function(){try{const n=new URLSearchParams(window.location.search).entries();for(var[t,e]of n)if(t.startsWith("docusaurus-data-")){var a=t.replace("docusaurus-data-","data-");document.documentElement.setAttribute(a,e)}}catch(t){}}()</script><div id="__docusaurus"><div role="region" aria-label="Skip to main content"><a class="skipToContent_FZPk" href="#__docusaurus_skipToContent_fallback">Skip to main content</a></div><nav aria-label="Main" class="navbar navbar--fixed-top"><div class="navbar__inner"><div class="navbar__items"><button aria-label="Toggle navigation bar" aria-expanded="false" class="navbar__toggle clean-btn" type="button"><svg width="30" height="30" viewBox="0 0 30 30" aria-hidden="true"><path stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="2" d="M4 7h22M4 15h22M4 23h22"></path></svg></button><a class="navbar__brand" href="/"><div class="navbar__logo"><img src="/img/logo.svg" alt="FormatJS" class="themedComponent_OFbc themedComponent--light_zxLt"><img src="/img/logo-dark.svg" alt="FormatJS" class="themedComponent_OFbc themedComponent--dark_xGbw"></div><b class="navbar__title text--truncate">Format.JS</b></a><a class="navbar__item navbar__link" href="/docs/getting-started/installation">Docs</a><a class="navbar__item navbar__link" href="/docs/react-intl">API References</a><a class="navbar__item navbar__link" href="/docs/polyfills">Polyfills</a><a class="navbar__item navbar__link" href="/docs/tooling/cli">Tooling</a></div><div class="navbar__items navbar__items--right"><a href="https://github.com/formatjs/formatjs" target="_blank" rel="noopener noreferrer" class="navbar__item navbar__link">GitHub<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_sXrA"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a><div class="toggle_sxTc colorModeToggle__kgY"><button class="clean-btn toggleButton_wflL toggleButtonDisabled_ZvGB" type="button" disabled="" title="Switch between dark and light mode (currently light mode)" aria-label="Switch between dark and light mode (currently light mode)" aria-live="polite" aria-pressed="false"><svg viewBox="0 0 24 24" width="24" height="24" class="lightToggleIcon_vPUv"><path fill="currentColor" d="M12,9c1.65,0,3,1.35,3,3s-1.35,3-3,3s-3-1.35-3-3S10.35,9,12,9 M12,7c-2.76,0-5,2.24-5,5s2.24,5,5,5s5-2.24,5-5 S14.76,7,12,7L12,7z M2,13l2,0c0.55,0,1-0.45,1-1s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S1.45,13,2,13z M20,13l2,0c0.55,0,1-0.45,1-1 s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S19.45,13,20,13z M11,2v2c0,0.55,0.45,1,1,1s1-0.45,1-1V2c0-0.55-0.45-1-1-1S11,1.45,11,2z M11,20v2c0,0.55,0.45,1,1,1s1-0.45,1-1v-2c0-0.55-0.45-1-1-1C11.45,19,11,19.45,11,20z M5.99,4.58c-0.39-0.39-1.03-0.39-1.41,0 c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0s0.39-1.03,0-1.41L5.99,4.58z M18.36,16.95 c-0.39-0.39-1.03-0.39-1.41,0c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0c0.39-0.39,0.39-1.03,0-1.41 L18.36,16.95z M19.42,5.99c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06c-0.39,0.39-0.39,1.03,0,1.41 s1.03,0.39,1.41,0L19.42,5.99z M7.05,18.36c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06 c-0.39,0.39-0.39,1.03,0,1.41s1.03,0.39,1.41,0L7.05,18.36z"></path></svg><svg viewBox="0 0 24 24" width="24" height="24" class="darkToggleIcon_doU2"><path fill="currentColor" d="M9.37,5.51C9.19,6.15,9.1,6.82,9.1,7.5c0,4.08,3.32,7.4,7.4,7.4c0.68,0,1.35-0.09,1.99-0.27C17.45,17.19,14.93,19,12,19 c-3.86,0-7-3.14-7-7C5,9.07,6.81,6.55,9.37,5.51z M12,3c-4.97,0-9,4.03-9,9s4.03,9,9,9s9-4.03,9-9c0-0.46-0.04-0.92-0.1-1.36 c-0.98,1.37-2.58,2.26-4.4,2.26c-2.98,0-5.4-2.42-5.4-5.4c0-1.81,0.89-3.42,2.26-4.4C12.92,3.04,12.46,3,12,3L12,3z"></path></svg></button></div><div class="navbarSearchContainer_wRqb"><div class="navbar__search"><span aria-label="expand searchbar" role="button" class="search-icon" tabindex="0"></span><input id="search_input_react" type="search" placeholder="Loading..." aria-label="Search" class="navbar__search-input search-bar" disabled=""></div></div></div></div><div role="presentation" class="navbar-sidebar__backdrop"></div></nav><div id="__docusaurus_skipToContent_fallback" class="main-wrapper mainWrapper_OJvP"><header class="hero hero--primary heroBanner_UJJx" style="background-image:url(/img/splash-head.jpg)"><div class="container"><h1 class="hero__title"><img src="/img/logo-header.svg"></h1><p class="hero__subtitle heroSubtitle_GKHc">Internationalize your web apps on the client & server.</p><div class="demo_F90y"><p><span class="exampleTitle_sQvz">Example</span><span class="example_HLHF">Annie took no photos on April 1, 2025.</span></p><label># Photos<!-- --> <input type="number" value="0"></label><label>Locale<!-- --> <select><option value="cs-CZ">cs-CZ</option><option value="de-DE">de-DE</option><option value="en-US" selected="">en-US</option><option value="es-AR">es-AR</option><option value="fr-FR">fr-FR</option><option value="ja-JP">ja-JP</option><option value="pt-BR">pt-BR</option><option value="sv-SE">sv-SE</option></select></label></div><div class="buttons_pzbO"><a class="button button--outline button--secondary button--lg getStarted_Sjon" href="/docs/core-concepts/basic-internationalization-principles">Get Started</a></div></div></header><main class="features_keug"><div class="container"><div class="row"><div class="col col--4 intro_y8hm"><div class="layers_KOB3"><div class="layer_AnXp"><p>FORMATJS INTEGRATIONS</p></div><div class="layer_AnXp"><p>FORMATJS CORE LIBS</p></div><div class="layer_AnXp"><p>ECMA-402 + FORMATJS POLYFILLS</p></div></div><h3>FormatJS is a set of JavaScript libraries.</h3><p>FormatJS is a modular collection of JavaScript libraries for internationalization that are focused on formatting numbers, dates, and strings for displaying to people. It includes a set of core libraries that build on the JavaScript Intl built-ins and industry-wide i18n standards, plus a set of integrations for common template and component libraries.</p></div><div class="col col--4 integration_YciV"><div class="row imgs_h8Em"><a class="col col--4" href="https://formatjs.github.io/docs/react-intl"><img src="/img/react.svg" alt="React"></a><a class="col col--4" href="https://ember-intl.github.io/ember-intl/"><img src="/img/ember.svg" alt="Ember"></a><a class="col col--4" href="https://formatjs.github.io/docs/vue-intl"><img src="/img/vue-logo.svg" alt="Vue"></a></div><h3>Integrates with other libraries.</h3><p>For most web projects, internationalization happens in the template or view layer, so we've built integrations with React & Vue.</p></div><div class="col col--4 standards_iWjd"><img src="/img/js.svg"><h3>Built on standards.</h3><p>FormatJS is aligned with: <a href="https://www.ecma-international.org/ecma-402/">ECMAScript Internationalization API (ECMA-402)</a>, <a href="http://cldr.unicode.org/">Unicode CLDR</a>, and <a href="https://unicode-org.github.io/icu/userguide/format_parse/messages">ICU Message syntax</a>. By building on these industry standards, FormatJS leverages APIs in modern browsers and works with the message syntax used by professional translators.</p></div></div><div class="row"><div class="col col--12 env_pRIt"><div class="row logos_NYVn"><div class="col col--2"><img src="/img/chrome.png"></div><div class="col col--2"><img src="/img/firefox.png"></div><div class="col col--2"><img src="/img/safari.png"></div><div class="col col--2"><img src="/img/edge.png"></div><div class="col col--2"><img src="/img/ie11.png"></div><div class="col col--2"><img src="/img/node.svg"></div></div><h3>Runs in the browser and Node.js.</h3><p>FormatJS has been tested in all the major browsers (IE11, Chrome, FF & Safari) on both desktop and mobile devices. For many web apps rendering happens on the server, so we made sure FormatJS works perfectly in Node.js. This allows developers to use FormatJS on both the server and client-side of their apps.</p></div></div><div class="row"><div class="col col--12 showcase_SATw"><h3>Trusted by industry leaders.</h3><div class="row logos_NYVn"><div class="col col--2"><img src="/img/yahoo.svg"></div><div class="col col--2"><img src="/img/dropbox.svg"></div><div class="col col--2"><img src="/img/tinder.svg"></div><div class="col col--2"><img src="/img/ethereum.svg"></div><div class="col col--2"><img src="/img/mozilla.svg"></div><div class="col col--2"><img src="/img/coinbase.svg"></div></div></div></div></div></main></div><footer class="footer footer--dark"><div class="container container-fluid"><div class="row footer__links"><div class="col footer__col"><div class="footer__title">Docs</div><ul class="footer__items clean-list"><li class="footer__item"><a class="footer__link-item" href="/docs/getting-started/installation">Getting Started</a></li><li class="footer__item"><a class="footer__link-item" href="/docs/polyfills">Polyfills</a></li><li class="footer__item"><a class="footer__link-item" href="/docs/intl-messageformat">Libraries</a></li><li class="footer__item"><a class="footer__link-item" href="/docs/tooling/cli">Tooling</a></li></ul></div><div class="col footer__col"><div class="footer__title">Community</div><ul class="footer__items clean-list"><li class="footer__item"><a href="https://stackoverflow.com/questions/tagged/formatjs" target="_blank" rel="noopener noreferrer" class="footer__link-item">Stack Overflow<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_sXrA"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a></li><li class="footer__item"><a href="https://formatjs.slack.com/" target="_blank" rel="noopener noreferrer" class="footer__link-item">Slack<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_sXrA"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a></li></ul></div><div class="col footer__col"><div class="footer__title">Social</div><ul class="footer__items clean-list"><li class="footer__item"><a href="https://github.com/formatjs/formatjs" target="_blank" rel="noopener noreferrer" class="footer__link-item">GitHub<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_sXrA"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a></li></ul></div></div><div class="footer__bottom text--center"><div class="footer__copyright">Copyright © 2025 FormatJS. Built with Docusaurus.</div></div></div></footer></div>
</body>
</html>