Anistream

📋 Table of Contents

1. 🤖 Introduction
2. ⚙️ Tech Stack
3. 🔋 Features
4. 🤸 Quick Start

🤖 Introduction

Anistream is a modern anime streaming web application for discovering, browsing, and watching anime through a clean and responsive interface.

The platform provides features such as trending anime listings, seasonal filtering, anime detail pages, and episode streaming. The project focuses on creating a smooth user experience with fast navigation, organized content, and a minimalistic design optimized for both desktop and mobile devices.

⚙️ Tech Stack

• Next.js 16
• React 19
• TypeScript
• Tailwind CSS
• Zustand
• Radix UI
• Embla Carousel
• HLS.js
• ArtPlayer

🔋 Features

👉 Anime Discovery

• Browse trending and newest anime.
• Explore seasonal anime by year and season.

👉 Anime Details

• View anime synopsis, metadata, and additional information.
• Organized layout for better readability.

👉 Episode Streaming

• Watch anime episodes using HLS streaming.
• Custom video player powered by ArtPlayer and HLS.js.

👉 Modern UI

• Clean and minimal interface.
• Fully responsive for desktop and mobile devices.

🤸 Quick Start

Follow these steps to set up the project locally on your machine.

Prerequisites

Make sure you have the following installed on your machine:

• Git
• Node.js
• npm (Node Package Manager)

Cloning the Repository

git clone https://github.com/Firkhie/anistream.git
cd anistream

Package Installation

Install the project dependencies using npm:

npm i

Set Up Environment Variables

Create a new file named .env in the root of your project and add the following content:

NODE_ENV=
NEXT_PUBLIC_APP_HOST=
NEXT_PUBLIC_APP_URL=

NEXT_PUBLIC_ANISTREAM_API=
NEXT_PUBLIC_ANILIST_IDS_URL=
NEXT_PUBLIC_M3U8_PROXY=

Replace the placeholder values with your actual respective account credentials.

Running the Project

npm run dev

Open http://localhost:3000 in your browser to view the project.