PopMots!

Introduction

Popmots is a local-first progressive web app that allows you to learn the 10000 most common French words with flashcards using spaced repetition.

You can study flashcards for each word. Each flashcard contain multiple meanings for the word along with examples and pronunctiation.

Data is stored locally, so no need of log in but if you want to use the app on a different device, you need to export your data and import it into the app on the other device.

Try it out at https://popmots.com !

Table of Contents

1. Features
2. Tech Stack
3. Improvements
4. Run locally

Features

• ~10000 most common words from my dictionary generator that uses lexique and kaikki databases.
• Schedule cards based on the fsrs spaced repetition algorithm.
• Rate flashcards by hard, good or easy to remember.
• 7 day forecast of due cards.
• Set the number of new cards and total due cards per day.
• Local audio.
• No required login/signups.
• Download/Upload popmots data.
• PWA and responsive design make it possible to install it in any device.
• Local-first PWA so data is fetched locally whenever possible.
• Works offline!

Tech Stack

• Sass
• Vue 3
• TypeScript
• Chart.js
• Spaced Repetition Scheduler
• IndexedDb
• Cloudflare Pages
• Cloudflare Functions
• Cloudflare D1 database

Improvements

• Store user progress in IndexedDB instead of localStorage.
• Option to login/signup for using the same data in different devices.
• Improve accessibility.
• Keyboard shorcuts.

Run locally

1. Create local database

npx wrangler d1 execute dictionary --local --file=./database/schema.sql

2. Run Vue app and wrangler functions in local mode on http://localhost:8788

npm run dev-wrangler