Hakubun

A cross-platform, third-party Japanese Study App for Wanikani

Report Bug 🐛 · Request Feature 🚀

Android Beta App · iOS Beta App

Features 🌟 · Contributing 🏆 · Development 🖥️ · License 📓 · Credits 🥇

Overview

Hakubun is a Japanese learning app that can be used with Wanikani, an SRS-based Japanese learning service. Learn and review radicals, kanji, and vocabulary, easily search for subjects, and explore content across levels.

Download the App :zap:

The web version is still being tested, but the beta versions of both Android and iOS are available to download!

• Android App on Play Store, available through Early Access
• iOS App on Testflight

Features :star2:

Interface

• Use swipe gestures or keyboard shortcuts to submit or retry answers
• Cross-platform, web-based app with native-like interactions and animations
• Light or dark theme options

Reviews and Lessons

• Review or learn by subject
  • Radical, kanji, vocabulary, kana vocabulary
• Select specific items to review or learn
• Batch size selection
• Shuffle or sort by SRS stage, level, available date, date updated
• Option to filter subjects by current level
• Go to next item on correct answer
• Typo tolerance

Reviews

• Back to back ordering: change card order in queue
  • Meaning then reading
  • Reading then meaning
  • Disabled (shuffled)
• Wrap-up mode: finish up the reviews you started on, unreviewed are removed from queue

Privacy Policy/Information Collected

Hakubun uses Logrocket, a log collecting tool, to detect common errors that users are experiencing.

This means the following information may be stored:

• Username
• Errors encountered
• User actions in app (for example: how often user visits a page)

The following information is NOT stored and I will never be able to access to it:

• API tokens
• User location data
• User's name or other sensitive data

Please email me if you have any questions or concerns about how/what data is stored.

Screenshots :camera_flash:

Home

Lessons

Reviews

Subjects

Search

Subject Details

Contributing :trophy:

Contributions are appreciated! See this doc for full details on how to contribute, and the development section for how to build and test Hakubun

Development :desktop_computer:

Formatting and Linting :sparkles:

# Verify files are formatted correctly
npm run check-format

# If formatting issues...
npm run format

# Make sure no linting errors
npm run lint-err-only

# Make sure no TypeScript errors
npm run tsc-check

Building the App :hammer:

Make sure to run npm install before trying the steps below!

Web Version

Building using this method for general development is highly recommended over the iOS and Android methods, it's much easier to debug and inspect changes. Running the app with iOS and Android simulators is only recommended to double-check that the changes you made are compatible with both platforms.

Start server:

npm run start

The app should then be available at http://localhost:5173/

iOS and Android Simulators (with Hot Reload)

If below doesn't work, check that network URL after displayed after running npm run start-exposed matches the URL in the capacitor.config.ts file

Start server in one terminal:

npm run start-exposed

Then run the script for the platform in another terminal:

iOS

npm run ios-live-reload

You can then select the type of iOS device you'd like to use as a simulator

To view debug info (inspect elements, view console output)

• If you've never done this before, you'll likely have to the make sure "Show features for web developers" is enabled under Safari's Settings

  

• Open Safari and click the iOS simulator for Hakubun under Develop -> iOS device you chose as simulator -> IP address displayed. If this is not displayed, make sure you followed the previous step. If it's still not displayed, opening Xcode can sometimes make it appear

  

Android

npm run android-live-reload

To view debug info (inspect elements, view console output)

• In Chrome, go to chrome://inspect/#devices

• An address should be available under "Remote Target", you can click on "inspect" to bring up a web inspector. This can be used to inspect elements and view console output

  

Testing

Unit Testing

To run all unit tests:

npm run test

Device Testing for Android, iOS, etc.

This project is tested with BrowserStack

Running Fastlane

Note: it's unlikely you'll need to know this info, just used for GitHub workflows/CICD

Fastlane is a tool used to build and deploy the Android and iOS apps for Hakubun.

Install Dependencies

bundle install

Running Lanes

To run android lanes:

fastlane android <LANE>

To run iOS lanes:

fastlane ios <LANE>

License :notebook:

This project uses GPLv3, a copyleft license. Essentially this means that the source code for this app and all further iterations must stay free and open-source. See license file for complete license information.

Credits :1st_place_medal:

• Logo by Caleb Walsh
• Icons by Icons8
• Pitch Accent Info from Jotoba API