Installation process

This guide outlines how to set up FP-Player, with the JavaScript SDK that integrates seamless video playback into your development projects. Choose between two installation methods — npm (Node Package Manager) for package-based installations or CDN (Content Delivery Network) for quicker embedding in web applications.

You can also use the GitHub repository for FastPix web player.

Choosing your installation method: npm vs. CDN

npm (Node Package Manager)

Ideal for complex applications with multiple dependencies. npm offers version control and automatic updates. This method requires a setup process, but it provides greater control over your project's dependencies.

CDN (Content Delivery Network)

Perfect for quick integration and faster loading times. CDN is suitable for simpler applications but offers less control over versioning and updates.

Prerequisites

Node.js (required for npm installation)

If you choose to install fp-player via npm, you need Node.js installed on your system. Node.js allows you to manage project dependencies through the command line.

To install Node.js:

Visit the official Node.js website.
Download the appropriate installer for your operating system.
Follow the installation steps as provided.

Command line or terminal

You will need a command line or terminal to interact with Node.js (if using npm) or to navigate through your project's file structure. Most operating systems include a built-in command line or terminal application. If you need assistance accessing it, a quick web search can provide guidance.

Installation with npm

Step 1: Open your command line or terminal

Open your terminal (Command Prompt on Windows, Terminal on macOS/Linux).

On Windows: Press Win + R, type cmd, and press Enter.
On macOS: Press Cmd + Space, type Terminal, and press Enter.
On Linux: Press Ctrl + Alt + T.

Step 2: Initialize your project (if not already initialized)

Navigate to your project’s root directory:

cd path/to/your/project

Initialize your project (if not already set up) with npm:

npm init

Step 3: Install FP-Player

To install FP-Player, use the command below. If you want to use any particular version of the player, you can do so by adding @fp-player-version in the command and substituting <fp-player-version> with the desired version number (available versions are listed on the official npm documentation):

npm install @fastpix/player

This command will add FP-Player and its dependencies to your project.

Step 4: Verify your installation

Once the installation is complete, FP-Player will be located in the node_modules directory of your project. This confirms a successful installation.

Step 5: Import FP-Player into your project

In your JavaScript file, import FP-Player using the following syntax:

import "@fastpix/player";

Installation via CDN

Step 1: Get the CDN link

Use the following script tag for FP-Player:

<script src="https://cdn.jsdelivr.net/npm/@fastpix/player@<fp-player-version>/dist/player.js"></script>

Replace <fp-player-version> with the specific version you wish to use.

Step 2: Include the CDN link in your HTML

Add the CDN script link to your HTML file’s <head> section:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>FastPix Player</title>
    <script src="https://cdn.jsdelivr.net/npm/@fastpix/[email protected]/dist/player.js 
"></script>
</head>
<body>
    <fp-player playback-id="PLAYBACK_ID" stream-type="on-demand"></fp-player>
</body>
</html>

With the CDN link in place, whenever a web page loads, FP-Player will be loaded automatically and ready to use, enabling seamless video playback.

Your player is ready to use

By following these steps, you would have successfully installed FP-Player using either npm or CDN. Whether you chose the flexibility of npm or the speed of CDN, you are now ready to integrate high-quality video playback into your project.