{"id":26462974,"url":"https://github.com/notwindstone/anisun","last_synced_at":"2025-06-16T04:14:23.221Z","repository":{"id":228226738,"uuid":"773447915","full_name":"notwindstone/anisun","owner":"notwindstone","description":"My first project on Next.js 14: an anime streaming website/PWA based on Shikimori, AniLibria, Kodik, SovetRomantica and Animetize APIs with the Mantine UI kit.","archived":false,"fork":false,"pushed_at":"2024-07-06T12:03:44.000Z","size":27947,"stargazers_count":25,"open_issues_count":1,"forks_count":4,"subscribers_count":1,"default_branch":"main","last_synced_at":"2024-07-06T13:25:29.822Z","etag":null,"topics":["anilibria","anime","anime-website","animetize-api","clerk","drizzle-orm","kodik","mantine","next-intl","nextjs","pwa","react","shikimori","sovetromantica","streaming","tanstack-react-query","typescript","vidstack"],"latest_commit_sha":null,"homepage":"https://anisun.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/notwindstone.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-03-17T17:29:52.000Z","updated_at":"2024-07-06T07:00:43.000Z","dependencies_parsed_at":"2024-11-01T19:29:51.019Z","dependency_job_id":null,"html_url":"https://github.com/notwindstone/anisun","commit_stats":null,"previous_names":["windstone-aristotle-yellow/anilibria-player","windstone-aristotle-yellow/animeth","notwindstone/animeth","notwindstone/anisun"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/notwindstone%2Fanisun","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/notwindstone%2Fanisun/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/notwindstone%2Fanisun/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/notwindstone%2Fanisun/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/notwindstone","download_url":"https://codeload.github.com/notwindstone/anisun/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244374579,"owners_count":20442665,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["anilibria","anime","anime-website","animetize-api","clerk","drizzle-orm","kodik","mantine","next-intl","nextjs","pwa","react","shikimori","sovetromantica","streaming","tanstack-react-query","typescript","vidstack"],"created_at":"2025-03-19T06:38:57.590Z","updated_at":"2025-03-19T06:38:58.101Z","avatar_url":"https://github.com/notwindstone.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n\n\u003cimg width=\"160\" height=\"160\" align=\"center\" src=\"public/favicon.png\"\u003e\n\n# [Anisun](https://anisun.vercel.app)\n\n### A web app for watching anime built with Next.js and Mantine UI\n\nI'm currently refactoring this app. You can check the progress here: [v5 branch](https://github.com/notwindstone/anisun/tree/v5) \n\n\u003cp align=\"center\"\u003e\n\u003cstrong\u003eEnglish\u003c/strong\u003e | \u003ca href=\"https://github.com/notwindstone/anisun/blob/main/README_russian.md\"\u003eРусский\u003c/a\u003e\n\u003c/p\u003e\n\n\u003c/div\u003e\n\n[![GitHub Repo stars](https://img.shields.io/github/stars/notwindstone/Anisun?label=Stars\u0026style=for-the-badge\u0026logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIC05NjAgOTYwIDk2MCIgd2lkdGg9IjI0IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxwYXRoIGQ9Im0zNTQtMjQ3IDEyNi03NiAxMjYgNzctMzMtMTQ0IDExMS05Ni0xNDYtMTMtNTgtMTM2LTU4IDEzNS0xNDYgMTMgMTExIDk3LTMzIDE0M1pNMjMzLTgwbDY1LTI4MUw4MC01NTBsMjg4LTI1IDExMi0yNjUgMTEyIDI2NSAyODggMjUtMjE4IDE4OSA2NSAyODEtMjQ3LTE0OUwyMzMtODBabTI0Ny0zNTBaIiBzdHlsZT0iZmlsbDogcmdiKDI0NSwgMjI3LCA2Nik7Ii8%2BCjwvc3ZnPg%3D%3D\u0026color=%23f8e444)](https://github.com/notwindstone/Anisun/stargazers)\n[![Discord Server](https://img.shields.io/discord/1218281145138151430?label=Discord\u0026labelColor=7289da\u0026color=2c2f33\u0026style=for-the-badge)](https://discord.gg/JhmkZDScfg)\n\n## 📱 Screenshots\n\n\u003cdiv align=\"center\"\u003e\n\u003cimg src=\"public/docs/EN_Screenshot_anisun_main_screen_pc1.png\" width=\"49%\"\u003e\n\u003cimg src=\"public/docs/EN_Screenshot_anisun_main_screen_pc2.png\" width=\"49%\"\u003e\n\u003cimg src=\"public/docs/EN_Screenshot_anisun_main_screen_android1.jpg\" width=\"32%\"\u003e\n\u003cimg src=\"public/docs/EN_Screenshot_anisun_main_screen_android2.jpg\" width=\"32%\"\u003e\n\u003c/div\u003e\n\n### More screenshots\n\n\u003cdetails\u003e\n\u003csummary\u003eExpand\u003c/summary\u003e\n\n\u003cdiv align=\"center\"\u003e\n\u003cimg src=\"public/docs/Screenshot_anisun_videoplayer1.jpg\" width=\"49%\"\u003e\n\u003cimg src=\"public/docs/Screenshot_anisun_videoplayer2.jpg\" width=\"49%\"\u003e\n\u003cimg src=\"public/docs/Screenshot_anisun_anime_page2.png\" width=\"49%\"\u003e\n\u003cimg src=\"public/docs/Screenshot_anisun_anime_page1.png\" width=\"49%\"\u003e\n\u003cimg src=\"public/docs/Screenshot_anisun_popular1.png\" width=\"49%\"\u003e\n\u003cimg src=\"public/docs/Screenshot_anisun_search1.png\" width=\"49%\"\u003e\n\u003cimg src=\"public/docs/Screenshot_anisun_account1.png\" width=\"49%\"\u003e\n\u003cimg src=\"public/docs/Screenshot_anisun_main_settings1.png\" width=\"49%\"\u003e\n\u003cimg src=\"public/docs/Screenshot_anisun_search_android1.jpg\" width=\"32%\"\u003e\n\u003cimg src=\"public/docs/Screenshot_anisun_anime_page_description_android1.jpg\" width=\"32%\"\u003e\n\u003cimg src=\"public/docs/Screenshot_anisun_settings_theme_android1.jpg\" width=\"32%\"\u003e\n\u003cimg src=\"public/docs/Screenshot_anisun_settings_about_android1.jpg\" width=\"32%\"\u003e\n\u003cimg src=\"public/docs/Screenshot_anisun_longCommentSection.jpg\" width=\"32%\"\u003e\n\u003cimg src=\"public/docs/Screenshot_anisun_settings_account_android1.jpg\" width=\"32%\"\u003e\n\u003c/div\u003e\n\n\u003c/details\u003e\n\n## ⚙️ Tech Stack\n\n* [Next.js](https://nextjs.org/) with [TypeScript](https://www.typescriptlang.org/)\n\n* [Mantine UI](https://mantine.dev/) and [PostCSS](https://postcss.org/) for UI\n\n* [Drizzle ORM](https://orm.drizzle.team/) and [Neon Serverless DB](https://neon.tech/) for database\n\n* [Tanstack Query](https://tanstack.com/query/latest) and [axios](https://axios-http.com/docs/intro) for fetching data from APIs\n\n* Slider for anime cards based on [Embla Carousel](https://www.embla-carousel.com) and [Mantine UI Carousel](https://mantine.dev/x/carousel/)\n\n* [Clerk Auth](https://clerk.com/) for auth\n\n* Video player for [Anilibria API](https://github.com/anilibria/docs) based on [Vidstack.js](https://www.vidstack.io/) and [HLS.js](https://github.com/video-dev/hls.js)\n\n* [KodikWrapper](https://github.com/thedvxchsquad/kodikwrapper) for fetching data from Kodik using Shikimori ID\n\n* Notifications system based on [Mantine UI Notifications](https://mantine.dev/x/notifications/)\n\n* Date formatting with [Day.js](https://day.js.org/)\n\n* [CSS-modules](https://nextjs.org/docs/app/building-your-application/styling/css-modules)\n\n## ⭐ Features\n\n* Watch anime with subs or dubs (in English or Russian)\n\n* Download anime using a torrent or directly from the website (.m3u8)\n\n* Account authentication\n\n* Heavily nested comment system like on reddit\n\n* Dark and light themes\n\n* Anime search with filters\n\n* Custom navigation bar using a Next.js router for faster navigation between routes\n\n...and a lot more!\n\n## ✅ To-Do List\n\n- [x] Website internationalization with [next-intl](https://next-intl-docs.vercel.app/)\n\n- [x] Add the option to the `.env` file to use a database based on value\n\n- [x] Add the option to download anime using a torrent or directly from the website\n\n- [x] Add subtitles from the [SovetRomanticaVideo API](https://github.com/sovetromantica/sr-api)\n\n- [x] Complete the page with an anime search and filters\n\n- [x] Finish comments\n\n- [x] Complete the page with popular anime\n\n## ⬇️ Self-Hosting\n\n### Local\n\n#### Preparations\n\n\u003cdetails\u003e\n\u003csummary\u003eExpand steps\u003c/summary\u003e\n\n\u003e Cloning the repository\n\n1. Clone this repository by running `git clone https://github.com/notwindstone/anisun`\n\n2. Rename the `.env.example` file in the root directory to `.env.local`\n\n\u003e Configuring Clerk auth\n\n1. Sign up for a Clerk account at https://clerk.com\n\n2. Go to the Clerk dashboard and create an application\n\n3. Go to **API Keys** in your sidebar and copy **Publishable key** (Example: `pk_test_qwertyuiop1234567890`)\n\n4. Paste your **Publishable key** to `NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY` in the `.env.local` file\n\n5. Go to **API Keys** in your sidebar and copy **Secret keys** (Example: `sk_test_qwertyuiop1234567890`)\n\n6. Paste your **Publishable key** to `CLERK_SECRET_KEY` in the `.env.local` file\n\n\u003e Database configuration with: 1. Neon Serverless DB\n\nYou can use Neon Serverless DB as a database. If you are going to use local PostgreSQL database, then skip this configuration\n\n1. Sign up to Neon DB at https://neon.tech/ to access serverless Postgres by creating a project\n\n2. Go to the Neon dashboard and copy **Connection string** (Example: `postgres://postgres:adminadmin@0.0.0.0:5432/db?sslmode=require`)\n\n3. Paste your **Connection string** to `NEON_DATABASE_URL` in the `.env.local` file\n\n4. Make sure the `DATABASE_TYPE` line in the `.env.local` file is set to `NEON`\n\n\u003e Database configuration with: 2. Local PostgreSQL\n\nYou can use local PostgreSQL as a database. If you are going to use Neon Serverless database, then skip this configuration\n\n1. Go to the `.env.local` file and paste your connection string to `POSTGRESQL_DATABASE_URL`\n\n2. Change `DATABASE_TYPE` to `POSTGRESQL` in the `.env.local` file\n\n\u003e Final steps\n\n1. (Optional) If you want to watch anime in Kodik Player too, then obtain a token from http://kodik.cc/ (you need to contact them via email) Otherwise, only players based on the Anilibria API will work\n\n2. Run `npm install` to install the required dependencies\n\n3. Create a comments table in the database using the command `npx drizzle-kit push:pg`\n\n4. Done! Your web app is ready to start\n\n\u003c/details\u003e\n\n\u003e [!IMPORTANT]\n\u003e This is what the `.env.local` file should look like with Neon Serverless DB configuration\n\n```text\nDATABASE_TYPE='NEON'\nNEON_DATABASE_URL='postgres://postgres:adminadmin@0.0.0.0:5432/db'\nPOSTGRESQL_DATABASE_URL='CHANGE_IT_postgres://postgres:adminadmin@0.0.0.0:5432/db'\nNEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_qwertyuiop1234567890\nCLERK_SECRET_KEY=sk_test_qwertyuiop1234567890\nNEXT_PUBLIC_CLERK_SIGN_IN_URL=/\nNEXT_PUBLIC_CLERK_SIGN_UP_URL=/\nNEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=/\nNEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=/\nKODIK_TOKEN='qwertyuiop1234567890'\n```\n\n\u003e [!IMPORTANT]\n\u003e This is what the `.env.local` file should look like with PostgreSQL DB configuration\n\n```text\nDATABASE_TYPE='POSTGRESQL'\nNEON_DATABASE_URL='CHANGE_IT_postgres://postgres:adminadmin@0.0.0.0:5432/db'\nPOSTGRESQL_DATABASE_URL='postgres://postgres:adminadmin@0.0.0.0:5432/db'\nNEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_qwertyuiop1234567890\nCLERK_SECRET_KEY=sk_test_qwertyuiop1234567890\nNEXT_PUBLIC_CLERK_SIGN_IN_URL=/\nNEXT_PUBLIC_CLERK_SIGN_UP_URL=/\nNEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=/\nNEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=/\nKODIK_TOKEN='qwertyuiop1234567890'\n```\n\n#### Development\n\nIf you want to run the application in development mode\n\n```bash\nnpm run dev\n```\n\n#### Production\n\n\u003e [!TIP]\n\u003e Run the application in production mode if you don't know which to choose\n\nIf you want to run the application in production mode\n\n```bash\nnpm run build\n```\n```bash\nnpm run start\n```\n\n#### Website URL\n\nOpen [http://localhost:3000](http://localhost:3000) with your browser to see the result.\n\n### Vercel\n\n\u003cdetails\u003e\n\u003csummary\u003eExpand steps\u003c/summary\u003e\n\nClick the button\n\n[![Vercel](https://vercel.com/button)](https://vercel.com/new/clone?s=https%3A%2F%2Fgithub.com%2Fnotwindstone%2Fanisun)\n\nNavigate to **Project** -\u003e **Settings** -\u003e **Environment Variables** and then add values to the following keys:\n\n1. `DATABASE_TYPE` - `NEON`\n\n2. `NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL` - `/`\n\n3. `NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL` - `/`\n\n4. `NEXT_PUBLIC_CLERK_SIGN_UP_URL` - `/`\n\n5. `NEXT_PUBLIC_CLERK_SIGN_IN_URL` - `/`\n\n6. `CLERK_SECRET_KEY` - your own **Secret key** from https://clerk.com\n\n7. `NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY` - your own **Publishable key** from https://clerk.com\n\n8. `NEON_DATABASE_URL` - your own **Connection string** from https://neon.tech/\n\n9. (Optional) `KODIK_TOKEN` - your own from http://kodik.cc/ (you need to contact them via email). This is needed only if you want to watch anime in Kodik Player too. Otherwise, only players based on the Anilibria API will work\n\n\u003c/details\u003e\n\n### Termux\n\n\u003cdetails\u003e\n\u003csummary\u003eExpand steps\u003c/summary\u003e\n\n1. Install any PRoot Linux distro using an Andronix, for example\n\n2. Install Node.js, NPM, and Git\n\n3. Follow the next steps from the [local installation](#local) paragraph\n\n\u003c/details\u003e\n\n## 💬 Contact\n\n### Directly\n\n* [Telegram - @windst1](https://t.me/windst1)\n\n* [Discord - @notwindstone](https://discord.com/users/510709295814279168)\n\n### Through our Discord server\n\n* [Discord - Сага о сервере](https://discord.gg/JhmkZDScfg)\n\n## 🤝 Contributing\n\nContributions are welcome!\n\n\u003e [!NOTE]\n\u003e To-Do: Hosted Weblate\n\n## ⭐️ Star History\n\n[![Star History Chart](https://api.star-history.com/svg?repos=notwindstone/anisun\u0026type=Date)](https://star-history.com/#notwindstone/anisun\u0026Date)\n\n## ❤️ Credits\n\n* [zvshka](https://github.com/zvshka) for his help with the project\n\n* cos (discord account) for his help with the UI\n\n* [Shikimori](https://shikimori.one/api/doc/graphql), [Anilibria](https://github.com/anilibria/docs), [Kodik](http://kodik.cc/) and [SovetRomantica](https://sovetromantica.com/) for their wonderful APIs, without which Anisun could not work\n\n* [Sora](https://github.com/Khanhtran47/Sora) and [Sync for Reddit](https://github.com/laurencedawson/sync-for-reddit). Some of the UI designs are borrowed from them\n\n* [Node-shikimori wrapper](https://github.com/Capster/node-shikimori). Some of the codes are borrowed from them\n\n## 📜 License\n\n[![GitHub](https://img.shields.io/github/license/notwindstone/Anisun?style=for-the-badge)](https://github.com/notwindstone/Anisun/blob/main/LICENSE)\n\n## 🌐 Cool resources\n\n* [Refactoring Hell](https://wiki.c2.com/?RefactoringHell)\n\n* [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/)\n\n* [Realtime Colors](https://www.realtimecolors.com)\n\n## ❗ Disclaimer\n\n\u003e [!IMPORTANT]\n\u003e Anisun does not host any files, it merely links to 3rd party services.\n\u003e Legal issues should be taken up with the file hosts and providers.\n\u003e Anisun is not responsible for any media files shown by the video providers.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnotwindstone%2Fanisun","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnotwindstone%2Fanisun","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnotwindstone%2Fanisun/lists"}