Home / JavaScript / CSS

A anime discovery, streaming site made with NextJs and TailwindCSS. Uses AniList API and video data from GogoAnime. No ads and no vpn required

Animeflix A anime discovery, streaming site made with NextJs and TailwindCSS. The app is deployed to https://animeplix.vercel.app, but its recommended
Information
Category: JavaScript / CSS
Watchers: 1
Star: 10
Fork: 1
Last update: Nov 22, 2021
Resource links
https://animeplix.vercel.app
https://github.com/chirag-droid/animeflix

Animeflix

animeflix

A anime discovery, streaming site made with NextJs and TailwindCSS. The app is deployed to https://animeplix.vercel.app, but its recommended to host it yourself. The AniList api is used for fetching data which has a rate limit of 90 requests/min. For video data GogoAnime is scraped

Click the Deploy with Vercel to deploy it for yourself. You can also host on your own computer

Deploy your own

Deploy the example using Vercel:

Deploy with Vercel

Deploy on your computer

First download the repository using

git clone https://github.com/chirag-droid/animeflix

This should download this repository to your computer. Next, to download the dependencies run

npm i

Now build and start the production build of the site using

npm run build
npm run start

This will start the app on http://localhost:3000

2 Open More issues
Closed

Feat: back to proxy & slug search improvements

  • Many animes will not load (e.g: Daily Lives of High School Boys) without a proxy, so I believe it is best to use it.
  • Some anime titles contain unicode characters, which should be replaced with a space.
bug 
opened Apr 30, 2022 by riimuru 18
Closed

Feature: Show a list of episodes and seasons for anime

There is no option for showing list of episodes for anime. Please add that feature.

Thanks

enhancement help wanted 
opened May 2, 2022 by adgsenpai 15
Closed

Video not working

Unhandled Runtime Error TypeError: Cannot read properties of undefined (reading '0')

Source src\pages\watch[id].tsx (108:17) @ eval

106 | if (isLoading) return; 107 |

108 | if (!sources[0].file.match(proxyFreeUrls)) { | ^ 109 | setProxy(true); 110 | } 111 | }, [isLoading, setProxy, sources]);

bug 
opened May 22, 2022 by casualGamer-dev 13
Closed

Videos don't seem to be loading

Hello. I decided to self-host your project on my server as I plan on making an easy to use electron app out of it however when I run the server, I don't get any playable links or any video player to view it in, here are some screenshots: image image image

I also couldn't find any logs about this, both in the server and browser console, or maybe I just don't know where to look for it

opened Dec 30, 2021 by subby2006 10
Closed

Is vercel is free?

Is vercel is free to deploy? Also can you give support to deploy on heroku.com

opened Dec 1, 2021 by sunilroyy007 10
Closed

Unusable jsdelivr CDN in China

Describe the bug Some of the player resource loaded is from cdn.jsdelivr.net, which is blocked in China. I find it difficult to switch it to unpkg.com.

To Reproduce Steps to reproduce the behavior:

  1. Go to any anime
  2. Click on 'Play'
  3. Player won't load because https://cdn.jsdelivr.net/npm/[email protected]/dist/hls.min.js etc. is blocked.

Expected behavior Change the CDN through source code.

Desktop (please complete the following information):

  • OS: Windows
  • Browser Microsoft Edge
  • Version 8346dd9
opened May 29, 2022 by lwd-temp 9
Open

Anilist's Ratelimit

Describe the bug Anilist does limit the API for 90 requests per minute, I notice that you're using getServerSideProps, have you ever facing the problem that the server can't fetch the data due to ratelimit?

To Reproduce Steps to reproduce the behavior: Just go to some anime page over and over until the server reaches anilist's ratelimit. (I guess)?

Expected behavior Some workarounds to avoid the anilist's ratelimit

Additional context We could use CSR for this, but we can't SEO if using CSR and that's the huge pay-off.

opened Jun 15, 2022 by hoangvu12 3
Open

Feature Request: Better Homepage

