Bereitstellen einer Hugo-Site für die Produktion mit Git Hooks unter Ubuntu 14.04

Einführung

Hugo ist ein statischer Site-Generator, mit dem Sie einfach Webinhalte erstellen und veröffentlichen können, indem Sie in einfachen Auszeichnungssprachen schreiben. Hugo kann Ihre Inhalte gemäß den angegebenen Anforderungen analysieren und ein Thema anwenden, um konsistente Webseiten zu generieren, die problemlos auf einem beliebigen Webserver oder Host gehostet werden können.

In einem https://www.digitalocean.com/community/tutorials/installations-und-gebrauchsanweisungen-für-den-statischen-Sitegenerator-auf-ubuntu-14-04] haben wir uns damit befasst Wie installiere ich Hugo auf einem Ubuntu 14.04 System und benutze es, um Inhalte zu erstellen? In diesem Handbuch zeigen wir Ihnen, wie Sie ein System mit "+ git +" einrichten, mit dem Sie Ihre neuen Inhalte automatisch auf Ihrem Produktions-Webserver bereitstellen können.

Voraussetzungen

In diesem Handbuch wird davon ausgegangen, dass Sie einen Ubuntu 14.04-Computer als Entwicklungscomputer verwenden, wie in unserer https://www.digitalocean.com/community/tutorials/how-to-install-and-use-hugo beschrieben -die-statische-Website-Generator-auf-Ubuntu-14-04 [Hugo Installationsanleitung].

Wir werden einen * zweiten * Ubuntu 14.04-Server einrichten, um unsere eigentliche Produktions-Website zu bedienen. Stellen Sie auf diesem Server sicher, dass Sie einen Nicht-Root-Benutzer mit den Rechten "+ sudo +" erstellt haben. Sie können unserer initial server setup guide folgen, um dieses Konto zu erstellen.

Vorbereiten Ihres Entwicklungsservers

Wir starten auf unserem Entwicklungsserver (dem Server, der im vorherigen Hugo-Handbuch eingerichtet wurde). Melden Sie sich bei diesem Server mit demselben Nicht-Root-Konto an, das Sie zuletzt verwendet haben.

Auf diesem Server müssen einige Schritte ausgeführt werden, um die Bereitstellung in einem Schritt zu ermöglichen. Wir müssen:

Konfigurieren Sie den SSH-Schlüsselzugriff auf unseren Produktionsserver
Übertragen Sie das ursprüngliche Repository "+ git +" auf den Produktionsserver
Fügen Sie den Produktionsserver als + git + remote in unser Site-Repository ein

Lass uns anfangen.

Konfigurieren Sie den SSH-Schlüsselzugriff auf den Produktionsserver

Als Erstes konfigurieren wir den SSH-Schlüsselzugriff zwischen unseren beiden Servern. Auf diese Weise können wir die Bereitstellung durchführen, ohne jedes Mal ein Kennwort eingeben zu müssen. Wenn Sie bei jeder Bereitstellung zur Eingabe eines Kennworts aufgefordert werden möchten, können Sie diesen Schritt überspringen. Einige Benutzer möchten, dass das Kennwort während des Bereitstellungsvorgangs abgefragt wird, um eine erneute Überprüfung zu ermöglichen, bevor Inhalte live übertragen werden.

Überprüfen Sie zunächst, ob in Ihrem Konto auf dem Entwicklungsserver bereits ein SSH-Schlüsselpaar konfiguriert ist:

ls ~/.ssh/id_rsa

Wenn Sie eine Zeile erhalten, die so aussieht, ist noch kein SSH-Schlüsselpaar konfiguriert:

Outputls: cannot access /home/demouser/.ssh/id_rsa: No such file or directory

Sie können das fehlende Schlüsselpaar erstellen, indem Sie Folgendes eingeben:

ssh-keygen

Drücken Sie in allen Eingabeaufforderungen die EINGABETASTE, um einen kennwortlosen Schlüssel zu erstellen.

Wenn Sie mit dem Befehl "+ ls +" eine Zeile erhalten haben, die so aussieht, haben Sie bereits einen Schlüssel in Ihrem Konto:

Output/home/demouser/.ssh/id_rsa

