i18n-language.js is Simple i18n language with Vanilla Javascript

Shin Hyun

Last update: Jul 12, 2022

Overview

i18n-language.js

i18n-language.js is Simple i18n language with Vanilla Javascript

Write by Hyun SHIN

Demo Page: http://i18n-language.s3-website.ap-northeast-2.amazonaws.com/

NPM Link: https://www.npmjs.com/package/i18n-language

Github Link: https://github.com/kyaryunha/i18n-language.js

Introduce

There are a lot of approaches to internationalization, but this project offers unique advantages like: followings.

Inline translation in HTML documents
Lightweight JS implementation in 48 lines
Written in pure HTML/CSS/JS so beginners can use it easily
When visiting for the first time, the language is set as the browser setting value, and if there is no setting value, English is displayed first
When the language is changed, it is stored in the local storage and displayed in the corresponding language when revisiting

Usage:

HTML

<!-- Example -->
<h4 data-lang="ko">
    바닐라 JS로 하는 간단한 다국어 지원
</h4>
<h4 data-lang="en">
    Simple i18n language with Vanilla JS
</h4>
<h4 data-lang="jp">
    バニラJSで簡単な多言語サポート
</h4>
<!-- How To Change Language -->
<select id="change-language">
    <option value="ko" selected="selected">
        Korean
    </option>
    <option value="en">
        English
    </option>
    <option value="jp">
        Japanese
    </option>
</select>

JS

Download i18n-language.js and write this code.

<script type="text/javascript" src="./i18n-language.js"></script>

If you want use just link,

<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/[email protected]/i18n-language.js"></script>

or minified version is

<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/[email protected]/i18n-language.min.js"></script>

Simple budget-tracker web app developed using Vanilla JavaScript. Exercise from Warren Tech Academy.

Willow Personal Finance - Exercise from Warren Tech Academy About Project screenshots Installation Extra notes About Tools: HTML CSS (SASS) JavaScript

Dec 14, 2022

Lightweight and simple notification library in Vanilla JavaScript.

SimpleNotification SimpleNotification is a library to display simple yet customizable notifications. You can stylize text with a simple syntax, add bu

Dec 11, 2022

A very simple JavaScript library written in vanilla js for scrambling text.

Scrambling Text A very simple JavaScript library written in vanilla js for scrambling text. Demo Page Table of Contents Installation Examples Basic Ex

Dec 7, 2022

🍦 ✨ Simple multi-select pure vanilla Javascript library.

multiSelect.js ✨ Simple multi-select pure vanilla Javascript library. 🚀 Live Demo v1.0.8 multiSelect.js is a simple, pure vanilla Javascript library

Mar 15, 2022

Simple vanilla javascript datatable

RdataTB simple vanilla javascript datatable Setup script src="https://cdn.jsdelivr.net/gh/Rakhmadi/RdataTB@master/dist/index.js"/script script

Jun 7, 2022

A simple easy to use vanilla JavaScript library for creating input fields that accept multiple email addresses

MeiMei - Multiple Email Input MeiMei: A simple easy to use vanilla JavaScript library for creating input fields that accept multiple email addresses.

Apr 13, 2022

Vanilla JavaScript tabs - tiny and simple.

Vanilla JavaScript Tabs Vanilla JavaScript Tabs - simple and awesome. — Inspired by the blazing fast, lightweight, cross-platform and crazy popular Va

Dec 22, 2022

It is a simple yet powerful to do list app in which you can add daily to-do tasks.you can edit, remove, check it to change its status to complete or not complete. it would save all the data and changes in local storage and track your daily tasks whether you have completed them or not.Built with vanilla JavaScript

To Do list - minimalist It is a simple yet powerful to do list app in which you can add daily to-do tasks. it would save all the data and changes in l

Oct 9, 2022

MenuSlider-Javascript - How to create a menu slider with vanilla javascript

MenuSlider-Javascript How to create a menu slider with vanilla javascript Instal

Feb 8, 2022

Comments

Fully support ISO 639-1

If no language was set by user, this library defaults to system language truncated to 2 characters, resulting 'en-US' and 'en-GB' to be both just 'en', or 'zh-CN' and 'zh-TW' to be both just 'zh'.
good first issue TODO

opened by shiftpsh 2
update 1.0.8 - change text & example about unpkg to jsdelivr, code is not changed.
Update

change example html (delete img, and use pre code)

change cdn about unpkg to jsdelivr because jsdelivr is more popular.

https://www.wappalyzer.com/compare/jsdelivr-vs-unpkg

you can still use unpkg , but I changed the description of the recommended way in the readme
opened by kyaryunha 0

Releases(1.0.8)

1.0.8(Jun 30, 2022)
change text & example about unpkg to jsdelivr

Update

change example html (delete img, and use pre code)

change cdn about unpkg to jsdelivr because jsdelivr is more popular.

https://www.wappalyzer.com/compare/jsdelivr-vs-unpkg

you can still use unpkg , but I changed the description of the recommended way in the readme.

Source code(tar.gz)
Source code(zip)