Top 16 JavaScript Localization Projects
-
Hybrids
-
next-translate
Next.js plugin + i18n API for Next.js 🌍 - Load page translations and use them in an easy way!
-
Appwrite
Appwrite - The Open Source Firebase alternative introduces iOS support . Appwrite is an open source backend server that helps you build native iOS applications much faster with realtime APIs for authentication, databases, files storage, cloud functions and much more!
-
Project mention: Show HN: Localization and translations should be code, not data | news.ycombinator.com | 2022-07-05
It's a tempting argument. By interviewing hundreds of people a different pattern emerged though. Translators don't know how to code. Some companies manually removed quotation marks (") from strings because they confused translators.
What do you think about Mozilla's Fluent format/syntax https://projectfluent.org/?
BTW feel free to reach out via email to me. Look at my profile to find it.
-
gatsby-plugin-intl
Gatsby plugin that turns your website into an internationalization-framework out of the box.
Project mention: best practices and tips for localization and internationalization with Gatsby | reddit.com/r/gatsbyjs | 2021-12-22 -
Is there anything forcing you to use Angular’s i18n support?
I use ttag (https://ttag.js.org) with React and like it. I don’t see any reason you couldn’t use it (or another library) with Angular.
-
svelte-intl-precompile
I18n library for Svelte.js that analyzes your keys at build time for max performance and minimal footprint
I would like there to be an baked-in solution, but for now I'm looking at Svelte Intl Precompile and Svelte i18n. They look very promising, but they are not baked-in.
-
react-translated
A dead simple way to add complex translations (i18n) in a React (DOM/Native) project 🌎🌍🌏
-
Scout APM
Less time debugging, more time building. Scout APM allows you to find and fix performance issues with no hassle. Now with error monitoring and external services monitoring, Scout is a developer's best friend when it comes to application development.
-
-
to launch odas studio, but it said it was frequently crashing. I changed the contents in the package.json file to this: { "name": "odas_studio", "version": "0.3.0", "description": "A desktop GUI for the ODAS library", "main": "main.js", "scripts": { "start": "electron .", "postinstall": "./node_modules/.bin/electron-rebuild" }, "author": "Cedric Godin", "license": "MIT", "devDependencies": { "electron": "^15.3.0", "electron-rebuild": "^3.2.3" }, "dependencies": { "@google-cloud/speech": "^4.9.0", "grpc": "^1.24.2", "ip": "^1.1.5", "mathjs": "^9.5.1", "node-localstorage": "^1.3.1", "systeminformation": "^5.9.8", "wav": "^1.0.2", "wav-file-info": "0.0.8" }, "repository": { "type": "git", "url": "https://github.com/introlab/odas_web.git" } } I got the above code from this link. Credits to User zholondz. However, despite being able to launch odas studio, none of the buttons work on the interface. I cannot select the core or config file and the launch button does not work. The Local System Monitor only displays the value 0 for each category. I followed the instructions on this link. I believe my core and config are not in the exact same directory as what it says in the instructions, but even if I changed their locations, it still does not work. Any help and additional questions are welcome.
-
-
Project mention: Ask HN: Those making $500/month on side projects in 2021 – Show and tell | news.ycombinator.com | 2021-12-23
It actually doesn't determine it by the country the request is coming from.
How it works is fully documented here: https://github.com/ladjs/i18n#i18nmiddlewarectx-next
1) Check URL (e.g. if /de or /de/ then it's a de locale - as long as de is a supported locale)
-
Project mention: I want multiple language support for my React project, what's the best way of doing it? | reddit.com/r/reactjs | 2022-02-09
Here is a working example of React app with multiple languages: https://github.com/localizely/react-intl-example
-
We followed the steps from this article for our NextJS website translation https://localizely.com/blog/nextjs-i18n-tutorial/
-
javascript-i18next-example
Example repository demonstrating how to integrate Localazy with your javascript app using the i18next library
-
Project mention: How to properly internationalize a Vue application using i18next | dev.to | 2022-05-15
import I18NextVue from 'i18next-vue' import i18next from 'i18next' import Backend from 'i18next-locize-backend' import LanguageDetector from 'i18next-browser-languagedetector' import LastUsed from 'locize-lastused' import { locizePlugin } from 'locize' const isProduction = process.env.NODE_ENV === 'production' const locizeOptions = { projectId: process.env.VUE_APP_LOCIZE_PROJECTID, apiKey: process.env.VUE_APP_LOCIZE_APIKEY, // YOU should not expose your apps API key to production!!! version: process.env.VUE_APP_LOCIZE_VERSION } if (!isProduction) { // locize-lastused // sets a timestamp of last access on every translation segment on locize // -> safely remove the ones not being touched for weeks/months // https://github.com/locize/locize-lastused i18next.use(LastUsed); } export const i18nextPromise = i18next // locize-editor // InContext Editor of locize .use(locizePlugin) // i18next-locize-backend // loads translations from your project, saves new keys to it (saveMissing: true) // https://github.com/locize/i18next-locize-backend .use(Backend) // detect user language // learn more: https://github.com/i18next/i18next-browser-languageDetector .use(LanguageDetector) // init i18next // for all options read: https://www.i18next.com/overview/configuration-options .init({ debug: !isProduction, fallbackLng: 'en', saveMissing: !isProduction, backend: locizeOptions, locizeLastUsed: locizeOptions }) export default function (app) { app.use(I18NextVue, { i18next }) return app }
-
Project mention: Uni Localization on web components with absolute customization. Works on any website (Vue, React, Angular and even WordPress) | dev.to | 2021-12-28
React - for the create-react-app integration is as simple as possible. Connect the necessary scripts in the index.html. That's it!
JavaScript Localization related posts
- SvelteKit internationalization
- Translate NextJS website
- I18N in the Multiverse of Formats
- Travelm-Agency Updates (Fluent, Webpack)
- Super fast React Localization 🌍 (i18n) with i18next and Tolgee 🐁
- best practices and tips for localization and internationalization with Gatsby
- Using invisible text for better localization
Index
What are some of the best open-source Localization projects in JavaScript? This list will help you:
| Project | Stars | |
|---|---|---|
| 1 | hybrids | 2,665 |
| 2 | next-translate | 1,761 |
| 3 | fluent.js | 765 |
| 4 | gatsby-plugin-intl | 317 |
| 5 | ttag | 295 |
| 6 | svelte-intl-precompile | 230 |
| 7 | react-translated | 180 |
| 8 | react-i18nify | 130 |
| 9 | odas_web | 106 |
| 10 | transai | 57 |
| 11 | i18n | 8 |
| 12 | react-intl-example | 7 |
| 13 | nextjs-i18n-example | 5 |
| 14 | javascript-i18next-example | 3 |
| 15 | locize-lastused | 2 |
| 16 | localize-react | 1 |
Are you hiring? Post a new remote job listing for free.
