Cuteanime is an anime viewer where you can watch anime with Japanese subtitles and lookup words with a dictionary extension like Yomichan. We get most of the Japanese subtitles from Kitsunekko.
We use a custom video player which is explained in more detail below.
You can quickly toggle between Japanese/English subtitles with the "Sub" button in the video player.
The subtitle catalog shows the entire script of the episode allowing you to quickly navigate to a specific dialog, or search through all of the dialogues.
You can quickly go to the next/previous dialogues with the arrow buttons. It also works with left/right arrow keys. These are all of the keyboard shortcuts:
- Space: Play/Pause
- Left Arrow: Previous Dialogue
- Right Arrow: Next Dialogue
- Up Arrow: Increase Volume
- Down Arrow: Decrease Volume
You can change the video speed and pitch preservement to slow down the video if the characters are speaking too fast.
You can set a loop from point A to point B to continuosly loop over a specific section.
Apply video filters such as brightness, contrast, hue, saturation, sharpen, and pixelate.
*Note that this feature is only for fun.
Support the studio/publisher by buying the anime/manga from their website (a link is provided).
- Languages: Typescript, LESS, HTML
- Front-end: React
- Bundler: Webpack
First install Node.js if you don't have it already.
To reduce costs, the whole "database" is stored in database.js and episodes.js files instead of using a
real database.
You can look at database.example.js and episodes.example.js to see the structure of the database.
Clone the code from this repository and then install dependencies with npm install.
Start the web server with npm start.
All the web server does is load the index.html file, there is no real backend so this can be hosted as a static
website.
To load files from your local hard drive edit the pathname for the route /Anime/* in server.tsx.
If you need more detailed instructions, check #1 (comment).