Skip to content

kyaryunha/i18n-language.js

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

44 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

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>