---
title: 'Deploy'
---

# Deploying the client

## Method 1 - Cloudflare Pages (Best host)

<Steps>
  <Steps.Step>
    [Fork P-Stream](https://github.com/p-stream/p-stream/fork) on Github.
  </Steps.Step>

{' '}
<Steps.Step>
  Go to [Cloudflare pages](https://pages.dev) and click "Sign Up".
</Steps.Step>

{' '}
<Steps.Step>
  Create a Cloudflare account.
  <Note>
    If you already have a Cloudflare account you will be redirected to the
    workers and pages dashboard.
  </Note>
</Steps.Step>

{' '}
<Steps.Step>
  Now, click the blue "Create" button at the top of the page.
</Steps.Step>

{' '}
<Steps.Step>
  By default Cloudflare assumes your creating a worker instead, change the
  "Workers" tab to "Pages".
</Steps.Step>

{' '}
<Steps.Step>
  Select the blue button that says "Connect to git" and then connect the Github
  account you forked P-Stream on.
</Steps.Step>

{' '}
<Steps.Step>
  Now you can select repositories from your github account, select your fork of
  P-Stream and click "Begin setup".
</Steps.Step>

{' '}
<Steps.Step>
  Give your project a silly name and select `main` as the production branch.
</Steps.Step>

{' '}
<Steps.Step>
  In "Build settings" change the "Build command" to `pnpm build` and the "Build
  output directory" to `dist`.
</Steps.Step>

{' '}
<Steps.Step>
  Select the `Environment variable` drop down and add the below variables.
  ```env VITE_CORS_PROXY_URL = PUT_A_PROXY_URL_HERE VITE_TMDB_READ_API_KEY =
  eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiI1NzlkZWYyZDY5ZWFlNDk4ZjJiOTI4MTgyNDdjM2ViMCIsInN1YiI6IjY2MjdmMGJlNjJmMzM1MDE0YmQ4NTFmMiIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJzaW9uIjoxfQ.h3KpPvkiaz8uNz1bntAKqsPrxG_4UUWaY3kYME6N6m8
  ```
</Steps.Step>

{' '}
<Steps.Step>Click "Save and Deploy" to watch your new site deploy.</Steps.Step>

  <Steps.Step>
    Congrats! You have your own version of P-Stream hosted for **FREE**.
  </Steps.Step>
</Steps>

## Method 2 - Vercel (Might be broken idk)

<Steps>
  <Steps.Step>
    Click [here](https://github.com/p-stream/p-stream/fork) to fork the P-Stream
    Github repository
  </Steps.Step>

  <Steps.Step>Click [here](https://vercel.com/) to go to Vercel</Steps.Step>

  <Steps.Step>Sign in using either a GitHub, GitLab, or Bitbucket.</Steps.Step>

  <Steps.Step>
    Clicking the "New Project" button on the top right of your dashboard and
    following the steps to create a new project for your self hosted version of
    movie web.
  </Steps.Step>

  <Steps.Step>
    After clicking it, you'll be presented with a list of Git repositories that
    the Git account you've signed up with has write access to.
  </Steps.Step>

  <Steps.Step>
    Select your own fork of the P-Stream Github repository.
  </Steps.Step>

  <Steps.Step>
    Configure the environment variables: - `VITE_CORS_PROXY_URL`: Enter your
    proxy URL here. Make sure to not have a slash at the end of your URL.
    Example (THIS IS AN EXAMPLE, IT WON'T WORK FOR YOU):
    `https://test-proxy.test.workers.dev` - `VITE_TMDB_READ_API_KEY`: Enter your
    TMDB Read Access Token here. Please read [the TMDB page](./tmdb.mdx) on how
    to get an API key. - `VITE_BACKEND_URL`: Only set if you have a self-hosted
    backend. Put in your backend URL. Check out [configuration
    reference](../client/configuration.mdx) for details. Make sure to not have a
    slash at the end of the URL.
  </Steps.Step>

  <Steps.Step>Click "Deploy"</Steps.Step>

  <Steps.Step>
    Congrats! You have your own version of P-Stream hosted.
  </Steps.Step>

  <Steps.Step>
    You may wish to configure a custom domain - Please consult [the Vercel docs
    for how to do
    this](https://vercel.com/docs/getting-started-with-vercel/domains).
  </Steps.Step>
</Steps>

## Method 3 - Static Web Host

<Steps>
  <Steps.Step>
    Download the file `P-Stream.zip` from the latest release:
    https://github.com/p-stream/p-stream/releases/latest.
  </Steps.Step>

  <Steps.Step>Extract the ZIP file so you can edit the files.</Steps.Step>

  <Steps.Step>
    Open `config.js` in an editor such as Notepad, Visual Studio Code or
    similar.
  </Steps.Step>

  <Steps.Step>
    Put your proxy URL in-between the double quotes of `VITE_CORS_PROXY_URL:
    ""`. Make sure to not have a slash at the end of your URL. Example (THIS IS
    AN EXAMPLE, IT WON'T WORK FOR YOU): `VITE_CORS_PROXY_URL:
    "https://test-proxy.test.workers.dev"`
  </Steps.Step>

  <Steps.Step>
    Put your TMDB Read Access Token inside the quotes of
    `VITE_TMDB_READ_API_KEY: ""`. Please read [the TMDB page](./tmdb.mdx) on how
    to get an API key.
  </Steps.Step>

  <Steps.Step>
    If you have a self-hosted backend server, enter your URL in the
    `VITE_BACKEND_URL` variable. Check out [configuration
    reference](../client/configuration.mdx) for details. Make sure to not have a
    slash at the end of the URL.
  </Steps.Step>

  <Steps.Step>Save the file.</Steps.Step>

  <Steps.Step>
    Upload **all** of the files to a static website hosting such as: - GitHub
    Pages - Netlify - Vercel - Etc, [there are lots of
    options](https://www.staticwebsitehosting.org/).
  </Steps.Step>

  <Steps.Step>
    Congrats! You have your own version of P-Stream hosted.
  </Steps.Step>
</Steps>

## Method 4 - Docker Compose - Home Network

Docker is not recommended! It's much easier to host the static site and use a proxy like nginx to access.

This method is meant for those using a desktop device or single board computer with a minimum of 4GB of RAM such as a [Raspberry Pi](https://www.raspberrypi.com/) to run P-Stream on there home network for network connected devices.

<Steps>
  <Steps.Step>
    1. Ensure you have [docker](https://docs.docker.com/get-docker/) installed. In a newly created directory called `P-Stream` create a file called `docker-compose.yaml`. Paste the contents of the code block below into this file.
  
      ```yaml
      version: "3.8"
      
      services:
      
        movieweb:
          build:
            context: https://github.com/p-stream/p-stream.git#production
            # args:
            #   TMDB_READ_API_KEY: ""
            #   CORS_PROXY_URL: ""
            #   BACKEND_URL: ""
          ports:
            - "80:80"
          restart: unless-stopped
      ```
  </Steps.Step>
  
  <Steps.Step>
    Within the `docker-compose.yaml` file uncomment `args`, `TMDB_READ_API_KEY`, `CORS_PROXY_URL`. 
      - Make sure `args` is in-line with `context` 
      - Make sure `TMDB_READ_API_KEY` and `CORS_PROXY_URL` are tabbed once to the right of `args`.
  </Steps.Step>
  
  <Steps.Step>
    Put your proxy URL in-between the double quotes of `CORS_PROXY_URL: ""`. Make sure to not have a slash at the end of your URL. 
  
    Example (THIS IS AN EXAMPLE, IT WON'T WORK FOR YOU): `CORS_PROXY_URL: "https://test-proxy.test.workers.dev"`
  </Steps.Step>
  
  <Steps.Step>
    Put your TMDB Read Access Token inside the quotes of `TMDB_READ_API_KEY: ""`. Please read [the TMDB page](./tmdb.mdx) on how to get an API key.
  </Steps.Step>
  
  <Steps.Step>
    Uncomment and add any [additional environment variables](configuration.mdx) you may need. Remove the `VITE_` prefix when adding an environment variable to `args`.
  </Steps.Step>
  
  <Steps.Step>
    Save the file!
  </Steps.Step>
  
  <Steps.Step>
    Now use [docker](https://docs.docker.com/get-docker/) to run `movieweb` as background service.
  
      ```bash
      # P-Stream is the current working directory
      $ docker compose up --detach
      ```
  </Steps.Step>
  
  <Steps.Step>
    Verify that setup was successful
      - Navigate to `http://localhost`. You should see the UI for `P-Stream`. Find something to watch and make sure that it plays. 
      - View logs with
  
      ```bash
      $ docker compose logs --follow movieweb
      ```
  </Steps.Step>
  
  <Steps.Step>
    Set a static IP address for your device.
      - For Raspberry Pi: [guide](https://www.makeuseof.com/raspberry-pi-set-static-ip/)
      - For Mac: [guide](https://www.macinstruct.com/tutorials/how-to-set-a-static-ip-address-on-a-mac/)
      - For Windows: [guide](https://www.pcmag.com/how-to/how-to-set-up-a-static-ip-address)
  </Steps.Step>
  
  <Steps.Step>
    Navigate to movie web at `http://<static-ip-address` from another device connected to your network.
  </Steps.Step>
</Steps>

### To Perform Updates For New Releases of Movie Web

Make sure `P-Stream` is your current working directory and run:

```bash
# Re-build the image and start the container
$ docker compose up --build --detach
```