/Ani-Next

React frontend for an anime streaming site fed by Consumet API

Primary LanguageTypeScript

Ani-Next

Streaming Site with React

Short Description

An streaming site for Anime, optimized for mobile and has PWA capability, built with React. Includes top airing home page and a search functionality.

🔴 Demo

Live Demo available. Click "Live Demo" to open it.

Motivation

My motivations in building this project was to make a simple interface to stream and watch anime on my phone without being bombarded with ads. To that end, I found an api, Consumet that served the data and the videos (in m3u8 format) required for the project. So I decided to use my front end developer skills to make a simple PWA capable site.

Features

  • Responsive and clear UI/UX
  • Search any Anime you want on the search page (credit to the API for partial name search)

Technologies Used

  • React
  • React Router Dom
  • TypeScript
  • React Player
  • CSS
  • Vite
  • Git

What I learned:

  • Using Typescript for the first time allowed me to work with statically typed code and avoid simple type errors
  • Using React Router Dom to create dynamic routes using data pulled from the API
  • Setting up 3rd party video player (React Player) and using it for the project.

Credits

All rights to all pictures, videos and names on this website belong to the respective publishers of the animes displayed. No files displayed are stored by me in this project.