Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ishiko732/ts-fsrs-demo
Interval Repeat Flashcard Demo with Basic Simple Features Designed based on Next.js App Router, ts-fsrs, fsrs-browser and Prisma.
https://github.com/ishiko732/ts-fsrs-demo
demo flashcard fsrs lingq nextjs14 ts-fsrs
Last synced: about 1 month ago
JSON representation
Interval Repeat Flashcard Demo with Basic Simple Features Designed based on Next.js App Router, ts-fsrs, fsrs-browser and Prisma.
- Host: GitHub
- URL: https://github.com/ishiko732/ts-fsrs-demo
- Owner: ishiko732
- License: mit
- Created: 2023-10-06T16:20:07.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-08-29T15:59:29.000Z (3 months ago)
- Last Synced: 2024-08-29T18:16:11.048Z (3 months ago)
- Topics: demo, flashcard, fsrs, lingq, nextjs14, ts-fsrs
- Language: TypeScript
- Homepage: https://fsrs.parallelveil.com/
- Size: 6.15 MB
- Stars: 23
- Watchers: 1
- Forks: 10
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# TS-FSRS-Demo
## introduction
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
- next.js (>= 14.2.0)
- ts-fsrs (>= 3.5.3)
- tailwindcss (>= 3)
- shadcn
- fsrs-browser (>= 0.6.1)
````
## Environment Variables
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](https://www.prisma.io/docs/reference/api-reference/environment-variables-reference) for specific details.
> Ref(prisma docs): [https://www.prisma.io/docs/guides/development-environment/environment-variables](https://www.prisma.io/docs/guides/development-environment/environment-variables)
`.env`
```bash
DATABASE_URL="postgres://username:password@host:port/database?sslmode=require"
DATABASE_URL_WITH_SCHEMA=${DATABASE_URL}&schema=fsrsDemo
# example
DATABASE_URL="postgres://default:[email protected]:5432/verceldb?sslmode=require&schema=fsrs"
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=**** # openssl rand -base64 32
# GitHub OAuth https://github.com/settings/developers
GITHUB_ID=***
GITHUB_SECRET=***
# if need lingq server
LINGQ_KEY=**** # copy from http://localhost:3000/api/lingq/key
```
update schema: src/prisma/schema.prisma
```prisma
datasource db {
provider = "postgresql" // or mysql
url = env("DATABASE_URL")
}
```
## How to run?
- run docker make sure the database is running on your machine: `docker-compose up`
- Configure the database environment and use `npm run db:push`
- Run demo
```bash
npm run dev # or yarn dev/ pnpm dev/ bun dev
```
- Open [localhost:3000](http://localhost:3000)
- Sign In
## Preview
### Home
> Tip: ts-fsrs version:3.5.3
### Notes
> 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.
### Review
> 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.
## Settings
> Click on the button, and you can set up.
> You can customize the parameters of your FSRS params
## Train
use `fsrs-browser` to train.
API Router:
http://localhost:3000/api/fsrs/train
Client:
http://localhost:3000/train
## Build
You can compile the demo for better performance by using `npm run build`, and then start the project using `npm run start`.
