A browser-based webapp to facilitate studying Japanese counters. A lightweight app inspired by the simplicity of WaniKani, this application allows the user to select packs of counters they would like to study, and then presents a quiz with random amounts of random items, requiring the user to correctly count the specified item in Japanese.
These instructions will get you a copy of the project up and running on your local machine for development and deployment.
The project uses Yarn for package management.
Additionally, if you're going to be changing the favicon, make sure to globally install cli-real-favicon.
yarn global add cli-real-favicon
I haven't found a way to get this to work without being a global installation.
- Clone the repo
git clone https://github.com/ahlec/jyosuushi.git
- Install packages
yarn install
- Start the development server
yarn start
At this point, you can navigate to http://localhost:8080/. As of right now, there is no persistence of data on a server or backend, so no setup of this kind is necessary for running or deployment.
Out of the box, the repository is configured to run locally in a development environment, in order to facilitate easily onboarding into the project.
Understandably, the default configuration values are not suitable for production environments. A valid set of default production values is maintained in /prod.jyosuushirc. When working on a production environment, remove the prefix to this filename:
mv prod.jyosuushirc .jyosuushircNote that there are some fields in this file which are required to fill out and that the file isn't guaranteed or expected to work without some modification.
When running the server in production mode (NODE_ENV=production), the server will throw an error if an explicit cosmiconfig config for jyosuushi can not be found, as a safety measure.
When you're ready to publish the webapp, all you need to do is build the application.
yarn build
This will create the build/ directory. On a successful build execution, copy the build/ directory to a web directory on your server.
If you find yourself needing to change the favicon, export the full-resolution file to the root favicon.png file. After that, use the package script to generate the various favicon files.
yarn favicon
All of the data for the application is managed through a SQLite database for ease of use; the database allows us to have oversight in the way of foreign and unique keys while also cutting down to the bare minimum of necessary boilerplate.
The database itself is not committed to the repository because, as a binary file, resolving merge conflicts is nigh impossible. Instead, we store the SQL files for the contents and can rebuild the database at any moment.
When you're working on data, the first step will be creating your local database.
yarn db:create
This will create a local database (deleting the file that was there before, so make sure to dump your changes if you had any!) and will also pull in all of the changes to your database to bring it up to date.
You then modify the SQLite database jyosuushi.sqlite in the root directory directly. When you have made your changes, you'll then need to run the script to export the data from there into TypeScript.
yarn db:export
When this is done, it will update the files in the ./data directory. Subsequent builds or development servers will build against these updated files. Additionally, these files are tracked in the repository to allow for painlessly building after cloning the repository.
When you are ready to submit a commit, you will need to dump all of your database back to the SQL files. To do this, you'll want to use another package script:
yarn db:dump
- TypeScript
- React - The web framework for the application
- Redux - State management for the application
- webpack - Module bundler and build system
- Yarn - Package management
- SQLite - Pre-build database for quiz data
We use SemVer for versioning. For the versions available, see the tags on this repository.
- Alec Deitloff - Initial work - ahlec
See also the list of contributors who participated in this project.
This project is licensed under the MIT License - see the LICENSE.md file for details
- WaniKani - Inspiration and a constant guiding light
- jquery-kana-input - Implementation basis for making a kana-based input box