So hosten Sie eine superschnelle Website kostenlos auf Netlify

Überlegen Sie, Ihre Jamstack-Site auf Netlify zu hosten, sind sich aber immer noch nicht sicher, wie Sie vorgehen sollen und worauf Sie achten müssen? Hier ist eine Kurzanleitung, die Ihnen hilft.

Marmeladenstapel Websites sind superschnell, weil sie statische Dateien bereitstellen. Sie verbrauchen insgesamt so wenig CPU- und Serverressourcen, dass Plattformen wie Netlify kostenloses und qualitativ hochwertiges Hosting anbieten können.

Netlify ist ein Cloud-Computing Umfeld. Aber im Gegensatz zu anderen Cloud-Plattformen wie AWS und Google Cloud ist Netlify einfach und benutzerfreundlich. Keine komplizierten Tutorials und keine langwierigen Setups.

Der Netlify-Dienst zielt darauf ab, Ihnen das Leben so einfach wie möglich zu machen, indem er das Beste aus verschiedenen Welten in einem Dienst vereint: Cloud Computing, das Marmeladenstapel, Git-Repositories und Freemium-Preise.

Netlify & The Jamstack

Netlify ist seit langem Teil der Jamstack-Bewegung und eine der frühesten und besten Plattformen, die zum Wachstum dieser modernen Webdesign-Methode beitragen.

Die Jamstack-Bewegung kombiniert JavaScript, APIs und Markup, um eine Front-End-Entwicklungsmethodik zu schaffen, die sich vom Backend trennt. Dies führt zu einer besseren Serverleistung, besser Sicherheitdienst, einfachere Skalierung und günstigere Betriebskosten.

GitHub bot beispielsweise zunächst Webhosting für Dateien an, die auf seiner Plattform gehostet werden, aber der Dienst hatte seine Grenzen. Dann brachte Netlify das Erstellen von Website-Code aus Repositories und das Hosten seiner statischen Varianten auf eine ganz neue Ebene. Und das hat eine völlig neue Branche mit vielen Vorteilen geschaffen.

Gründe für die Verwendung von Netlify

Netlify bedeutet so viele Dinge, weil es so viele Dinge tut. Durch die Kombination vieler Funktionen in einem einzigen Service und die weitgehende Automatisierung davon bietet die Plattform große Vorteile für Unternehmen jeder Größe.

