Coder Social home page Coder Social logo

h16nning / skola Goto Github PK

View Code? Open in Web Editor NEW
9.0 2.0 1.0 2.47 MB

A web based spaced repetition app

Home Page:

HTML 0.29% CSS 29.35% TypeScript 68.92% JavaScript 1.43%
spaced-repetition flashcards react active-recall mantine-ui learn spaced-repetition-flashcards free-spaced-repetition-scheduler flashcard-application studying

skola's People


dependabot[bot] avatar emerzh avatar h16nning avatar


 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar


 avatar  avatar



skola's Issues

Rewrite of card leaning / scheduling and migration to FSRS

This is a big one.

The current implementation of learning and scheduling needs a complete rewrite because it is pretty messy and buggy.

Right now the SM2 algorithm is used. It is relatively old (I think 1987). Recently the free open-source algorithm Free Spaced Repetition Scheduler (FSRS) has been released. It is significantly more accurate than SM2 and based on scientific research. Ankis newest version offers a switch to this scheduler as well. There is already a JS implementation and another person is working on a Typescript version.

Additional explanation on the algorithm

I figured a rewrite would be a good opportunity to switch to FSRS.

Image occlusion cards

  • similar implementation to cloze cards
  • save image and position / width of divs in a shared value
  • only safe reference to specific div in card

Fix the hard option

The option hard in learning does nearly exactly the same as the again option. The option hard shouldn't reset the interval to 0 if the card as already been repeated correctly for multiple times.

Sound Card

It's probably not a priority... even for me :p

but I stumble upon this ... and thought hey, but this (is nice) should be a flashcard deck 🤔 ...

and it seems anki as one 😲 ...
so why not have some sound support... this could be "easy" since we have attachments already ...

Move subdecks

@eMerzh Now that we have an alternative way in place to access lower-order decks, the subdeck section could be moved. However, on smaller screen we still need some access to it. Do you have any idea where to put it?

App icon

Create an app icon and show in the sidebar

Overhaul settings

  • Settings should save their contents in local storage or using dexie.js (db.settings)
  • Possible settings
    • light / dark mode preference
    • user name

"Duplicate" cards

Related cards will appear each on their own which can lead to duplicate entries seemingly appearing multiple times.

Relevant in spotlight search (#63) and notebook.

React Router: Should have a queue.

On first update, only on mobile devices (not screen-size dependent):

React Router caught the following error during render Error: Should have a queue. This is likely a bug in React. Please file an issue.

Header Bar on mobile

As discussed in #8 navigation is still limited without the sidebar, so a header of some sort is needed.


  • hamburger icon (collapse / open sidebar)
  • back button (forward button too?)
  • move respective three dot option menus from different views to top right

Save creation date

  • Save the creation date (and possibly the last edited date)
  • Make it possible to search by creation date
  • Show cards in learning view sorted by creation date

Improving the add cards experience

Adding cards is a pretty bare-bones experience right now, for several reasons. Plans to improve it:

  • Add a shortcut / translations to change card type
  • When changing card type try to transfer contents of input fields.
  • #125
  • Add a fixed footer and move the add cards button there
  • Add an history option to quickly go back to the previously created cards and edit them. Might be enough to refer to NoteManagerView with creationDate set.
Bildschirmfoto 2024-03-12 um 23 16 37
  • Add a new line floating menu to accompany the bubble menu. Consider removing the toolbar after this.


  • Add the import cards button here too
  • Dont't show double sided card as a selectable option in card type dropdown. Instead have a simple checkbox like "Test from both sides" or so

Better keyboard support

  • correct tab order when creating new cards (don't tab into controls toolbar)
  • hotkey to trigger actions (e. g. "space" to trigger learn and "n" to add cards on DeckView) using mantine use-hotkeys

Fonts sometimes don't load correctly


After #67 local fonts aren't always loaded correctly and will resort to system default sans-serif / serif.

This doesn't always happen, actually quite inconsistently, usually after multiple page reloads after each other.

Reproced it in chromium-based, webkit-based and firefox browsers.

Console logs

Bildschirmfoto 2024-02-22 um 21 05 13

Bildschirmfoto 2024-02-22 um 21 11 04

I haven't figured out yet why it occurs. I suppose something with vites static imports?

Menu in Notebook view

Hello @h16nning 👋
I see you are playing with combo; sorting & stuff in notebook view...

to takes from mochi :p
i kinda like the "options" there... allthough it's obviously "a lot" of options, maybe we don't need all that now

Capture d’écran 2024-02-14 à 20 14 42 maybe in combination with sort options? Capture d’écran 2024-02-14 à 20 15 06

i was thinking for us, cool starting options could be:

  • show all side
  • show sub decks
  • sort options like you did

Sanitize content in dangerouslySetInnerHTML

As the workflow warns, maybe dangerouslySetInnerHTML is problematic...

I don't think it does matter so much right now but maybe DOMPurify is an option to be future-proof

deleteDeck doesn't work correctly

If deleteDeck is called for a deck which has sub decks it won't remove the id of the deck itself from the parent's subdecks list.

Try solving this by using Promise.all.

Cloze card preview

As mentioned in #63, the cloze card preview does look a little ugly. I think we could just remove the {{::}} stuff

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.