Awesome
flashcard
VueJS components to add spaced-repetition based flashcard to any webpage. Less than 5KB gzipped, and 15KB unzipped.
Authors can create their article in a medium that helps their readers not just read, but also REMEMBER their content. These components make it super-easy to achieve this without requiring any servers. LocalStorage is used to store user's progress on each question.
In your webpage, you would use the CardSet
component specifying a bunch of question-answer pairs, and it will
use localStorage to store user's recall performance in order to determine practice frequency.
See FlashCard.vue and CardSet.vue to learn more about how this works.
This was inspired by https://ncase.me/remember/ and https://quantum.country
Build
The UMD files (which also includes CSS) in dist
folder are generated with:
Build: ./node_modules/.bin/vue-cli-service build --target lib --name CardSet components/CardSet.vue
Test: demo.html
TODO: The Web component build is currently not working correctly.
Build: ./node_modules/.bin/vue-cli-service build --target wc --name fc 'components/*.vue'
Test: webcomp.html