Angular

Projekte anlegen

ng new MyProject --skip-install --prefix lm --style scss --ai-config none --dry-run
ng new Spielwiese --directory . --style scss --ai-config none --ssr false

Die Optionen haben dabei folgende Bedeutung:

–skip-install Legt das Projekt an, aber installiert die benötigten npm Pakete nicht.
–prefix lm Legt das Kürzel fest, das vor Komponenten- und Direktiven-Namen verwendet wird.
–style scss Bestimmt SCSS als Format für das Styling der Anwendung.
–ai-config none Legt fest, das keine AI Integration erstellt werden soll.
–dry-run Sagt Angular, nur anzuzeigen, was passiert, jedoch keine Dateien anzulegen.
–ssr false überspringt die Dateien für Server Side Rendering.

Locale

Um die Seite als deutsche Seite zu erstellen, sollte zum einen das lang-Tag in der index.html geändert werden:

<html lang="de">

Des weiteren sollte die Standard-Locale auf „de“ umgestellt werden, hierzu folgende Zeilen in der app.ts einfügen:

import { registerLocaleData } from '@angular/common';
import localeDe from '@angular/common/locales/de'
registerLocaleData(localeDe)

Zusatzpakete

Der neue Linter ist aktuell ESLint. Installation und erster Testlauf:

ng add @angular-eslint/schematics
ng lint

TODO

Genauer anschauen:

Unit Tests mit Vitetest
E2E Tests mit Cypress

Build-Prozess

Der Build Prozess umfasst das commiten des lokalen Zustandes, pull auf Seiten des Servers, Datenbankmigration, Backend erstellen und schließlich das Frontend erstellen. Hier die Server-Befehle:

cd workspace
git pull
cd apps/api
npx prisma migrate deploy
npx prisma generate
...
sudo docker compose down
sudo docker compose build --no-cache
sudo docker compose up -d
npx nx build frontend
sudo docker compose logs -f
# Zum Aufräumen der alten Container
docker system prune --all --volumes --force