Study Cards
An offline-first Progressive Web App (PWA) for practising JapaneseβEnglish sentence pairs.
β¨ Features
- π± Installable PWA: Works offline on mobile and desktop via Chrome.
- π Folder access: Choose a local folder to store your
.data files (plain text sentence pairs).
- π Reconnect: Reconnect to a previously chosen folder after restart.
- π Sync library: Download/update sets from the online
library/ hosted in this repo.
- π Delete state: Clear saved progress for a set (localStorage only).
- π Delete set: Remove the actual
.data file from the chosen folder.
- π Shuffle, Select, Reverse, Back step controls during practice.
- π Progress tracking: Saves your place and which side (JP/EN) is prompt.
Each set is a plain text file with extension .data:
NAME: Greetings
γγγ«γ‘γ―
Hello
γγγγ¨γγγγγΎγ
Thank you
γγΏγΎγγ
Excuse me
- First line optional
NAME: header defines the display name.
- Then pairs of lines: JP line then EN line.
- Separate pairs with one or more blank lines.
π Library sync
- The app fetches
library/index.json from GitHub Pages.
- Each file listed in the manifest is downloaded into the chosen folder.
- Sync policies: add new only, overwrite if changed, or force overwrite all.
- Default is overwrite if changed.
π Permissions
- Chrome will prompt to grant folder access.
- On Android, reconnecting may require tapping the π icon due to stricter permission rules.
- On desktop, folder permission is usually remembered.
π Development
- Built as a single-page HTML/JS app (
study_cards.html).
- Uses:
- File System Access API (Chrome)
- IndexedDB for persisting folder handles
- localStorage for saving progress
- Service Worker for offline caching
- No build step required.
π Installation
- Open GitHub Pages link.
- In Chrome desktop: Install app option appears in the address bar.
- In Chrome Android: menu β Open in Chrome Browser -> Add to home screen -> Install app.
π¨ Icons
icon-192.png and icon-512.png generated with ImageMagick for PWA manifest.
π License
MIT License Β© 2025