React implementation - Storm JavaScript Player

Below you'll find a basic implementation for ReactJS. A dedicated component is available to download from NPM/Yarn.

Installation

1. Node

   To include Storm Player for React in Node, first install NPM

                                   
   npm install @stormstreaming/stormplayer-react
                               

2. Yarn

   Before using Yarn, make sure to install it first

                                   
   yarn add @stormstreaming/stormplayer-react
                               

Component usage

                        
import React from "react";
import StormPlayer from './@stormstreaming/stormplayer-react' // point to where the functional component is stored

const App = () => {
  const playerRef = React.useRef(null);

  const libraryConfig = {
    connectionType:"direct",
    stream: {
        serverList: [
            { host: "localhost", port: 80, ssl: false}
        ],
        sourceList: [
            { protocol: "storm", streamName:"test", application:"live"},
        ],
    },
    settings: {
        autoStart: true,
        video: {
            width: 640,
            height: 360,
        },
    }
  }

  const handlePlayerReady = (player) => {
    playerRef.current = player;

  };


  return (
    <>
      <div>Rest of app here</div>

      <StormPlayer libraryConfig={libraryConfig} playerConfig="{playerConfig}" />

      <div>Rest of app here</div>
    </>
  );
}