Tagfalter Monitoring Desktop Landingpage

Local configuration

To set up local configuration rename .env.sample to .env.local

Change configuration as needed.

Env-Variables:

Create an .env file containing the required environment variables for the project to run. A sample is given in "env.sample" or just rename the env.sample to ".env".

PROD AND STAGE Systems

Please configure the .env files according the above example for the desired systems.

How Vue handles .env files is described here: https://cli.vuejs.org/guide/mode-and-env.html#modes

LOCAL DEV Dockerized

To apply the latest docker configuration, (re-)build the required docker image (if Dockerfile-dev has been changed).

docker-compose -f docker-compose-dev.yml build --no-cache

Afterwards spin up the docker environment. This might take some time, since the serve script is triggered on startup.

docker-compose -f docker-compose-dev.yml up -d

LOCAL DEV not inside Docker

• access app folder before using npm
• this structure is needed for the build process of the application

cd app/

See package.json for scripts like serve, build, test:unit, lint You can run everything with "npm run" also.

Run app in browser

After starting up the frontend locally on either way visit:

http://localhost:8080

Coding conventions and format

Conventions

There are coding conventions which are recommended for Typescript (https://www.typescriptlang.org/docs/handbook/declaration-files/do-s-and-don-ts.html). Many of these conventions are checked and corrected by ESLint.

Format

To have a unique code format when using different IDE's, a .editorconfig-File is located the root of the project. This file is telling the IDE how to format the code of the project.

editorconfig-Plugin - Visual Studio Code

• (go to) "Preferences" -> "Extensions" -> (search for) "editorconfig" -> install "EditorConfig for VS Code " plugin
• to format an opened file press:(MacOS) cmd + s (save file)

editorconfig-Plugin - PHPStorm

• (go to) "Preferences" -> "Plugins" -> (search for) "editorconfig" -> install plugin
• to format an opened file press:(MacOS) alt + cmd + l

editorconfig-Plugin - WebStorm, IntelliJIDEA

• the plugin is already installed
• to format an opened file press:(MacOS) alt + cmd + l

Views & Router

• router is already created for this example.

GraphQL

The GraphQL server URL. There, you can directly go to GraphiQL, GraphQL's official playground and make a sample requests

Customize configuration

See Configuration Reference.

CHANGELOG

changelog

TODOs && Example Queries

todo

GIT Usage and workflow

git