2019-09-24 14:43:15 +00:00
< h1 align = "center" > Jellyfin Web< / h1 >
2019-11-25 15:26:00 +00:00
< h3 align = "center" > Part of the < a href = "https://jellyfin.org" > Jellyfin Project< / a > < / h3 >
2019-01-09 11:36:54 +00:00
2019-09-24 14:43:15 +00:00
---
2019-01-09 11:36:54 +00:00
< p align = "center" >
2019-09-24 14:43:15 +00:00
< img alt = "Logo Banner" src = "https://raw.githubusercontent.com/jellyfin/jellyfin-ux/master/branding/SVG/banner-logo-solid.svg?sanitize=true" / >
2019-11-24 14:59:42 +00:00
< br / >
< br / >
< a href = "https://github.com/jellyfin/jellyfin-web" >
< img alt = "GPL 2.0 License" src = "https://img.shields.io/github/license/jellyfin/jellyfin-web.svg" / >
< / a >
< a href = "https://github.com/jellyfin/jellyfin-web/releases" >
< img alt = "Current Release" src = "https://img.shields.io/github/release/jellyfin/jellyfin-web.svg" / >
< / a >
< a href = "https://translate.jellyfin.org/projects/jellyfin/jellyfin-web/?utm_source=widget" >
< img src = "https://translate.jellyfin.org/widgets/jellyfin/-/jellyfin-web/svg-badge.svg" alt = "Translation Status" / >
< / a >
2019-12-15 05:09:30 +00:00
< br / >
2019-11-24 14:59:42 +00:00
< a href = "https://opencollective.com/jellyfin" >
< img alt = "Donate" src = "https://img.shields.io/opencollective/all/jellyfin.svg?label=backers" / >
< / a >
< a href = "https://features.jellyfin.org" >
< img alt = "Feature Requests" src = "https://img.shields.io/badge/fider-vote%20on%20features-success.svg" / >
< / a >
< a href = "https://matrix.to/#/+jellyfin:matrix.org" >
< img alt = "Chat on Matrix" src = "https://img.shields.io/matrix/jellyfin:matrix.org.svg?logo=matrix" / >
< / a >
2019-11-25 15:26:00 +00:00
< a href = "https://www.reddit.com/r/jellyfin" >
2019-11-24 14:59:42 +00:00
< img alt = "Join our Subreddit" src = "https://img.shields.io/badge/reddit-r%2Fjellyfin-%23FF5700.svg" / >
< / a >
2019-01-09 11:36:54 +00:00
< / p >
2019-11-25 15:26:00 +00:00
Jellyfin Web is the frontend used for most of the clients available for end users, such as desktop browsers, Android, and iOS. We welcome all contributions and pull requests! If you have a larger feature in mind please open an issue so we can discuss the implementation before you start. Translations can be improved very easily from our < a href = "https://translate.jellyfin.org/projects/jellyfin/jellyfin-web" > Weblate< / a > instance. Look through the following graphic to see if your native language could use some work!
2019-11-24 14:59:42 +00:00
< a href = "https://translate.jellyfin.org/engage/jellyfin/?utm_source=widget" >
< img src = "https://translate.jellyfin.org/widgets/jellyfin/-/jellyfin-web/multi-auto.svg" alt = "Detailed Translation Status" / >
< / a >
## Build Process
### Dependencies
2020-09-11 23:34:08 +00:00
- [Node.js ](https://nodejs.org/en/download )
2021-03-01 23:28:44 +00:00
- npm (included in Node.js)
2019-11-24 14:59:42 +00:00
### Getting Started
2019-09-24 14:43:15 +00:00
2019-11-24 14:59:42 +00:00
1. Clone or download this repository.
2020-03-16 15:32:46 +00:00
2019-11-24 14:59:42 +00:00
```sh
git clone https://github.com/jellyfin/jellyfin-web.git
cd jellyfin-web
```
2020-03-16 15:32:46 +00:00
2019-12-15 05:09:30 +00:00
2. Install build dependencies in the project directory.
2020-03-16 15:32:46 +00:00
2019-11-24 14:59:42 +00:00
```sh
2021-03-01 23:28:44 +00:00
npm install
2019-11-24 14:59:42 +00:00
```
2019-11-30 17:52:46 +00:00
2019-12-03 14:17:01 +00:00
3. Run the web client with webpack for local development.
2020-03-16 15:32:46 +00:00
2019-11-30 17:52:46 +00:00
```sh
2021-03-01 23:28:44 +00:00
npm start
2019-11-30 17:52:46 +00:00
```
2020-02-28 13:48:35 +00:00
2020-09-11 23:34:08 +00:00
4. Build the client with sourcemaps available.
2020-03-16 15:32:46 +00:00
2020-03-16 15:37:21 +00:00
```sh
2021-03-01 23:28:44 +00:00
npm run build:development
2020-03-16 15:37:21 +00:00
```
2022-10-20 06:16:17 +00:00
## Directory Structure
```
.
└── src
├── assets # Static assets
├── components # Higher order visual components and React components
├── controllers # Legacy page views and controllers 🧹
├── elements # Basic webcomponents and React wrappers 🧹
├── legacy # Polyfills for legacy browsers
├── libraries # Third party libraries 🧹
├── plugins # Client plugins
├── routes # React routes/pages
├── scripts # Random assortment of visual components and utilities 🐉
├── strings # Translation files
├── styles # Common app Sass stylesheets
├── themes # CSS themes
└── utils # Utility functions
```
- 🧹 — Needs cleanup
- 🐉 — Serious mess (Here be dragons)