144 lines
4.0 KiB
Markdown
144 lines
4.0 KiB
Markdown
# qivip-Projektanleitung
|
|
|
|
## Inhaltsverzeichnis
|
|
|
|
1. [Initialisierung des Projekts](#initialisierung-des-projekts)
|
|
2. [Starten des Servers](#starten-des-servers)
|
|
3. [Superuser erstellen](#superuser-erstellen)
|
|
4. [Tailwind-Nutzung](#tailwind-nutzung)
|
|
5. [Issue - Merge Request - Merge](#issue-mergerequest-merge)
|
|
|
|
## Initialisierung des Projekts
|
|
|
|
Um das Projekt erfolgreich zu starten, folge diesen Schritten:
|
|
|
|
1. Einen SSH-Key erstellen und den öffentlichen Schlüssel bei **Edugit** hinterlegen.
|
|
2. Das Repository klonen:
|
|
```sh
|
|
git clone <repository-url>
|
|
```
|
|
3. In den `qivip`-Ordner wechseln:
|
|
```sh
|
|
cd qivip
|
|
```
|
|
4. Eine virtuelle Umgebung namens `.venv` erstellen:
|
|
```sh
|
|
python3 -m venv .venv
|
|
```
|
|
5. Die virtuelle Umgebung aktivieren:
|
|
- **Unter Linux:**
|
|
```sh
|
|
source .venv/bin/activate
|
|
```
|
|
- **Unter Windows (cmd):**
|
|
```sh
|
|
.venv\Scripts\activate
|
|
```
|
|
6. Die benötigten Abhängigkeiten installieren:
|
|
```sh
|
|
pip install -r requirements.txt
|
|
```
|
|
7. Die Datenbank migrieren:
|
|
```sh
|
|
python3 core/manage.py migrate
|
|
```
|
|
|
|
## Starten des Servers
|
|
|
|
### Entwicklungsserver starten
|
|
|
|
Für die Entwicklung mit WebSocket-Unterstützung verwenden wir Daphne:
|
|
|
|
1. Aktiviere die virtuelle Umgebung:
|
|
```sh
|
|
source .venv/bin/activate # Linux
|
|
.venv\Scripts\activate # Windows
|
|
```
|
|
|
|
2. Starte den Daphne-Server:
|
|
```sh
|
|
# Im Verzeichnis 'django'
|
|
daphne -b 127.0.0.1 -p 8000 core.asgi:application
|
|
```
|
|
|
|
Alternativ kannst du den Django-Entwicklungsserver verwenden, wenn du keine WebSocket-Funktionalität benötigst:
|
|
```sh
|
|
python3 core/manage.py runserver
|
|
```
|
|
|
|
### Produktionsserver starten
|
|
|
|
Für den Produktivbetrieb verwenden wir Daphne als ASGI-Server, der sowohl HTTP als auch WebSocket-Verbindungen unterstützt:
|
|
|
|
1. Aktiviere die virtuelle Umgebung wie oben beschrieben
|
|
|
|
2. Sammle die statischen Dateien:
|
|
```sh
|
|
python3 core/manage.py collectstatic
|
|
```
|
|
|
|
3. Starte den Daphne-Server:
|
|
```sh
|
|
daphne -b 0.0.0.0 -p 8000 core.asgi:application
|
|
```
|
|
- `-b 0.0.0.0`: Bindet den Server an alle Netzwerk-Interfaces
|
|
- `-p 8000`: Port (anpassbar)
|
|
|
|
Damit ist das Projekt erfolgreich eingerichtet und der Server kann gestartet werden!
|
|
|
|
## Superuser erstellen
|
|
|
|
Ein Superuser wird benötigt, um sich im Admin-Bereich der Anwendung anzumelden. Um einen Superuser zu erstellen, führe folgenden Befehl aus:
|
|
|
|
```sh
|
|
python3 core/manage.py createsuperuser
|
|
```
|
|
|
|
Gib anschließend die geforderten Daten ein (Benutzername, E-Mail, Passwort). Nach erfolgreicher Erstellung kannst du dich mit diesen Zugangsdaten im Admin-Bereich und in der Accounts-App der Anwendung anmelden.
|
|
|
|
## Tailwind-Nutzung
|
|
### Installation
|
|
|
|
TailwindCSS kann auf zwei Wege installiert werden:
|
|
|
|
- Mit der [Binärdatei](https://github.com/tailwindlabs/tailwindcss/releases/latest)
|
|
- Mit NPM:
|
|
```sh
|
|
npm install tailwindcss @tailwindcss/cli
|
|
```
|
|
|
|
### Datei generieren
|
|
|
|
```sh
|
|
# Bei Verwendung der Binärdatei:
|
|
tailwindcss -i <INPUT-DATEI> -o <OUTPUT-DATEI> --watch --minify
|
|
|
|
# Bei Verwendung von NPM:
|
|
npx @tailwindcss/cli -i <INPUT-DATEI> -o <OUTPUT-DATEI> --watch --minify
|
|
```
|
|
|
|
- INPUT-DATEI: CSS Datei, welche die Einbindung und Konfiguration von Tailwind enthält
|
|
- OUTPUT-DATEI: CSS Datei, die in den Seiten eingebunden wird
|
|
- --watch: Änderungen im aktuellen Verzeichnis erkennen und Output neugenerieren
|
|
- --minify: Output Datei so klein wie möglich halten
|
|
|
|
**Beispiel:**
|
|
|
|
```sh
|
|
# unter Linux mit Tailwind Binärdatei:
|
|
tailwindcss -i static/css/t-input.css -o static/css/t-style.css --watch --minify
|
|
|
|
# unter Windows mit NPM (in bash mit '/' statt '\'):
|
|
npx @tailwindcss/cli -i .\static\css\t-input.css -o .\static\css\t-style.css --watch --minify
|
|
```
|
|
|
|
## Issue - Merge Request - Merge
|
|
|
|
Hier der vereinbarte Arbeitsablauf:
|
|
|
|
1. Issue erstellen - das geht am einfachsten über die Webseite. Der Titel beschreibt kurz und klar, was angestrebt wird.
|
|
|
|
2. Merge Request anlegen - dadurch wird der Bransch automatisch angelegt. Dieser kann mit `git pull` geholt und mit `git checkout <branch>` bearbeitet werden.
|
|
|
|
3. Nach dem Hochladen kann der Merge in den Master durchgeführt werden.
|