---
# System prepended metadata

title: SQ5A

---

# SQ5A
> [color=#47e8a8]
> [name=Lucas]
> [time=Wed, Mar 21, 2023]
> [name=Lukas]
> [time=Wed, Mar 21, 2023]
> [hackmd.io/@LucLukWissM324/HJ6TAAIx3](https://hackmd.io/@LucLukWissM324/HJ6TAAIx3)

Da wir die Applikation auf einem VM Server laufen lassen mussten wir zuerst im Frontend anpassungen machen die die CRUD Requests auf port 8001 machen.
In der VirtualBox wirt dann von port 8001 auf 8080 weitergeleited.

![](https://i.imgur.com/eJdIoeu.png)


## Pipeline

### Frontend
Auf gitlab haben wir unter CI/CD im Editor das .gitlab-ci.yml file im branch frontend erstellt.

```jsonld
stages:
  - preparation
  - building

image: node:latest

cache:
  key: "$CI_JOB_NAME-$CI_COMMIT_REF_SLUG"

npm:
  stage: preparation
  before_script:
    - npm install -g npm@latest
  script:
    - npm -v
    - npm install --no-optional --legacy-peer-deps
  artifacts:
    paths:
      - node_modules/
    expire_in: 1 days
    when: always
  cache:
    paths:
      - node_modules/

build-assets:
  stage: building
  dependencies:
    - npm
  before_script:
    - npm install -g npm@latest
  script:
    - npm --version
    - node --version
    - unset NODE_OPTIONS
    - CI=false npm run build
  artifacts:
    paths:
      - build/static/css
      - build/static/js
      - build/static/media
      - build/static/img
      - build/asset-manifest.json
      - build/manifest.json
      - build/index.html
    expire_in: 1 days
    when: always
```

>error... wiss gitlab down...als alternativ Lösung haben wir auf gitlab.com ein Account erstellt um das Projekt weiter zu führen.

Unter CI/CD -> Editor haben wir die Config in den editor für das .gitlab-ci.yml file einfügen.

![](https://i.imgur.com/gGWaEyS.png)

Und Commit.

![](https://i.imgur.com/ZkLBlKW.png)

---

Der Build Prozess des Frontend ist erfolgreich.

![](https://i.imgur.com/uMVQGHe.png)
 Auf passed Clicken und dan weiter auf build-assets.
![](https://i.imgur.com/VoTzSIR.png)

![](https://i.imgur.com/NXFxBHM.png)



### Backend
Auch für das Backend haben wir ein eigenen Branch erstellt um die Artefakte und CI/CD befehle übersichtlicher zu gestalten.
Das .gitlab-ci.yml des Backends ist etwas kompackter. 
```json
image: maven:3.8.3-openjdk-17

stages:
  - build

build:
  stage: build
  script:
    - mvn clean package -DskipTests=true -Pprod
    - mvn war:war
  artifacts:
    paths:
      - target/demo-0.0.1-SNAPSHOT.war
```


![](https://i.imgur.com/WaGcciK.png)

Build erfolgreich! Das backend wurde als demo-0.0.1-SNAPSHOT.war erstellt und ist nun unter Artefakte verfügbar.

![](https://i.imgur.com/tCynYGj.png)