Sobald Sie ein Schlüsselpaar haben, können Sie Ihren öffentlichen Schlüssel auf Ihren Produktionsserver übertragen, indem Sie dies eingeben. Ersetzen Sie im Befehl den Namen des Nicht-Root-Kontos, den Sie in der Phase der Voraussetzungen für dieses Handbuch auf Ihrem Produktionsserver konfiguriert haben:

ssh-copy-id @

Wenn Sie zum ersten Mal SSH zwischen diesen beiden Computern verwenden, werden Sie aufgefordert, die Verbindung zu bestätigen, indem Sie "Ja" eingeben. Anschließend werden Sie aufgefordert, das Benutzerkennwort für den Produktionsserver einzugeben. Ihr öffentlicher Schlüssel wird auf den Produktionsserver übertragen, sodass Sie sich beim nächsten Mal ohne Kennwort anmelden können.

Testen Sie diese Funktionalität, indem Sie mit dem Befehl "+ ssh +" nach dem Hostnamen Ihres Produktionsservers fragen:

ssh @ cat /etc/hostname

Sie sollten diesmal nicht aufgefordert werden, ein Kennwort einzugeben. Sie sollten den Hostnamen für Ihren Produktionsserver zurückerhalten:

Output

Übertragen Sie das anfängliche Git Repo auf den Production Server

Als nächstes müssen wir einen ersten Klon unseres Hugo-Repos auf unseren Produktionsserver übertragen. Dies benötigen wir, um später einen "+ post-receive " - Hook auf dem Produktionsserver einzurichten. Um dies zu erreichen, müssen wir einen "nackten" Klon unseres " git +" - Repos erstellen und auf unseren anderen Server kopieren.

Ein Bare-Repository ist ein spezielles "+ git " - Repository ohne Arbeitsverzeichnis. In herkömmlichen " git " - Repos werden Ihre Projektdateien im Hauptverzeichnis und die " git " - Versionsdaten in einem versteckten Verzeichnis mit dem Namen " .git " gespeichert. Ein Bare-Repo hat kein Arbeitsverzeichnis für Ihre Projektdateien, daher befinden sich die Dateien und Verzeichnisse, die normalerweise im versteckten Ordner " .git +" gespeichert sind, stattdessen im Hauptordner. Bare-Repos werden in der Regel für Remoteserver verwendet, da sie das Pushen von Inhalten vereinfachen.

Wir werden ein Bare-Repo aus unserem Haupt-Hugo-Repository im Verzeichnis + / tmp + erstellen. Bare Repos werden normalerweise durch ein abschließendes "+ .git " - Suffix gekennzeichnet. Um diese Kopie zu erstellen, verwenden wir den Befehl ` git clone ` mit der Option ` - bare +`:

git clone --bare ~/ /tmp/.git

Wir können dieses nackte Repository mit + scp + auf unseren Produktionsserver übertragen. Stellen Sie sicher, dass am Ende des Befehls das abschließende ":" steht, damit das Repo im Home-Verzeichnis des Benutzers auf dem Remote-System abgelegt wird.

scp -r /tmp/ @:

Fügen Sie eine Git-Fernbedienung für den Produktionsserver hinzu

Jetzt, da wir unser "+ git +" - Repository auf unserem Produktionsserver haben, können wir den Produktionsserver als verfolgtes Remote-Repository hinzufügen. Auf diese Weise können wir neue Inhalte problemlos auf unseren Produktionsserver übertragen.

Gehen Sie zurück in Ihr Hugo-Verzeichnis:

cd ~/

Wir müssen uns lediglich für einen Namen für die Fernbedienung entscheiden. In diesem Handbuch verwenden wir "+ prod +". Anschließend können wir die Verbindungsinformationen und den Speicherort unseres Bare-Repositorys auf dem fernen System angeben:

git remote add prod @:

Sie können diese Remote-Verbindung erst testen, nachdem wir "+ git +" auf unserem Produktionsserver installiert haben.

Einrichten des Produktionsservers

Nachdem unsere Entwicklungsmaschine vollständig konfiguriert ist, können wir mit dem Einrichten unseres Produktionssystems fortfahren.

Auf unserem Produktionssystem müssen wir die folgenden Schritte ausführen:

