Getting Ready for Development¶

1. Angular Requirements¶

To get up and running, first you need to install Node.js, npm package manager, Angular, and the Angular CLI.

Typically, npm comes installed with Node.js, but for Node.js you have to download it and install it manually.

Project setup can be achieved by following the steps described below:

1. (Optional) Download and install Node Version Manager Node Version Manager (nvm)

   OR you can navigate to the corresponding GitHub page for more information NVM GitHub

2. Using nvm download and install the following NodeJS versions

   1. nvm install 14.21.1

      Hint

      Version 14.21.1 is recommended.

      AnalyticsClient should work with any NodeJS v14.10+

   2. (Optional) nvm install 18.18.2

      Warning

      AnalyticsClient has a dependency that can be installed using NodeJS version 14.10+

3. Open the project folder with a code editor

   Hint

   Recommended: Visual Studio Code

4. Open a powershell window (Can be done within VSCode)

   1. Run: nvm use 14.21.1

   2. Run: npm install

   3. Wait for npm to finish installing the required packages

2. Node Modules¶

At the root folder of the AnalyticsClient project, npm has created a folder named:

node_modules

where all third party packages and dependencies are stored.

The dependencies are specified inside the file package.json in the root directory.

3. Environment Variables¶

Assuming all packages are downloaded correctly, you need to specify certain environment variables.

For the development environment, open the file environment.ts under src/environments.

export const environment = {
    production: false,
    identityServer: 'https://localhost:44355',
    analyticsAPI: 'http://localhost:5002',
    clientId: '',
    scopes: '',
    responseType: '',
};

There you need to place the localhost Login service URL, and the same for the AnalyticsAPI.

Additionally, you need to specify the IdentityServer4 Client required for the Portal to authorize with the Login service.

If you haven’t made any changes to the Login service and are running with the default Clients, you can find this there at the Config.cs.

In any case, here is the default configuration:

export const environment = {
    production: false,
    identityServer: 'https://localhost:44355',
    analyticsAPI: 'http://localhost:5002',
    clientId: 'WebPortal',
    scopes: 'openid profile roles IdentityServerApi',
    responseType: 'code',
};

4. Run the Service¶

With these minimum configuration requirements, we are ready to start the service and work localhost.

(Optional) If both recommended versions of NodeJS are installed, switch to NodeJS version 18.18.2

nvm use 18.18.2

Then, from the root directory, type the following command:

npm start

After compilation is finished, point your browser at localhost:4200 and you are ready to go.

Keep in mind the warning below!

5. (Optional - NodeJS v18+) Linting¶

By default, linting is not part of AnalyticsClient.

In case linting is mandatory, AnalyticsClient works well with ESLint

In case of version control, before committing your changes make sure to run:

npm run lint:ci

This command will scan all TypeScript and SCSS files and will return errors, if any.