Wilhelm is a Quizlet alternative that helps with learning German, Ancient Greek, and Latin with 2 unique features:
- Applying historical fonts that is unique to each language
- Utilizing knowledge graph to visualize connections among Indo-European languages which greatly make multilingual study much more efficient
Please check out the app on wilhelm.qubitpi.org
Wilhelm started out as a Quizlet "companion" with no intent to be used by anyone other than myself.
I was studying Ancient Greek vocabulary on Quizlet the other day and got shockingly frustrated by their flashcards with this horribly formatted Greek text:
Quizlet didn't believe that each language shines with their unique fonts from history (such as 楷书 for Chinese, Gothic for Latin, and Fraktur for German). They simply applied a monofont for all languages which, in the case of Greek, made the text look terribly uncomfortable. I certainly disavowed it and decided to make my own flash card which ended up with much better visual like this:
Note
The new font above was inspired by the Zeph fonts invented by the Loeb Classical Library in Harvard University, who publishes Ancient Greek and Latin original texts I've been enjoying reading since I was a college student.
The Zeph fonts are based on 'Porson' Greek according to the information provided by Harvard University Press (HUP). But the Zeph* fonts themselves seem to be custom commissions for HUP for use in Loeb books, which means the fonts are close-sourced1.
The closest font I found, thus, is the GFS Porson for Ancient Greek which ended up being the Greek font I use for the flash cards in this project
Right after, I began to realize I could simply throw Quizlet to trash. I deleted my Quizlet account and relied solely on Wilhelm. I was happy that I found a lot more pleasure studying languages with Wilhelm than I did on Quizlet.
In the meantime, I've been interested in Indo-European languages. Having been concurrently studying Ancient Greek, Latin, and German, I got constantly well impressed by how these languages are connected in various interesting ways. I then believe making such connections between languages visually explicit shall boost people to learn multiple languages much faster.
Wilhelm has the following packages:
wilhelm-app
: holding business logics of the appwilhelm-redux
: managing all app states. Wilhelm uses Redux state management instead ofReact state managementfor a much more maintainable decoupling of React components
git clone [email protected]:QubitPi/wilhelm.git
cd wilhelm
Install dependencies by
Note
Node 18 and Yarn 2 must be installed in local environment.
yarn
yarn start
: Runs the app in development mode. Open http://localhost:3000 to view it in the browser. The page automatically reloads if we make changes to the code. we will see the build errors and lint warnings in the console.yarn test
: Runs the unit testsyarn cypress:open
&yarn e2e
: Opens Cypress End-to-End test console and runs the End-to-End tests, respectivelyyarn build
: Builds the app for production to the build folder. It correctly bundles React in production mode and optimizes the build for the best performance. The build is minified and the filenames include the hashes.
When CI/CD complains about "Code style check" as the following:
Simply run the following command at project root which will auto formatting the codebase using Prettier:
yarn prettier --ignore-path .gitignore . --write
sentry.io has been integrated into the wilhelm.qubitpi.org. Specifically:
- sourcemap is uploaded to sentry during build time
- error trace are sent to sentry during run time
While error trace will always be sent in production mode (process.env.NODE_ENV === "production"
), an
.env.sentry-build-plugin is, however,
required for yarn build
to be able to generate and upload the sourcemap.
Note
If the .env.sentry-build-plugin
is not present, yarn build
will still run successfully. It's just not possible
then to locate the exact location of error in code on sentry issue console because sourcemap hasn't been uploaded
The use and distribution terms for wilhelm are covered by the Apache License, Version 2.0.