Custom Domain Handling with Vercel
Author Cloudapp
E.G.

Eigene Domain in Vercel (GUI & CLI) für Nextjs Projekt verwenden

13. Mai 2024
Inhaltsverzeichnis

Es kommt der Zeitpunkt, an dem Ihr Vercel-Projekt ausgereift ist und Sie die Standarddomain/URL xxx.vercel.app, die Ihrem Projekt nach einem erfolgreichen Build automatisch zugewiesen wird, loswerden möchten.

Das Hinzufügen Ihrer Domain ist der letzte Schritt vor der Produktionsfreigabe Ihres Projekts. Wenn Sie noch keine eigene Domain haben, kann ich Ihnen diese drei Domain-Registrierungsdienste empfehlen:

  1. Google Domains (benutzt Squarespace.com als Registrar)

  2. Namecheap.com

  3. Godaddy.com

Ich schätze, es gibt noch tausend andere Firmen für die Domainregistrierung auf dem Markt, aber ich kann diese drei empfehlen, weil ich sie bereits in meinem Projekt verwendet habe und die Integration reibungslos verlief.

Google Domains

Öffnen Sie domains.google.com und wählen Sie auf der linken Seite „Meine Domains“, um alle Ihrem Konto zugewiesenen Domains anzuzeigen.

Google-Domains
Google-Domains

If you click on the name of one of your domains, you will see the details, and you can change the DNS settings.

Google-Domains-Records
Google-Domains-Records

Vercel GUI

Beginnen wir nun mit der Einrichtung in unserem Vercel-Konto. Als ersten Schritt wählen wir unser Projekt, dann „Einstellungen“ und „Domains“.

vercel settings
vercel settings

Geben Sie Ihren Domainnamen in das Eingabefeld ein, in dem der Platzhalter „mywebsite.com“ steht, und klicken Sie auf „Hinzufügen“.

Vercel erstellt die erforderlichen DNS-Einträge für die Root-Domain (example.com) und die ausgewählte Subdomain (www.example.com) und zeigt Ihnen die DNS-Einstellungen an, die Sie in Ihrem DNS vornehmen müssen (in diesem Beispiel haben wir Google Domains/DNS verwendet).

Übersetzt mit DeepL.com (kostenlose Version)

vercel dns records
vercel dns records

Legen Sie also bitte den A-Eintrag und den C-Namen in Ihrem DNS an (Zweiter Screenshot, Punkt 2 -> Benutzerdefinierte Einträge verwalten). Einige Minuten später werden Sie sehen, dass Vercel die neuen DNS-Einstellungen kennt und mit der Erstellung der benötigten SSL-Zertifikate beginnen wird.

Jetzt haben Sie Ihre benutzerdefinierte Domain mit Ihrem Vercel-Projekt verknüpft.

Wenn Sie auf die Schaltfläche „Bearbeiten“ in der oberen rechten Ecke klicken, können Sie die Einstellungen konfigurieren. Sie können die „Weiterleitung“, den verwendeten Statuscode und den zugewiesenen Git-Zweig konfigurieren. So können Sie Ihre Subdomain für den Entwicklungszweig einrichten.

Vercel DNS Git Branch
Vercel DNS Git Branch

Vercel CLI

Alternativ können Sie auch die Vercel CLI verwenden, um Ihre Domains zu verwalten, Domains Projekten zuzuordnen usw. Das ist sehr praktisch, und es hängt davon ab, was Sie bevorzugen.

Vercel hat eine großartige Dokumentation -> https://vercel.com/docs/cli/domains

Alle Domains auflisten

Domain zu Projekt hinzufügen

Domain aus Projekt löschen

Cloudapp-dev und bevor Sie uns verlassen

Danke, dass Sie bis zum Ende gelesen haben. Noch eine Bitte bevor Sie gehen:

  • Wenn Ihnen gefallen hat was Sie gelesen haben oder wenn es Ihnen sogar geholfen hat, dann würden wir uns über einen "Clap" 👏 oder einen neuen Follower auf unseren Medium Account sehr freuen.

Verwandte Artikel