Web Application Development

Incomplete, needs to be expanded. Please help to fill the gaps or discuss the issue on the talk page

Basic instructions for working on the new WebApp

Getting started

The WebApp uses Angular and PrimeNG

Visual Studio Code (VSC) development environment is recommended to work on the WebApp.

To load the code into VSC cd to /mythtv/http/mythbackend and run code . to start working on the webapp.

In a terminal in VSC type ng serve to start the development http server and point your web browser to http://localhost:4200/. Each time you save something in VSC the dev web server cause your browser to reload the web app making it easy to make changes.

Be aware that we use Angular v13.x and many tutorials and examples on the web may not compile or work properly if they was written for earlier versions.

Many examples on the web put their assets like images, data files, fonts, css files etc in the src/assets directory unfortunately because of the way our webapp has to be proxied to get it to work with our web server that does not work. Instead you can put your assets into the mythtv/html/assets directory which is made available to the webapp once it is installed. This can lead to some head scratching if you don't make sure the assets are installed before you start the backend and the assets are in there own folder since the backend will only search for them the first time it is started.

Build the Web App

cd into .../mythtv/html/backend and run npm run-script build to build the project. The build artefacts will be stored in the ../apps/backend directory. These should be committed, so that the backend webapp does not need rebuilding at build time.