It would be great if anime that shows on top of the homepage, get randomly change from Trending Now list or maybe change itself to 1st anime on trending's

image

opened Jun 7, 2022 by AshuYadavYT 2
Open

Kamyroll api?

Kamyroll api? https://github.com/hyugogirubato/Kamyroll-Developers

opened Jun 2, 2022 by MaiSan9999 2
Open

I keep getting this error when trying to deploy it

Application error: a client-side exception has occurred (see the browser console for more information).

DevTools failed to load source map: Could not load content for https://cdn.replit.com/_next/static/css/77b7f3004e062aed.css.map: HTTP error: status code 403, net::ERR_HTTP_RESPONSE_CODE_FAILURE

opened May 26, 2022 by Gab311 5
Open

Anime playing wrong videos

Certain anime are playing the wrong videos For example, Code geass:Hangyaku no Lelouch (TV) is playing Code Geass: Hangyaku no Lelouch I - Koudou (MOVIE), same with Code geass:Hangyaku no Lelouch R2 (TV) playing the omake flash version (SPECIAL) Most probably happening because both have very similar names so its fetching the other one's data. The episode list works fine but only the player plays the wrong video For now, i only noticed this for code geass, there might be other anime series facing the same issue

Steps to reproduce the behavior: Go to Code geass:Hangyaku no Lelouch / Code geass:Hangyaku no Lelouch R2 Click on watch now or an episode See that its not playing the correct one

Expected: The player plays the tv series , not the movie

Desktop

  • OS: Windows 10
  • Chrome
  • Version Dev 103
bug 
opened May 24, 2022 by ShShr08 3
Open

Feature request: search automcompletion

Hey bro can you add auto complete search in search box which show search result in search box like this

  1. https://tarekraafat.github.io/autoComplete.js/demo/
  2. https://animeworldz.herokuapp.com/

You can get help from this to use it

http://clusteramaryllisblog.blogspot.com/2015/03/experiment-searching-with-autocomplete.html?m=1

enhancement help wanted 
opened May 20, 2022 by ScripterSaurav 1

