Interval Repeat Flashcard Demo with Basic Simple Features Designed based on Next.js App Router, ts-fsrs, and Prisma.

use packages:

- prisma (global) npm install -g prisma
- dotenv (global) npm install -g dotenv
- next.js (>= 14.2.0)
- ts-fsrs (>= 3.2.1)
- tailwindcss (>= 3)
- daisyui (>= 4.4.22)

 An environment variable is a key value pair of string data that is stored on your machine's local environment. Refer to our Environment variables reference documentation for specific details.

Ref(prisma docs): https://www.prisma.io/docs/guides/development-environment/environment-variables

 .env.local  

DATABASE_URL="mysql://username:password@localhost:3306/fsrsDemo"
DATABASE_URL_WITH_SCHEMA=${DATABASE_URL}?schema=fsrsDemo

NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=**** # openssl rand -base64 32

• Configure the database environment and use npm run dbpush
• Run demo

npm run dev # or yarn dev/ pnpm dev/ bun dev

• Open localhost:3000
• Sign In

Tip: ts-fsrs version:3.3.0

You can view the added note information and status here, and click on each note to enter the detailed note page.

You can view detailed information about the note on this page, and you can click "forget" to reset the learning status of that card.

You can perform review operations on the review page, and it is possible to display the answer using the keyboard. You can also schedule the timing and use Ctrl+Z or ⌘+Z to undo or revert the operation.

After completing the review, you will be prompted accordingly.

Click on the avatar, and you can set up, log out, and adjust the theme.

You can customize the parameters of your FSRS params

You can compile the demo for better performance by using npm run build, and then start the project using npm run start.