Heroku Deploy - So pushen Sie eine Web-App oder Site in die Produktion

Bei der Bereitstellung einer Anwendung gibt es normalerweise zwei Optionen: einen VPS oder einen PaaS (Platform as a Service). Dieser Artikel zeigt Ihnen ein Rezept für die Bereitstellung einer Anwendung für die Produktion auf einem PaaS wie Heroku.

Schritt 1 - Erstellen Sie das Projekt

Der erste Schritt besteht darin, eine einfache Struktur für unser Projekt mit einigen Basisdateien zu erstellen. Für diesen Artikel werde ich einen Demo-Server mit NodeJS erstellen.

In einem neuen Ordner öffne ich ein Terminal und führe den Befehl npm init -yaus, um ein neues Projekt zu erstellen. Der Dummy-Server wird in Express geschrieben, daher müssen wir den npm install expressBefehl ausführen , um dieses Modul zu installieren.

Sobald diese Bibliothek installiert ist, können wir eine neue Datei mit dem Namen für unser Projekt erstellen app.js. Darin schreiben wir den Code für unseren einfachen Server:

Wir können die Anwendung starten, indem wir sie ausführen node app.js. Dann können wir es unter der folgenden URL ausprobieren //localhost:3000. Zu diesem Zeitpunkt sollte die Meldung Hello Worldim Browser angezeigt werden.

Schritt 2 - Versionskontrollsystem

Der nächste Schritt besteht darin, ein Versionskontrollsystem auszuwählen und unseren Code in einer Entwicklungsplattform in einem Repository zu platzieren.

Das beliebteste Versionskontrollsystem ist Git zusammen mit Github als Entwicklungsplattform. Deshalb werden wir das hier verwenden.

Erstellen Sie auf GitHub ein neues Repository für Ihre Anwendung, wie folgt:

Um Ihren lokalen Code in ein Repository hochzuladen, müssen Sie die auf Github aufgelisteten Befehle ausführen, nachdem Sie auf die Create repositorySchaltfläche geklickt haben :

! Bevor wir dies tun, müssen wir einige Dateien ignorieren. Wir möchten nur den Code, den wir schreiben, ohne die Abhängigkeiten (die installierten Module) in das Repository hochladen.

Dazu müssen wir eine neue Datei erstellen .gitignoreund darin die Datei schreiben, die wir ignorieren möchten.

Jetzt können wir die im obigen Bild aufgeführten Befehle schreiben (den von GitHub).

Wenn Sie die Befehle korrekt ausgeführt haben, befindet sie sich auf der Seite Ihres Repositorys. Wenn Sie es aktualisieren, sollten Sie Ihre Dateien sehen, mit Ausnahme derjenigen, die Sie explizit ignoriert haben, nämlich node_modules.

Schritt 3 - Verknüpfen Sie das Repository mit Heroku

In diesem Schritt können wir das Repository von Github mit unserer Heroku-Anwendung verknüpfen.

Erstellen Sie zunächst eine neue Anwendung auf Heroku und befolgen Sie die auf der Plattform aufgeführten Schritte.

Sobald die Anwendung erstellt wurde, sollte ein ähnliches Fenster angezeigt werden:

Nun, wenn Sie in der Navigation oben schauen, sehen Sie   Overview, Resources, Deploy, Metrics  und so weiter. Stellen Sie sicher, dass Deployausgewählt ist. Klicken Sie dann in der zweiten Zeile auf das GitHub-Symbol.

Suchen Sie nach der gewünschten Anwendung, demo-deploy-app-09in unserem Fall. Klicken Sie dann auf Connect.

Sobald die Anwendung erfolgreich mit Ihrem Heroku-Konto verbunden wurde, können Sie klicken Deploy Branch, um Ihre Anwendung bereitzustellen.

Wenn Sie möchten, können Sie auch die Option auswählen, mit der Enable Automatic Deploysder Code bei jedem Push in dieses Repository automatisch aus Ihrem Github-Repository abgerufen wird.

Sobald die Anwendung bereitgestellt wurde, können Sie auf Anzeigen klicken, um Ihre Anwendung zu öffnen.

Schritt 4 - Konfigurieren Sie Heroku so, dass die Anwendung ordnungsgemäß ausgeführt wird

Wenn Sie die Anwendung an dieser Stelle öffnen, sollte Folgendes angezeigt werden:

Das stimmt, ein Fehler. Das liegt daran, dass Heroku nicht weiß, wie er unsere Anwendung starten soll.

Wenn Sie sich erinnern, haben wir den Befehl ausgeführt node app.js, um die Anwendung lokal zu starten.

Heroku kann nicht wissen, welche Befehle zum Starten der Anwendung ausgeführt werden müssen, und deshalb wurde ein Fehler ausgegeben.

Um dieses Problem zu lösen, müssen wir eine neue Datei Procfilemit dem folgenden Inhalt erstellen : web: node ./app.js.

Um unsere Anwendung zu aktualisieren, müssen wir lediglich ein neues Commit für GitHub senden. Wenn wir die Automatic DeploysOption aktiviert haben , wird der Code automatisch zu Heroku gezogen. Andernfalls müssen wir Deploy Brancherneut klicken .

Sobald die Anwendung neu erstellt wurde, sollte sie folgendermaßen funktionieren:

Schritt 5 - Hinzufügen eines Add-Ons

Ein wesentlicher Vorteil von Heroku ist die Tatsache, dass Sie add-onsIhrem Projekt problemlos Ressourcen in Form von hinzufügen können . Diese externen Ressourcen werden in Form von Datenbanken, Protokollierungs- und Überwachungstools, CI- und CD-Tools oder Testtools bereitgestellt.

Nun wollen wir sehen, wie Sie Ihrem Projekt eine neue Ressource hinzufügen. Zuerst gehen wir zu Ressourcen und fügen von dort ein neues Tool zum Testen hinzu.

Gehen Sie voran und klicken Sie auf Find more add-onsund suchen Sie dann nach Loadmill.

Loadmill ist ein Testwerkzeug, das sich hervorragend für Regressionstests und Lasttests eignet.

Gehen Sie voran und klicken Sie auf Install…. Wählen Sie dann die Anwendung aus, die Sie verknüpfen möchten.

In diesem Schritt erstellt Heroku automatisch ein neues Konto für Sie auf der bereitgestellten Plattform.

Auf der Registerkarte Ressourcen sehen Sie die neu hinzugefügte Ressource:

Wenn Sie auf dieses Add-On zugreifen, sollte das Dashboard mit einem Intro-Tutorial und einem für Sie erstellten Demo-Test angezeigt werden.

Fazit

Mit Heroku können Entwickler eine Anwendung schnell und nahezu problemlos auf einem Webserver bereitstellen.

Es bietet auch viele Plugins, die Sie in Ihre Anwendung integrieren können.

Mit einer PaaS-Lösung können Sie sich immer schneller bewegen als mit einem VPS, bei dem Sie alles von Grund auf neu konfigurieren müssen.