Im Folgenden sind die wichtigsten Vorteile aufgeführt, die Sie von Netlify erhalten können:

  • Benutzerfreundlich – Netlify ist eines der am einfachsten zu verwendenden Cloud-Hosting-Plattformen dort draußen. Es besteht keine Notwendigkeit, lange und verwirrende Tutorials zu lesen. Es müssen keine komplizierten Einrichtungsschritte oder noch kompliziertere Wartungsroutinen befolgt werden. Netlify funktioniert einfach.

    Darüber hinaus bietet das System Elastic-Computing-Funktionen wie andere Cloud-Umgebungen. Dies garantiert, dass Ihre Website oder Ihr Dienst zu gegebener Zeit problemlos skaliert wird, um Verkehrsspitzen ohne die üblichen Backend-Engpässe zu bewältigen.
  • Inhaltsverteilungsnetzwerk – Als Teil seiner Einfachheit und Benutzerfreundlichkeit umfasst der Netlify-Dienst ein Inhaltsverteilungsnetzwerk namens Netlify Edge. Es stellt Ihre Webseiten an mehreren Standorten bereit, um sie Besuchern in der Nähe so schnell wie möglich bereitzustellen.

    Das Tolle an diesem Service ist, dass Sie keine Einstellungen anpassen und konfigurieren müssen, um die besten Ergebnisse zu erzielen. Sobald Sie Ihre Website bereitgestellt haben, aktualisieren Sie alle Ihre Webressourcen und Ihren Code auf einmal. Alle Caches werden sofort ungültig gemacht und weltweit aktualisiert. Und Sie können Ihre Website auch einfach und sofort auf frühere Builds zurücksetzen.

    Netlify verwaltet das meiste davon automatisch für Sie. Der einzige Unterschied besteht in der Anzahl der Dienste und Edge-Standorte, die Sie erhalten, da der kostenlose Plan einige Einschränkungen hat.
  • Freier Plan – Netlify ist ein Freemium Software-as-a-Service Plattform. Aber im Gegensatz zu anderen Cloud-Computing-Plattformen ist das kostenlose Konto völlig kostenlos. Es ist keine Kreditkarte erforderlich.

    Dennoch enthält dieser kostenlose Plan viele beeindruckende Funktionen. Wie automatisierte Git-Builds, Edge-Netzwerk Bereitstellungen, sofortiges Rollback auf frühere Versionen, Live-Vorschauen vor der Bereitstellung und kostenlose serverlose Funktionen.
  • Automatisierte Builds – Sie erhalten Netlify Build auch kostenlos. Dieses CI/CD (Continuous Integration/Continuous Deployment) erleichtert die Verwaltung Ihrer Site-Entwicklungen und -Erweiterungen. Es wird jedes Mal automatisch aus Ihrem Repository neu erstellt, wenn Sie neue Updates auf Ihr Git-Konto übertragen.

    Alles ist vollständig automatisiert und Vorschauen sind verfügbar, damit Sie wissen, was Sie bereitstellen werden. Sie können auch jeden Schritt des Prozesses konfigurieren und Rollbacks zu früheren Builds sind mühelos möglich.
  • Netlify-Funktionen – Jede Site, die Sie auf der Netlify-Plattform bereitstellen, bietet Zugriff auf serverlose Funktionen, die Sie für viele Dinge verwenden können. Diese Netlify-Funktionen sind serverseitige Prozesse, die auf JavaScript-Code ausgeführt werden.

    Jede Site erhält 125 Aufrufe kostenlos und Sie müssen nur bezahlen, wenn Sie dieses Kontingent überschreiten. Sie können die Funktionen zum Umgang mit Bildern, zum Senden von E-Mails, zum Validieren von Benutzereingaben und sogar zum Abrufen von Daten von anderen API-Endpunkten verwenden.
  • Automatische Formulare – Netlify erleichtert die Integration von Formularen in Ihr statische Seite und erfassen Sie alle Einsendungen ohne umfangreiche Codierung oder andere stressige Probleme. Fügen Sie einfach das Attribut „netlify“ zu einem Ihrer Formulare hinzu … und das ist es.

    Anschließend können Sie alle Einreichungen in Ihrem Dashboard anzeigen, wobei die Formulare sorgfältig nach Namen sortiert sind. Das System verfügt über eine Anti-Spam-Funktion und Netlify kann Sie darüber hinaus benachrichtigen E-Mail, Slack oder Webhooks, sobald eine Übermittlung vorliegt.

    Weitere Optionen sind die Weiterleitung der eingereichten Formulare an über 1,000 Anwendungen mit der Zapier-Integration von Netlify.
  • NetlifyCMS – Die NetlifyCMS-App ist ein praktischer Editor für jede statische Website, die auf der Netlify-Plattform über einen Git-Anbieter wie GitHub gehostet wird. Es nimmt alle Ihre Daten aus dem Repository und erstellt eine einfach zu bedienende Verwaltungsoberfläche.

    NetlifyCMS ist eine einseitige React-App, die von einer Community aus über 100 Mitwirkenden entwickelt wurde. Es ist redaktionsfreundlich, bietet einen intuitiven Workflow, ist völlig kostenlos und macht die Verwaltung von Jamstack-Sites zum Vergnügen.
  • Kostenloses HTTPS – Alle Netlify-Hosting-Konten enthalten kostenloses HTTPS. Das sind kostenlose SSL-Zertifikate (Secure Socket Layer).

Konten & Preise

Netlify ist ein Freemium-Softwaredienst. Es gibt einen völlig kostenlosen Starter-Plan, einen Pro-Plan für 19 $ pro Mitglied und Monat, einen Business-Plan für 99 $ pro Mitglied und Monat und einen Enterprise-Plan mit benutzerdefinierten Preisen.

Das Beeindruckende an Netlify ist, dass Sie mit dem kostenlosen Starter-Plan viel erledigen können. Der Starter-Plan wurde für persönliche Projekte, Experimente, Hobbyseiten und andere Abenteuer entwickelt und umfasst automatisierte Builds mit 300 kostenlosen Build-Minuten pro Monat.

Es umfasst auch globale Edge-Bereitstellungen, sofortige Rollbacks, das NetlifyCMS, serverlose Funktionen, 100 GB Bandbreite pro Monat und bis zu 100 kostenlose Formularübermittlungen pro Website und Monat. Außerdem können Sie im Starter-Plan eine unbegrenzte Anzahl von Websites hosten.

Der Pro-Plan fügt weitere Funktionen wie passwortgeschützte Websites, Hintergrundfunktionen, mehr Build-Minuten und Bandbreite und vieles mehr hinzu. Diese zusätzlichen Funktionen nehmen zu, wenn Sie sich den höheren Plänen nähern.

So hosten Sie eine Website kostenlos auf Netlify

Netlify schlägt andere Cloud-Computing- und Hosting-Unternehmen wie AWS, Google Cloud und Azure in Sachen Einfachheit. Ja, sie haben mehr Infrastruktur, leistungsfähigere Maschinen und Rechenzentren auf der ganzen Welt, aber ihre Einrichtung kann langweilig sein.

Hier ist ein schrittweiser Einrichtungsprozess, der Ihnen zeigt, wie einfach es ist, eine Jamstack-Site auf Netlify zu hosten.

