blob: 12aa39c1dd169568bc3013d23e29ed58fe39b1fc (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
|
<div align="center">
<a href="https://moopa.live">
<img src="https://user-images.githubusercontent.com/97084324/234460363-216b29d3-acba-4c29-a321-780de84c9ab0.png" alt="logo" width="180"/>
</a>
</div>
<h1 align="center">
<a href="https://moopa.live">Moopa Anime Streaming Website</a>
</h1>
<p align="center">
<a href="https://github.com/DevanAbinaya/Ani-Moopa/blob/main/LICENSE.md">
<img src="https://img.shields.io/github/license/DevanAbinaya/Ani-Moopa" alt="license"/>
</a>
<a href="https://github.com/DevanAbinaya/Ani-Moopa/fork">
<img src="https://img.shields.io/github/forks/DevanAbinaya/Ani-Moopa?style=social" alt="fork"/>
</a>
<a href="https://github.com/DevanAbinaya/Ani-Moopa">
<img src="https://img.shields.io/github/stars/DevanAbinaya/Ani-Moopa?style=social" alt="stars"/>
</a>
</p>
<p align="center">
<img src="https://user-images.githubusercontent.com/97084324/234832975-0804e6bd-8528-4f53-b0fb-7ccce5342f59.png" alt="main">
</p>
<details>
<summary>More Screenshots</summary>
<h5 align="center">Home page after you login</h5>
<img src="https://user-images.githubusercontent.com/97084324/234463979-4b4fa1ba-34cb-4ae4-b4e1-59500b24ac6f.png"/>
<h5 align="center">Profile Page</h5>
<img src="https://user-images.githubusercontent.com/97084324/234556937-76ec236c-a077-4af5-a910-0cb85e900e38.gif"/>
<h5 align="center">Info page for PC/Mobile</h5>
<p align="center">
<img src="https://user-images.githubusercontent.com/97084324/234508708-082b8d64-1dea-4525-98a5-51a5a95e8db3.png"/>
</p>
<h5 align="center">Watch Page</h5>
<img src="https://user-images.githubusercontent.com/97084324/234466915-c2107ee5-5cfe-4cf5-9da4-9ad02aaf066a.png"/>
</details>
## Introduction
<p><a href="https://moopa.live">Moopa</a> is an anime streaming website made possible by <a href="https://github.com/consumet">Consumet API</a> build with <a href="https://github.com/vercel/next.js/">NextJs</a> and <a href="https://github.com/tailwindlabs/tailwindcss">Tailwind</a> with a sleek and modern design that offers Anilist integration to help you keep track of your favorite anime series. Moopa is entirely free and does not feature any ads, making it a great option for you who want an uninterrupted viewing experience.</p>
## Features
- Free ad-supported streaming service
- Anime tracking through Anilist API
- User-friendly interface
- Mobile-responsive design
- PWA supported
## To Do List
- [x] Add PWA support
- [x] Connect to consumet API to fetch episodes data
- [x] Implement skip op/ed button on supported anime
- [x] Create README file
- [x] Integrate Anilist API for anime tracking
- [x] Ability to auto track anime after watching >= 90% through the video
- [x] Create a user profile page to see lists of anime watched
- [x] Ability to edit list inside detail page
- [ ] Working on Manga pages
## Bug Report
If you encounter any issues or bug on the site please head to [issues](https://github.com/DevanAbinaya/Ani-Moopa/issues) and create a bug report there.
## For Local Development
1. Clone this repository using :
```bash
git clone https://github.com/DevanAbinaya/Ani-Moopa.git
```
2. Install package using npm :
```bash
npm install
```
3. Create `.env` file in the root folder and put this inside the file :
```bash
CLIENT_ID="get the id from here https://anilist.co/settings/developer"
CLIENT_SECRET="get the secret from here https://anilist.co/settings/developer"
GRAPHQL_ENDPOINT="https://graphql.anilist.co"
NEXTAUTH_SECRET='run this cmd in your bash terminal (openssl rand -base64 32) with no bracket, and paste it here'
NEXTAUTH_URL="for development use http://localhost:3000/ and for production use your domain url"
PROXY_URI="I recommend you to use this cors-anywhere as a proxy https://github.com/Rob--W/cors-anywhere follow the instruction on how to use it there."
```
4. Add this endpoint as Redirect Url on AniList Developer :
```bash
https://{your-website-url}/api/auth/callback/AniListProvider
```
5. Start local server :
```bash
npm run dev
```
## Credits
- [Consumet API](https://github.com/consumet/api.consumet.org)
- [AniList API](https://github.com/AniList/ApiV2-GraphQL-Docs)
- [miru](https://github.com/ThaUnknown/miru/blob/master/README.md?plain=1) for inspiring me making this site
## License
This project is licensed under the MIT License - see the [LICENSE.md](LICENSE.md) file for details.
## Contact
Thank You for passing by!!
If you have any questions or feedback, please reach out to us at [[email protected]](mailto:[email protected]?subject=[Moopa]%20-%20Your%20Subject), or you can join our [discord sever](https://discord.gg/4xTGhr85BG).
<br>
or you can DM me on Discord `Factiven#9110`/`CritenDust#3704`. (just contact me on one of these account)
[](https://discord.gg/v5fjSdKwr2)
## Support This Project
✨ [Star this project](https://github.com/DevanAbinaya/Ani-Moopa)
[](https://ko-fi.com/E1E6F9XZ3)
<a href="https://trakteer.id/factiven" target="_blank"><img id="wse-buttons-preview" src="https://cdn.trakteer.id/images/embed/trbtn-red-5.png" height="36" style="border: 0px; height: 36px;" alt="Trakteer Saya"></a>
|