Contents

    laxyapahuja A chrome extension to download anime torrents directly from MyAnimeList and Anilist
    arnedesmedt vue-ads-table-tree tailwindcssvue-ads-table-tree - A vue Table component, with filtering, sorting and pagination. Rows can have child rows, so a tree structure can be build. It also supports async calls to load rows from the backend. It's built with the css framework tailwindcss
    X-dea Plugin to access VPN service for Flutter | Flutter 的 VPN 插件
    gyf304 LAN Party VPN - Run VPN on top of Discord
    arnedesmedt vue-ads-pagination tailwindcssvue-ads-pagination - A vue pagination component build with the css framework tailwindcss
    mczub anime streaming search engine
    mukul500 An Android app to watch anime on your phone without ads.
    metatron-app Powerful & Easy way for big data discovery
    egoist Standalone build of TailwindCSS that runs in browser.
    ecklf TailwindCSS plugin that helps styling radix state
    LeonHeidelbach TTV AdEraser aims to remove livestream ads as well as add some useful features to our favourite streaming site.
    lechium VPN daemon utilized by nitoTV to deliver VPN access on tvOS
    mafintosh A tcp/utp server that auto announces itself using discovery-channel
    kaungsatthe1n A Mobile App To Watch Anime Online With No Ads !!
    chemiadel nextjs, firebase & tailwindcss starter
    maykbrito A NextJS Dashboard builded with tailwindcss and framermotion
    KorigamiK The new and improved version of batch anime downloader. Made a tleast 10x more efficient from the older version.
    mohammadou1 Twitter clone built with NextJS, Tailwindcss and Typescript
    kmcgill88 Admob Flutter plugin that shows banner ads using native platform views.
    honoki Run all your bug bounty VPN profiles in parallel and expose them via multiple local SOCKS proxies.
    cap-ntu An intelligent multimodal-learning based system for video, product and ads analysis. Based on the system, people can build a lot of downstream applications such as product recommendation, video retrieval, etc.
    Share this repo

    Related Repos


    CSS
    19
    Lista de conteúdo de hacking e segurança da informação feita inteiramente para BR
    luca-regne Hacking para brasileiros Coletânea de links e fontes de conteúdo brasileiro sobre hacking, segurança da informação e tópicos relacionados. Aviso Legal
     
    CSS
    7
    Firefox theme for catppuccin
    CelestialN3ko Catppuccin Theme for Firefox (Unofficial) This is an unofficial theme Themes Dark Rosewater Flamingo Mauve Pink Maroon Red Peach Yellow Green Teal Blu
     
    CSS
    5
    Repositório para os arquivos do curso de Angular do Hora de Codar no YouTube.
    matheusbattisti Teoria This project was generated with Angular CLI version 13.1.2. Development server Run ng serve for a dev server. Navigate to http://localhost:4200
     
    CSS
    4
    A tech guy with finance as his core competency
    ChintzRuparel Hi 👋 , I'm Chintz Ruparel A tech guy with finance as his core competency 🔭 I’m currently working on TWODS Capital 🌱 I’m currently learning AMP, REA
     
    CSS
    4
    Simple & Quick Access Addon For Homer Dashboard
    varunsridharan Homer Dashboard - Firefox Addon Quick Access Homer Dashboard - Firefox Addon Usage Install Addon [ Firefox ] Configure The Addon Add The Quick Access
     
    CSS
    3
    Portfolio template built with plain html, css and JavaScript
    CommunityPro Portfolio Template - HTML Build your portfolio using this super easy template. Free to use if you are a member of the community or a contributor to th
     
    CSS
    8
    Material for ProLaLa Keynote
    dsyme ProLaLa2022 Archival material for "Programming Languages and the Law" 2022 Keynote by: Davin Fifield – VP Product Development, Oracle Surend Dayal – P
     
    CSS
    8
    Tina working with Astro using Tina Admin
    perkinsjr Astro working with Tina This experience is a conceptual idea behind how to use Tina with pure SSG on Astro. This also may be subject to change in the
     
    CSS
    12
    Como criar um cluster ou multi-cluster Kubernetes localmente, em uma máquina Windows, util...
    jacunha Este guia tem a finalidade de orientar como criar um cluster kubernetes com um ou mais nós , e/ou multi-cluster em um computados com sistema operacional Windows 10 ou 11, utilizando o Hyper-V (nativo do Windows), para provisionar máquinas virtuais e Minikube (para provisionar clusters kubernetes localmente) a fim de auxiliar nos estudos da tecnologia para quem não dispõe de uma ambiente Linux.
     
    CSS
    366
    AWS Inventory in a single HTML file using JS AWS-SDK & Bootstrap
    devops-israel AWS Inventory A single-file that shows the whole inventory of your AWS services on a single page. Usage Clone or copy the index.html file to your comp
     
    CSS
    9
    Lit + File Based Routing + Nested Layouts
    rodydavis Lit File Based Routing Lit router for nested layouts and file based routing. Similar to https://remix.run/ but at client side. Demo Package Archived i
     
    CSS
    14
    PostgreSQL Editor and Dashboard
    prostgles Prostgles UI Web dashboard and SQL Editor for Postgres Screenshots More Features SQL Editor with schema auto-completion and useful hints Data edit and
     
    CSS
    5
    Soothing pastel theme for GitHub
    catppuccin Catppuccin for GitHub Usage Install an extension called Redefined GitHub Right Click on the extension Go to options/preferences (depends on the browse
     
    CSS
    3
    fxhash template by Matt Circles
    MatthieuSegret fxhash template by Matt Circles This is the template I use to start a new project on fxhash. It is agnostic of any framework: p5js, threejs, etc. You
     
    CSS
    3
    Lista de componentes Tailwind para VueJS / NuxtJs / ...
    Karytonn Componentes TailwindCSS Lista de componentes Tailwind para VueJS / NuxtJs / ... Tailwind.io Tailwind Elements Tailwind.cc Maraki UI Criative TIM Tail