Skip to content

brimstone-js/brimstone

Repository files navigation

Brimstone

A simple React translation library.

GitHub package.json version Node.js CI CodeQL

JavaScript Style Guide

Introduction

Brimstone is an easy-to-use translation library that uses React context to change text across your entire app when the language is changed.

Usage

Place the TranslationContext at the root of your application

import { Language, TranslationContext } from '@brimstone/react'
import { useState } from 'react'

function App() {
  const [language, setLanguage] = useState<Language>()

  return (
    <TranslationContext.Provider value={{
      language,
      setLanguage
    }}>
      ...
    </TranslationContext>
  )
}

Use the Translate component anywhere to render the current language

import { Translate } from '@brimstone/react'

function MyComponent() {
  return (
    <div>
      <h1>
        <Translate
          eng="Welcome to my website!"
          spa="¡Bienvenido a mi sito web!"
          deu="Willkommen in meiner Website!"
        />
      </h1>
    </div>
  )
}

Demo

View a live demo here

Development

Requirements

NPM Scripts

Run npm install first to install package dependencies.

  • npm run lint - Run the StandardJS linter to check for warnings and errors
  • npm run build - Build the library to the dist folder
  • npm test - Run the Jest testing suite

License

Distributed under the MIT License. See LICENSE for more information.