A full-stack flashcard application built with C# Web API, Entity Framework Core, SQLite, and Vue.js. The application implements the SM-2 spaced repetition algorithm to help users learn and remember information more effectively.
- Create, read, update, and delete flashcards
- Study flashcards using the SM-2 spaced repetition algorithm
- Track progress and review history
- Responsive UI for desktop and mobile devices
- .NET Web API
- Entity Framework Core
- SQLite Database
- C# 9.0+
- Vue.js 3
- Vue Router
- Pinia (State Management)
- Bootstrap 5
- Axios
flashcards/
├── backend/ # .NET Web API project
│ ├── FlashcardApi/ # Main API project
│ │ ├── Controllers/ # API controllers
│ │ ├── Models/ # Domain models
│ │ ├── Data/ # EF Core context and migrations
│ │ ├── Services/ # Business logic services
│ │ ├── Program.cs # Application entry point
│ │ ├── appsettings.json # Configuration
│ │ └── FlashcardApi.csproj # Project file
│ └── FlashcardApi.sln # Solution file
│
└── frontend/ # Vue.js frontend
├── public/ # Static assets
├── src/ # Vue source code
│ ├── assets/ # Frontend assets
│ ├── components/ # Vue components
│ ├── views/ # Vue views/pages
│ ├── services/ # API services
│ ├── App.vue # Root component
│ └── main.js # Entry point
├── package.json # NPM dependencies
└── vite.config.js # Vite configuration
This application implements the SM-2 algorithm for spaced repetition, which works as follows:
-
After each review, the user rates their recall quality on a scale of 0-5:
- 0: Complete blackout
- 1: Incorrect response; the correct one remembered
- 2: Incorrect response; where the correct one seemed easy to recall
- 3: Correct response, but with difficulty
- 4: Correct response, after some hesitation
- 5: Perfect response
-
Based on this rating, the algorithm calculates:
- The new "easiness factor" (EF)
- The interval before the next review
- Whether to reset the repetition count
-
Cards with lower ratings are shown more frequently, while well-known cards are shown less often.
-
Navigate to the backend directory:
cd backend -
Run the API:
cd FlashcardApi dotnet run -
The API will be available at
http://localhost:5046/api
-
Navigate to the frontend directory:
cd frontend -
Install dependencies:
npm install -
Run the development server:
npm run dev -
The frontend will be available at
http://localhost:5173(or another port if 5173 is in use)
The application uses SQLite for data storage. The database file is created in the backend directory when the application runs for the first time.
MIT