• Townie
    AI
  • Blog
  • Docs
  • Pricing
  • We’re hiring!
Log inSign up
jonmaim

jonmaim

flashcard

anki-style flash cards
Public
Like
flashcard
Home
Code
10
backend
4
frontend
3
shared
2
.vtignore
AGENTS.md
ARCHITECTURE.md
GETTING_STARTED.md
README.md
deno.json
H
main.ts
Branches
1
Pull requests
Remixes
History
Environment variables
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in milliseconds.
Sign up now
Code
/
README.md
Code
/
README.md
Search
…
README.md

πŸ“š Flashcard Learning App

A full-featured flashcard application with spaced repetition learning, built for Val Town.

Features

✨ Core Functionality

  • Deck Management: Create, edit, and delete flashcard decks
  • Card Creation: Add unlimited flashcards with front (question) and back (answer)
  • Spaced Repetition: Smart learning algorithm (SM-2) that shows cards at optimal intervals
  • Study Sessions: Intuitive study mode with card flipping and 4-level difficulty ratings
  • Statistics: Track your learning progress with detailed metrics
  • Backup & Restore: Export/import your data as JSON

🎯 Spaced Repetition System

Uses the proven SM-2 algorithm (same foundation as Anki) to optimize your learning:

  • Again: Didn't remember - Review again soon
  • Hard: Remembered with difficulty - Review in a few days
  • Good: Remembered correctly - Review at normal interval
  • Easy: Remembered instantly - Review much later

Cards become easier or harder based on your performance, maximizing retention while minimizing study time.

πŸ“Š Statistics & Tracking

  • Total cards created across all decks
  • Total reviews completed
  • Total study time
  • Average accuracy percentage
  • Detailed session history with per-deck performance

πŸ’Ύ Data Management

  • Username-based login (no password required)
  • Per-user data isolation using Val Town blob storage
  • JSON backup/restore for data portability
  • All data stored securely in Val Town's infrastructure

Usage

Getting Started

  1. Login: Enter any username (creates new user if doesn't exist)
  2. Create a Deck: Click "Create Deck" and give it a name
  3. Add Cards: Open your deck and add flashcards (front and back)
  4. Study: Click "Study" to begin learning with spaced repetition
  5. Track Progress: View your statistics to see your learning journey

Study Mode

  1. Read the question (front of card)
  2. Try to recall the answer
  3. Click "Show Answer" to flip the card
  4. Rate your recall:
    • Again (red): Didn't remember
    • Hard (orange): Remembered with difficulty
    • Good (green): Remembered correctly
    • Easy (blue): Remembered instantly
  5. The algorithm schedules the next review based on your rating

Backup Your Data

  1. Click "Backup" in the navigation
  2. Click "Download Backup" to export as JSON
  3. Save the file somewhere safe
  4. To restore: Select the file and click "Restore Backup"

Project Structure

flashcard/
β”œβ”€β”€ main.ts                    # Entry point
β”œβ”€β”€ README.md                  # This file
β”œβ”€β”€ ARCHITECTURE.md            # Detailed technical documentation
β”œβ”€β”€ backend/
β”‚   β”œβ”€β”€ index.ts              # Hono app and route setup
β”‚   β”œβ”€β”€ storage.ts            # Blob storage utilities
β”‚   └── routes/
β”‚       β”œβ”€β”€ auth.ts           # User authentication
β”‚       β”œβ”€β”€ decks.ts          # Deck CRUD
β”‚       β”œβ”€β”€ cards.ts          # Card CRUD
β”‚       β”œβ”€β”€ study.ts          # Study sessions and SM-2
β”‚       β”œβ”€β”€ stats.ts          # Statistics and tracking
β”‚       └── backup.ts         # Data export/import
β”œβ”€β”€ frontend/
β”‚   β”œβ”€β”€ index.html            # Single-page app UI
β”‚   └── index.js              # Client-side logic
└── shared/
    └── types.ts              # Shared types and SR algorithm

Technology Stack

  • Backend: Hono (lightweight web framework)
  • Frontend: Vanilla JavaScript + TailwindCSS
  • Storage: Val Town Blob Storage
  • Runtime: Deno (Val Town platform)
  • Algorithm: SM-2 Spaced Repetition

Key Design Decisions

Why Blob Storage?

  • Simple per-user isolation
  • Fast single-fetch loading
  • No schema migrations
  • Perfect for personal-scale apps

Why Vanilla JavaScript?

  • Lightweight (no framework overhead)
  • Simple to understand and modify
  • Fast load times
  • No build step needed

Why SM-2 Algorithm?

  • Proven effective (used by Anki)
  • Well-documented and understood
  • Simple to implement
  • Excellent for long-term retention

API Endpoints

All endpoints require X-Username header (except login).

  • POST /api/auth/login - Login/create user
  • GET/POST/PUT/DELETE /api/decks - Manage decks
  • GET/POST/PUT/DELETE /api/cards - Manage cards
  • GET /api/study/:deckId - Get due cards
  • POST /api/study/review - Record card review
  • GET /api/stats - Get statistics
  • POST /api/stats/sessions - Save study session
  • GET /api/backup - Export data
  • POST /api/backup/restore - Import data

See ARCHITECTURE.md for detailed API documentation.

Development

Running Locally

# This is designed for Val Town's platform # To run locally, you'd need Val Town's SDK and blob storage emulator

Deployment to Val Town

  1. Upload all project files to Val Town
  2. Set main.ts as the entry point
  3. Configure as an HTTP Val
  4. No environment variables needed

Testing

  • Use Val Town's preview feature to test in real-time
  • Create test decks and cards
  • Try the study mode with different ratings
  • Verify statistics update correctly
  • Test backup/restore functionality

Future Enhancements

Potential features to add:

  • Image support in cards (using Val Town's AI image generation)
  • Audio pronunciation
  • Deck sharing/templates
  • Card tagging and search
  • Dark mode
  • Keyboard shortcuts
  • Study heatmap calendar
  • Review forecast
  • Cloze deletion cards
  • Bulk CSV import
  • Progressive Web App (offline mode)

Learning Resources

About Spaced Repetition

  • Spaced Repetition on Wikipedia
  • SuperMemo Algorithm
  • Anki Manual

Val Town

  • Val Town Documentation
  • Val Town Blog

License

This project is built for Val Town and is free to use, modify, and distribute.

Credits

Built with ❀️ for effective learning through spaced repetition.

Algorithm based on SuperMemo's SM-2, popularized by Anki.


Happy Learning! πŸš€

FeaturesVersion controlCode intelligenceCLI
Use cases
TeamsAI agentsSlackGTM
DocsShowcaseTemplatesNewestTrendingAPI examplesNPM packages
PricingNewsletterBlogAboutCareers
We’re hiring!
Brandhi@val.townStatus
X (Twitter)
Discord community
GitHub discussions
YouTube channel
Bluesky
Open Source Pledge
Terms of usePrivacy policyAbuse contact
Β© 2025 Val Town, Inc.