Installieren Sie "+ git ", " nginx" und "+ pigmente"
Installieren Sie Hugo und die Hugo-Themes
Konfigurieren Sie + nginx + so, dass Dateien von einem Speicherort in unserem Ausgangsverzeichnis bereitgestellt werden
Erstellen Sie ein "+ post-receive +" - Skript, um neue Inhalte bereitzustellen, die in unser Repository verschoben werden

Installieren Sie Git, Pygments und Nginx auf dem Produktionsserver

Als erstes sollten wir + git +, + pygments + und + nginx + auf dem Server installieren. Obwohl sich unser Projekt-Repository bereits auf unserem Server befindet, benötigen wir die "+ git " - Software, um Pushs zu empfangen und unser Implementierungsskript auszuführen. Wir benötigen " pygments ", um die serverseitige Syntaxhervorhebung für alle Codeblöcke anzuwenden. Wir verwenden " nginx" als Webserver, der Ihre Inhalte den Besuchern zur Verfügung stellt.

Aktualisieren Sie den lokalen Paketindex und installieren Sie "+ git " und " nginx" aus den Ubuntu-Standard-Repositorys. Wir müssen + pip +, den Python-Paketmanager, installieren, um + pygments + zu erhalten:

sudo apt-get update
sudo apt-get install git nginx python-pip

Wir können dann + pip + verwenden, um + pygments + zu installieren:

sudo pip install Pygments

Nachdem der Download abgeschlossen ist, können wir testen, ob wir das Remote-Repository auf unserem Entwicklungscomputer korrekt eingerichtet haben. Wechseln Sie auf Ihrer * Entwicklungsmaschine * in Ihr Hugo-Projektverzeichnis und verwenden Sie den Befehl + git ls-remote +:

cd ~/
git ls-remote prod

Wenn + git + eine Verbindung zwischen den Repositorys auf Ihren Entwicklungs- und Produktionsmaschinen herstellen kann, wird eine Liste der Referenzen angezeigt, wie folgt:

Output103902f5d448cf57425bd6830e544128d9522c51    HEAD
103902f5d448cf57425bd6830e544128d9522c51    refs/heads/master

Installieren Sie Hugo auf dem Produktionsserver

Zurück auf unserem * Produktionsserver * müssen wir Hugo installieren. Anstatt unsere Inhalte auf unserem Entwicklungsserver zu erstellen, erstellen wir die statischen Assets nach jedem "+ git push +" auf dem Produktionsserver. Dazu muss Hugo installiert sein.

Wir können Hugo mit der gleichen Methode installieren, die wir für unsere Entwicklungsmaschine verwendet haben. Überprüfen Sie zunächst die Architektur Ihres Produktionsservers:

uname -i

Besuchen Sie als Nächstes die Seite Hugo releases. Scrollen Sie zum Abschnitt "Downloads" für die neueste Hugo-Version. Klicken Sie mit der rechten Maustaste auf den Link, der Ihrer Architektur entspricht:

Wenn der Befehl "+ uname -i " " x86_64 " erzeugt hat, klicken Sie mit der rechten Maustaste und kopieren Sie den Link, der auf " amd64.deb +" endet
Wenn der Befehl "+ uname -i " " i686 " erzeugt hat, klicken Sie mit der rechten Maustaste und kopieren Sie den Link, der auf " i386.deb +" endet

Wechseln Sie auf Ihrem Produktionsserver in Ihr Ausgangsverzeichnis und laden Sie den kopierten Link mit + wget + herunter:

cd ~
wget https://github.com/spf13/hugo/releases/download/

Sobald der Download abgeschlossen ist, können Sie das Paket installieren, indem Sie Folgendes eingeben:

sudo dpkg -i hugo*.deb

Testen Sie, ob die Installation erfolgreich war, indem Sie Hugo nach der Versionsnummer fragen:

hugo version

Sie sollten eine Versionszeile sehen, die anzeigt, dass Hugo jetzt verfügbar ist:

OutputHugo Static Site Generator v0.14 BuildDate: 2015-05-25T21:29:16-04:00

Bevor wir weitermachen, müssen wir die Hugo-Designs auf unseren Produktionsserver klonen:

git clone --recursive https://github.com/spf13/hugoThemes ~/themes

Konfigurieren Sie Nginx für die Bereitstellung von Dateien, die während der Bereitstellung erstellt wurden

Als nächstes müssen wir unsere Nginx-Konfiguration etwas ändern.

