WISE Freshwater: Volto Frontend

Documentation

A training on how to create your own website using Volto is available as part of the Plone training at https://training.plone.org/5/volto/index.html.

Getting started

1. Install nvm

   touch ~/.bash_profile
   curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.34.0/install.sh | bash
   
   source ~/.bash_profile
   nvm version
   

2. Install latest NodeJS 12.x:

   nvm install 12
   nvm use 12
   node -v
   v12.16.2
   

3. Install yarn

   curl -o- -L https://yarnpkg.com/install.sh | bash
   yarn -v
   

4. Clone:

   $ git clone https://github.com/eea/freshwater-frontend.git
   $ cd freshwater-frontend
   

5. Activate develop add-ons

   $ yarn develop
   

6. Install dependencies using Yarn

   $ yarn
   

7. Start frontend in develop mode without the need to build the JS resources

   $ yarn start
   

8. Or start frontend in production mode

   $ yarn start:prod
   

9. See application at http://localhost:3000

Backend

Installation:

Plone 5 backend package for the WISE-freshwater: https://github.com/eea/freshwater-backend

1. Install Docker

2. Install Docker Compose

3. Clone (in freshwater-frontend package)

   $ cd freshwater-frontend
   $ git clone git@github.com:eea/freshwater-backend.git backend
   

4. Build and run the image

   $ docker-compose build
   $ docker-compose up -d
   

Start the stack:

  $ docker-compose up -d ploneapi

Use the shell container to start Plone:

  $ docker-compose exec ploneapi bash

Inside the Plone container, you can use the instance script to start Zope:

  $ bin/standalone fg

Automated @eeacms dependencies upgrades

All the addon dependencies that are located in the dependencies section of package.json file that belong to @eeacms and have a MAJOR.MINOR.PATCH version are automatically upgraded on the release of a new version of the addon. This upgrade is done directly on the develop branch.

Exceptions from automated upgrades ( see https://docs.npmjs.com/cli/v8/configuring-npm/package-json#dependencies for dependency configuration examples ) :

• All github or local paths
• Any version intervals ( ^version or >version or MAJOR.MINOR.x etc )

Release

See release

Production

For backend image see https://github.com/eea/eea.docker.plonesaas/tree/freshwater

Deploy

• Within Rancher > Catalog > EEA deploy Volto - Freshwater

Secret Scanning

This repository uses the Betterleaks GitHub Action to scan the current repository content on every push and pull request. The scan uses the rules in .gitleaks.toml and uploads a betterleaks-report artifact when a finding is detected.

If the optional SMTP secrets are configured, failed scans also send an email to the last commit committer. The workflow expects these repository or organization secrets:

• SMTP_URL
• SMTP_PORT (optional, defaults to 25)
• SMTP_EMAIL
• SMTP_PASSWORD (optional if the SMTP server does not require authentication)

Port 465 is sent with direct TLS; other ports use the default SMTP handshake. The email includes a short finding summary from the redacted Betterleaks report, including the redacted matched line from each finding.

There are three common outcomes:

1. Everything is OK. The Betterleaks / Scan for secrets check is green and no action is needed. Regular references to runtime values are OK, for example:

   const tokenFromCookie = req.universalCookies.get('auth_token');

2. A real secret was found. The check is red and the workflow log asks you to download the betterleaks-report artifact. Open the artifact from the GitHub Actions run and check the reported file, line and rule. Remove the committed value, move it to the proper secret store, and rotate it if it was exposed. A report entry looks like this:

   {
     "RuleID": "secret-literal-assignment",
     "File": "src/config.js",
     "StartLine": 12,
     "Secret": "[REDACTED]"
   }

3. The finding is a false positive. Keep the value only if it is clearly not sensitive, such as a test fixture, placeholder, or public example. Add betterleaks:allow on the same line and include a short explanation in the pull request.

   const testPassword = 'admin'; //betterleaks:allow

   password: "admin" #betterleaks:allow

Do not add betterleaks:allow to real credentials.