Skip to content

remidebette/your-furigana

Repository files navigation

Your Furigana

A reading helper for Japanese intermediate learners

About

Intermediate learners of Japanese want to be able to read text that contains chinese characters, the Kanji.

To help with the reading of a particular character, the Japanese writing system comes with "Furigana", pronunciation help written on top of rare Kanji:

日本にほん

Usually, reading japanese text, the delicate situation of the intermediate learner is that he does not want to be reminded of the pronunciations of Kanji he already learned, since he is trying to master them.

On the contrary, Furigana can be a precious tool when one wishes to read real-life Japanese text which never contains only text he might already know.

Today, Kanji memorisation apps (such as Wanikani) can provide to a user a list of the known Kanji pronunciations at a certain time. With Your Furigana, the user can input this list as a CSV and copy-paste any Japanese text from the Web to get just the help he needs to read through it.

A sample PoC page is deployed here.
This is shared as a showcase of a Next.js architecture

Test it by copying and pasting this sample CSV file to the Readings tab and any text from a Wikipedia random page in Japanese to the Text tab!

Features

React.js hooks

  • The best way to handle state in React.

Next.js

  • Makes the Server Side Rendering and development of React apps a pleasure.

React Bootstrap

  • The composable front end framework Bootstrap adapted for React.

Kuroshiro

  • A pure JavaScript Japanese Tokenizer.

Kuromoji

  • A Japanese Dictionary used as a morphological analyzer for Kuroshiro.

React Papaparse

  • The powerful, in-browser React CSV parser for big boys and girls.

Next PWA

  • Easily create a Progressive Web App with Next.js.

Vercel Deployment

  • Ready to deploy on Vercel using git integration or the command line

Installation

Clone the repository and install the dependencies:

git clone https://github.com/remidebette/your-furigana && yarn && yarn dev

Usage

Development

Serve with hot reload at localhost:3000.

yarn dev

Build

Build for production: next.js automatically renders static HTML pages when possible. Then if you deploy on Vercel you can have both statically rendered pages and server-side rendered pages (as lambdas functions).

yarn build

Launch a server for server-side rendering (after building the application):

yarn start

Generate a fully static project with pre-rendered pages to put directly on a server or any static website hosting platform. Note that you lose the possibility to have server-side rendered pages. With Vercel you should not have to run this command.

yarn export

License

Released under the MIT license.

About

A reading helper for Japanese intermediate learners

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published