Um die Bereitstellung zu vereinfachen, werden die generierten Inhalte nicht im Verzeichnis "+ var / www / html " abgelegt, sondern in einem Verzeichnis mit dem Namen " public_html +" im Ausgangsverzeichnis des Benutzers.

Erstellen wir jetzt das Verzeichnis "+ public_html +":

mkdir ~/public_html

Öffnen Sie als Nächstes die Standardkonfigurationsdatei für den Nginx-Serverblock, um die erforderlichen Anpassungen vorzunehmen:

sudo nano /etc/nginx/sites-available/default

Die einzigen Optionen, die geändert werden müssen, sind "+ Servername ", der auf den Domänennamen oder die IP-Adresse Ihres Produktionsservers verweist, und die Direktive " root ", die auf das soeben erstellte Verzeichnis " public_html +" verweist:

/ etc / nginx / sites-available / default

server {
       listen 80 default_server;
       listen [::]:80 default_server ipv6only=on;

       root ;
       index index.html index.htm;

       # Make site accessible from http://localhost/
       server_name ;

. . .

Stellen Sie sicher, dass Sie "Benutzername" in der Direktive "+ root +" durch Ihren tatsächlichen Benutzernamen auf dem Produktionsserver ersetzen. Speichern und schließen Sie die Datei, wenn Sie fertig sind.

Starten Sie den Nginx-Server neu, um Ihre Änderungen zu übernehmen:

sudo service nginx restart

Unser Webserver ist nun bereit, die Dateien bereitzustellen, die wir in das Verzeichnis + public_html + gestellt haben.

Erstellen Sie einen Post-Receive-Hook zum Bereitstellen der Hugo-Site

Jetzt können wir endlich Ihr "+ post-receive" -Bereitstellungs-Hook-Skript erstellen. Dieses Skript wird aufgerufen, wenn Sie neue Inhalte in den Produktionscode übertragen.

Um dieses Skript zu erstellen, werden wir in unserem Bare-Repository auf unserem Produktionsserver in ein Verzeichnis mit dem Namen "+ hooks +" wechseln. Verschiebe jetzt in dieses Verzeichnis:

cd ~//hooks

Dieses Verzeichnis enthält einige Beispielskripte, für dieses Handbuch benötigen wir jedoch ein "+ post-receive " - Skript. Erstellen und öffnen Sie eine Datei mit diesem Namen im Verzeichnis ` hooks +`:

nano post-receive

Nachdem wir oben in der Datei angegeben haben, dass es sich um ein Bash-Skript handelt, definieren wir zunächst einige Variablen. Wir setzen "+ GIT_REPO " auf unser nacktes Repository. Wir werden dies in ein temporäres Repository klonen, das durch die Variable " WORKING_DIRECTORY " angegeben wird, damit Hugo auf den Inhalt darin zugreifen kann, um die eigentliche Site zu erstellen. Da das Themes-Verzeichnis in unserem ` git +` Repo eigentlich nur ein symbolischer Link ist, der auf einen Speicherort im übergeordneten Verzeichnis verweist, müssen wir sicherstellen, dass der Klon des Arbeitsverzeichnisses am selben Speicherort wie die heruntergeladenen Hugo-Themes erstellt wird.

Der öffentliche Webordner wird durch die Variable "+ PUBLIC_WWW " angegeben, und ein Backup-Webordner wird durch die Variable " BACKUP_WWW " zugänglich gehalten. Schließlich setzen wir " MY_DOMAIN +" auf den Domainnamen oder die öffentliche IP-Adresse unseres Servers:

In diesem Sinne sollte der Anfang Ihrer Datei ungefähr so aussehen:

~ / my-website.git / hooks / post-receive

#!/bin/bash

GIT_REPO=$HOME/my-website.git
WORKING_DIRECTORY=$HOME/my-website-working
PUBLIC_WWW=$HOME/public_html
BACKUP_WWW=$HOME/backup_html
MY_DOMAIN=

Nachdem wir unsere Variablen gesetzt haben, können wir mit der Logik unseres Skripts beginnen. Zuerst verwenden wir den Befehl + set -e + von bash, um anzugeben, dass das Skript sofort beendet werden soll, wenn Fehler auftreten. Wir werden dies nutzen, um im Falle eines Problems in einem Moment aufzuräumen.

Stellen Sie anschließend sicher, dass unsere Umgebung für unsere Bereitstellung eingerichtet ist. Wir möchten jedes vorhandene Arbeitsverzeichnis entfernen, da wir während der Bereitstellung eine neue Kopie klonen möchten. Wir möchten auch unser Webverzeichnis sichern, damit wir es wiederherstellen können, wenn etwas schief geht. Wir verwenden hier "+ rsync ", weil es leere Verzeichnisse und Verzeichnisse mit Inhalten konsistenter behandelt als " cp ". Stellen Sie sicher, dass Sie das abschließende " / " nach " $ PUBLIC_WWW +" einfügen, damit der Befehl korrekt analysiert wird.

Ein letztes Setup-Verfahren, das wir durchführen werden, besteht darin, den Befehl "+ trap " so einzustellen, dass er bei Empfang eines "Exit" -Signals reagiert. Da wir den Befehl " set -e " eingefügt haben, wird ein Beendigungssignal immer dann ausgegeben, wenn ein Befehl in unserer Implementierung fehlschlägt. In diesem Fall stellen die von der Trap angegebenen Befehle unsere Sicherungskopie im Webverzeichnis wieder her und entfernen alle Instanzen des Arbeitsverzeichnisses " git +".

~ / my-website.git / hooks / post-receive

#!/bin/bash

GIT_REPO=$HOME/my-website.git
WORKING_DIRECTORY=$HOME/my-website-working
PUBLIC_WWW=$HOME/public_html
BACKUP_WWW=$HOME/backup_html
MY_DOMAIN=

set -e

rm -rf $WORKING_DIRECTORY
rsync -aqz $PUBLIC_WWW/ $BACKUP_WWW
trap "echo 'A problem occurred.  Reverting to backup.'; rsync -aqz --del $BACKUP_WWW/ $PUBLIC_WWW; rm -rf $WORKING_DIRECTORY" EXIT

Jetzt können wir mit der Bereitstellung beginnen. Wir werden einen regelmäßigen Klon unseres nackten Repos erstellen, damit Hugo auf die Repoinhalte zugreifen kann. Wir werden dann alle Inhalte aus dem öffentlichen Webverzeichnis entfernen, so dass nur frische Dateien im öffentlichen Webverzeichnis verfügbar sind. Anschließend werden wir Hugo verwenden, um unsere Website zu erstellen. Wir verweisen es auf unseren neuen Klon als Quellverzeichnis und weisen ihn an, generierten Inhalt im öffentlichen Webordner abzulegen. Wir übergeben ihm auch die Variable, die den Domainnamen oder die IP-Adresse unseres Produktionsservers enthält, damit er die Links korrekt aufbauen kann.

Nachdem Hugo den Inhalt erstellt hat, werden wir das Arbeitsverzeichnis entfernen. Wir werden dann den Befehl + trap + zurücksetzen, damit unsere Sicherungskopie unseren neuen Inhalt nicht sofort überschreibt, wenn das Skript versucht zu beenden:

~ / my-website.git / hooks / post-receive

#!/bin/bash

GIT_REPO=$HOME/my-website.git
WORKING_DIRECTORY=$HOME/my-website-working
PUBLIC_WWW=$HOME/public_html
BACKUP_WWW=$HOME/backup_html
MY_DOMAIN=

set -e

rm -rf $WORKING_DIRECTORY
rsync -aqz $PUBLIC_WWW/ $BACKUP_WWW
trap "echo 'A problem occurred.  Reverting to backup.'; rsync -aqz --del $BACKUP_WWW/ $PUBLIC_WWW; rm -rf $WORKING_DIRECTORY" EXIT

git clone $GIT_REPO $WORKING_DIRECTORY
rm -rf $PUBLIC_WWW/*
/usr/bin/hugo -s $WORKING_DIRECTORY -d $PUBLIC_WWW -b "http://${MY_DOMAIN}"
rm -rf $WORKING_DIRECTORY
trap - EXIT

Zu diesem Zeitpunkt ist unser Skript fertig. Speichern und schließen Sie die Datei, wenn Sie fertig sind.

Alles was wir jetzt tun müssen, ist das Skript ausführbar zu machen, damit + git + es zum richtigen Zeitpunkt aufrufen kann:

chmod +x post-receive

Unser Bereitstellungssystem ist jetzt abgeschlossen. Probieren wir es aus.

Testen Sie das Bereitstellungssystem

Nachdem wir unser System eingerichtet haben, können wir es testen.

Beginnen wir mit dem Testen Ihres Hook-Skripts "+ post-receive". Auf diese Weise können wir unser Verzeichnis "+ ~ / public_html +" mit einer ersten Kopie unseres Webinhalts füllen. Sie können auch überprüfen, ob die Hauptkomponenten des Skripts wie erwartet funktionieren:

bash ~//hooks/post-receive

Dies sollte Ihr Skript ausführen und die normalen "+ git +" - und Hugo-Meldungen auf dem Bildschirm ausgeben:

OutputCloning into '/home/justin/my-website-working'...
done.
0 draft content
0 future content
4 pages created
0 paginator pages created
0 tags created
1 categories created
in 26 ms

Wenn Sie den Domänennamen oder die IP-Adresse Ihres Produktionsservers in Ihrem Webbrowser aufrufen, sollte die aktuelle Version Ihrer Site angezeigt werden:

http://

image: https://assets.digitalocean.com/articles/hugo_deployment_1404/initial_site.png [Hugos anfänglicher Standortstatus]

Jetzt können wir zu der Maschine zurückkehren, die wir für die Hugo-Entwicklung verwenden. Erstellen wir auf diesem Computer einen neuen Beitrag:

hugo new post/Testing-Deployment.md

Fügen Sie in den neuen Beitrag einfach ein wenig Inhalt ein, damit wir unser System testen können:

~ / my-website / content / post / Testing-Deployment.md

+++
categories = ["misc"]
date = "2015-11-11T16:24:33-05:00"
title = "Testing Deployment"

+++

## A Test of the New Deployment System

I hope this works!

Fügen Sie nun den Inhalt zu "+ git +" hinzu und übernehmen Sie die Änderungen:

git add .
git commit -m 'Deployment test'

Wenn nun alles nach Plan verläuft, können wir unsere neuen Änderungen einfach per Push auf unserem Produktionsserver bereitstellen:

git push prod master

Wenn Sie jetzt Ihre Produktionsstätte in einem Webbrowser erneut besuchen, sollten Sie den neuen Inhalt sehen:

http://

image: https://assets.digitalocean.com/articles/hugo_deployment_1404/new_content.png [Hugo neuer Inhalt]

Unser Deployment-System scheint korrekt zu laufen.

Fazit

In diesem Handbuch haben wir einen separaten Produktionsserver eingerichtet, der den Besuchern unsere Webinhalte zur Verfügung stellt. Auf diesem Server haben wir mehrere Komponenten installiert und konfiguriert, damit Hugo unsere Inhalte korrekt erstellen und bereitstellen kann. Anschließend haben wir ein Bereitstellungsskript erstellt, das immer dann ausgelöst wird, wenn wir neue Inhalte von unserem Entwicklungscomputer auf den Server übertragen.

Die tatsächlichen Mechanismen in unserem Bereitstellungssystem sind eher grundlegend. Sie bilden jedoch die Grundlage eines einfach zu wartenden Systems, mit dem Sie Ihre lokalen Inhalte schnell und problemlos auf Ihren Webserver übertragen können. Da der Bereitstellungsprozess automatisiert ist, müssen Sie nicht mit Ihrem Server interagieren, um Änderungen vorzunehmen, die über ein einfaches "+ git push +" hinausgehen.

TOC

Bereitstellen einer Hugo-Site für die Produktion mit Git Hooks unter Ubuntu 14.04

Einführung

Voraussetzungen

Vorbereiten Ihres Entwicklungsservers

Konfigurieren Sie den SSH-Schlüsselzugriff auf den Produktionsserver

Übertragen Sie das anfängliche Git Repo auf den Production Server

Fügen Sie eine Git-Fernbedienung für den Produktionsserver hinzu

Einrichten des Produktionsservers

Installieren Sie Git, Pygments und Nginx auf dem Produktionsserver

Installieren Sie Hugo auf dem Produktionsserver

Konfigurieren Sie Nginx für die Bereitstellung von Dateien, die während der Bereitstellung erstellt wurden

Erstellen Sie einen Post-Receive-Hook zum Bereitstellen der Hugo-Site

Testen Sie das Bereitstellungssystem

Fazit

Related