The first time, install dependencies :

npm i

To start the application :

npm start

The application is accessible at this location : https://localhost:8084

When code is changed, it's automatically built and the web page refresh by its own (thanks webpack dev server).

Install the following vs-code extensions :

- "TSLint (deprecated)" extention
- "Prettier - Code formatter" extention (Author : Esben Petersen)
- "vscode-styled-components" extention (Author : Julien Poissonier)

Configure vscode

- Create or edit app/.vscode/settings.json
- Add the following content :
{
  "tslint.autoFixOnSave": true,
  "tslint.enable": true,
  "tslint.configFile": "./build/tslint.json",
  "editor.formatOnSave": true,
  "editor.formatOnPaste": true,
  "editor.tabSize": 2,
  "editor.detectIndentation": false,
  "[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.codeActionsOnSave": {
      "source.organizeImports": true
    }
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.codeActionsOnSave": {
      "source.organizeImports": true
    }
  },
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "javascript.updateImportsOnFileMove.enabled": "always",
  "typescript.updateImportsOnFileMove.enabled": "always"
}

VPS publishing

When working in a VPS environment, your personal VPS expect to find the Portal compiled sources in a local diretory inside the web hosting VPS infrascructure.

To achieve this you must run this command inside the root of your local checkout of the portal:

./syncAndBuild.sh <vps-prefix>

If your vps is "dev-jdoe.jmapcloud.io" then you should run:

./syncAndBuild.sh dev-jdoe

after build, your compiled portal would be accessible at https://portal.dev-jdoe.jmapcloud.io/

Publishing on npm

When we want to publish the Portal code on jsdelivr (npm proxy), we must proceed with the following steps:

• Change the package version
• run a script in production node environment to compile and push the code to npm
• add a git tag for the published version
• adjust npm tags if needed (dev,qa,prod)
• purge jsdelivr cache for tags if needed

In details:

• make sure your git working directory is clean (no changes)
• make sure the portal builds in production
  • to make the node environment to be "production", rename the file /build/env_config.js to /build/_env_config.js
  • run npm run build and validate that the build succeeds
• Increment the package version in package.json:
  • "version": "x.y.zz" increment the required part of version
• run npm install to update the package-lock.json
• git commit the version change: git add .; git commit -m "jmapcloud-portal vx.y.zz" (with the good version number)
• run npm run build again. since the package number has been changed, the script will publish the pacakge on npm with the new version number and will adjust the latest tag
• if and when the production build has succeeded, add a git tag for the version:
  • git tag vx.y.zz -m "jmapcloud-portal vx.y.zz"
  • push your commits: git push; git push --tags
• if and when the production build has succeeded, change the requires npm tags:
  • normally only update dev and qa tags:
    • npm dist-tag add [email protected] dev
    • npm dist-tag add [email protected] qa
  • When the JMC production environment is rolled out, we must also change the prod tag:
    • npm dist-tag add [email protected] prod
• Finally, call the jsdelivr cache invalidation endpoint to clear jsdelivr's cache for the tags.
  • The call is a POST
  • Url is: http://purge.jsdelivr.net
  • Body is:

{"path":
 [
   "/npm/jmapcloud-dashboard-js@latest",
   "/npm/jmapcloud-dashboard-js@latest/public/index.js",
   "/npm/jmapcloud-dashboard-js@dev",
   "/npm/jmapcloud-dashboard-js@dev/public/index.js",
   "/npm/jmapcloud-dashboard-js@qa",
   "/npm/jmapcloud-dashboard-js@qa/public/index.js",
   "/npm/jmapcloud-dashboard-js@prod",
   "/npm/jmapcloud-dashboard-js@prod/public/index.js",
   "/npm/jmapcloud-portal@latest",
   "/npm/jmapcloud-portal@latest/public/index.js",
   "/npm/jmapcloud-portal@dev",
   "/npm/jmapcloud-portal@dev/public/index.js",
   "/npm/jmapcloud-portal@qa",
   "/npm/jmapcloud-portal@qa/public/index.js",
   "/npm/jmapcloud-portal@prod",
   "/npm/jmapcloud-portal@prod/public/index.js"
 ]
}

• reset your env file for production: rename the file /build/_env_config.js to /build/env_config.js