1. Registrieren und anmelden

Netlify-Anmeldung

Ihr erster Schritt ist die Navigation zu app.netlify.com und melden Sie sich an, falls Sie dies noch nicht getan haben. Sie werden mit fünf verschiedenen Anmeldemethoden begrüßt, von GitHub zu Gitlab, Bit Bucket, E-Mail und SSO.

Nach der Anmeldung müssen Sie sich auch bei Ihrem E-Mail-Konto anmelden, um die Bestätigungsmail von Netlify zu finden. Klicken Sie darauf, um Ihr Konto zu verifizieren und sich beim System anzumelden.

2. Fügen Sie eine neue Site hinzu

Das Laden der App dauert einige Sekunden. Dann wird Ihnen ein kurzer Fragebogen vorgelegt, der Dinge wie den Namen Ihres Teams und so weiter enthält. Einfach alles ehrlich ausfüllen. Aber denken Sie daran, dass der kostenlose Plan nur ein Mitglied beinhaltet – Sie.

Sobald Sie diese Phase durchlaufen haben, befinden Sie sich im Standard-Dashboard. Klicken Sie auf „Neue Site von Git“, um eine neue Site zu hosten. Oder Sie können auch einen Ordner mit Ihren statischen Dateien per Drag & Drop in den markierten Bereich auf dem Armaturenbrett ziehen und Netlify erledigt den Rest.

3. GitHub verknüpfen

Der Klick auf die Schaltfläche aus Schritt 2 oben öffnet ein neues Fenster, in dem Sie aufgefordert werden, Ihre neue Website mit GitHub oder einem anderen Git-Repository wie GitLab und Bitbucket zu verknüpfen. Stellen Sie an dieser Stelle sicher, dass Sie über ein registriertes Git-Konto verfügen und dass sich die Dateien Ihrer Website bereits in einem Repository befinden.

4. Autorisieren Sie Netlify

Jetzt müssen Sie GitHub nur noch sagen, dass Netlify auf Ihr GitHub-Konto zugreifen darf, und alles ist erledigt.

5. Wählen Sie Ihr Repository aus

Jede Standard-Netlify-Site ist mit einem einzigen Repository verknüpft. Wählen Sie diejenige aus, die Sie verwenden möchten, und fahren Sie fort.

6. Konfigurieren Sie Build-Einstellungen

Sie müssen dieser Seite ein wenig Aufmerksamkeit schenken. Wenn Sie bereits statische Sites haben und keine Präprozessoren verwenden, können Sie das Veröffentlichungsverzeichnis auf „/“ setzen. Und lassen Sie das Build-Befehlsfeld leer.

Wenn Sie hingegen einen statischen Site-Generator wie Gatsby oder Next verwenden, hängt das, was Sie hier eingeben, vom Generator ab. Sie können sich diese Liste ansehen gemeinsame Konfigurationen, um zu wissen, was Sie eingeben müssen.

7. Erstellen und Bereitstellen

Sobald alles eingestellt ist, klicken Sie auf „Site bereitstellen“ und Netlify führt alle erforderlichen Builds aus und erstellt Ihre glänzende neue Website. Haben Sie einfach ein wenig Geduld.

8. Richten Sie den Domänennamen ein

Nachdem Sie Ihre Site erstellt und bereitgestellt haben, gibt Netlify ihr einen Namen in der Domäne *.netlify.app. Sie können diesen Namen später in etwas Schöneres ändern oder sogar eine benutzerdefinierte Domain an die Site anhängen.

Mit Netlify können Sie eine benutzerdefinierte Domain anhängen, die Sie woanders gekauft haben, oder die Domain über Ihr Netlify-Dashboard kaufen. Und das System kümmert sich um alles. Klicken Sie einfach auf die Registerkarte Domains in Ihrem Dashboard, um eine neue Domain für Ihre neue Website hinzuzufügen oder zu registrieren.

Netlify 3

Fazit

Wir haben das Ende dieser einfachen Anleitung zum kostenlosen Hosten einer superschnellen Website auf der Netlify-Plattform erreicht. Und Sie haben die Gründe und den Weg dazu gesehen.

Es bleibt Ihnen nun überlassen, Ihre statische Site entweder von Hand zu codieren oder einen statischen Site-Generator zu verwenden.

Nnamdi Okeke

Nnamdi Okeke

Nnamdi Okeke ist ein Computer-Enthusiast, der es liebt, eine große Auswahl an Büchern zu lesen. Er hat eine Vorliebe für Linux gegenüber Windows/Mac und verwendet
Ubuntu seit seinen Anfängen. Sie können ihn auf Twitter über sehen Bongotrax

Artikel: 285

Erhalten Sie Technikfreaks

Tech-Trends, Startup-Trends, Rezensionen, Online-Einkommen, Web-Tools und Marketing ein- oder zweimal monatlich