Skip to content

Development of frontend resources

theotherp edited this page May 25, 2018 · 5 revisions

If you want to help with the development of the UI (JS, CSS, etc.) please follow this guideline:

Never edit the files in the src/main/resources/static. They're automatically generated, at parts minified and are not meant to be human readable.

Prerequisites

If you already have gulp installed go to the next chapter.

  1. Install NodeJS: Download or use a package manager
  2. Install gulp: npm install -g gulp-cli
  3. Install bower: npm install -g bower

Running gulp

  1. In the main folder of your NZBHydra 2 installation (where readme.md is located) create a folder static (restart Hydra if already started)
  2. Clone the repository somewhere else and in a command line window go to the core folder
  3. Install node modules: npm install
  4. Install the bower components: bower install
  5. Run the gulp default target with the parameter --static <full path to static folder from step 1>, e.g. gulp --static /etc/nzbhydra2/static.
  6. Do your changes in the files in the ui-src folder in the repository. Gulp will watch them and whenever you save a changed file it will automatically build new files and write them to the static folder. Reload NZBHydra 2 in your browser to see the changes. (Do any change to any HTML or JS file to get the static to fill.)
  7. Create a PR for your changes to the develop branch.

Note: Steps 1-4 are only needed the first time or whenever I make changes to the files bower.json or package.json.