In order to create a deployable version of JW OTT Webapp, follow these instructions in this document.
The following tools are needed to start building JW OTT Webapp. Follow the instructions on the links below:
- Clone the ott-web-app repository on your local machine.
$ cd ~/
$ git clone https://github.com/jwplayer/ott-web-app.git
$ cd ott-web-app
- Install the required dependencies. Optional dependencies include packages that are not necessary to build the project. These optional dependencies can be safely ignored.
$ yarn --ignore-optional
NOTE: Some of the easy deployments instructions require installing these optional dependencies. Use the
yarn
command to install all dependencies. Theyarn
command can be run even ifyarn --ignore-optional
has been previously run.
-
Create or update the .ini files in
/ini
for the modes you will be running in (probably dev and prod.) You can copy the ini file from/ini/templates
into/ini
. The files in/ini
are git-ignored, so you do not need to worry about account values in source control, but you will need to recreate the ini files each time you make a fresh checkout of the repository.The .ini files provide startup values to the application such as which app config to load by default. See initialization-file for more details.
-
Start the local development server.
$ yarn start
If you encounter any errors, make sure you have correctly set the defaultConfigSource
in /ini/.webapp.dev.ini
to point to a valid app config from your JWP account.
NOTE: Only use the development server for development purposes. The development server is not optimized for production usage.
- Build a deployable version of the JW OTT Webapp source code.
This command creates a new folder in the projects root folder named build. Thepublic
folder from the build directory can be uploaded to any static hosting provider to run the web app from that host.
$ yarn build
If you have not made any changes to the JW OTT Webapp configuration or source code, changes can now be made. Be sure to run the yarn build
command after making any changes.
If you encounter any errors, first check to make sure you've properly updated /ini/.webapp.prod.ini
to point defaultConfigSource
to your production app config from your JWP account.
We make use of Vite's 'mode' concept to cleanly separate different deployments.
For most cases, you will want to use dev
, test
, or prod
modes. The supported modes are described below.
Please keep in mind that there is a nuanced difference between vite mode
and whether you are running a development or production build as determined by NODE_ENV
.
Mode can be whatever different deployment environments that our application can be run in, while the build type will always be either development
or production
.
Typically when you run the development server using yarn start
, it will be a development
build and you build the code with yarn build
and then host it from static hosting, you will be running a production build.
Production builds optimize code and minimize debug information, while development builds are made for developers to dig into.
- dev - used for developers to locally develop, test, and debug code. Has the most debug information, including a config selector to help developers quickly switch between app configs. Will allow any app config to be loaded.
- test - used when running unit and e2e tests. Should typically be run as a production build. Will only load a select list of test app configs
- prod - default used when running
yarn build
to create compiled code for production hosting. You should make sure to update the prod .ini file to only allow app configs from your account. - demo - used for the JWP preview site and includes a dialog to switch between app configs. Will allow any app-config to be loaded and does not have a default config.
- preview - used for github PR previews. Behaves like a hybrid between dev and demo.
- jwdev - this mode is for running code on JW's internal dev environment. It will only work for JW employees on the internal network.