Erfassen Sie Ihre Fortschritte
Trailhead-Startseite
Trailhead-Startseite

Erstellen einer Heroku Pipeline und Ausführen von Review Apps

Lernziele

Nachdem Sie diese Lektion abgeschlossen haben, sind Sie in der Lage, die folgenden Aufgaben auszuführen:

  • Erstellen einer Heroku Pipeline und Hinzufügen Ihrer Anwendungen
  • Ausführen von Review Apps

Jetzt, da Sie mit den Funktionen von Heroku Flow und den Konzepten dahinter vertraut sind, sollten Sie dieses Wissen nutzen und eine Instanz von Heroku-Pipelines erstellen, Review Apps ausführen und überprüfen, wie die Dinge tatsächlich funktionieren.

Zum Erstellen einer Heroku-Pipeline benötigen Sie ein Heroku-Konto. Registrieren Sie sich kostenlos, wenn Sie noch kein Konto bei https://www.heroku.com/ haben. Für dieses Modul benötigen Sie auch ein GitHub-Konto. Unter https://github.com/ können Sie ein Konto kostenlos erstellen.  

Erstellen einer Pipeline:

Jetzt können Sie Ihre erste Pipeline erstellen.

  1. Melden Sie sich bei Ihrem GitHub-Konto an und erstellen Sie Ihre eigene Kopie dieses Repositorys, indem Sie rechts oben auf Fork klicken. Befehl 'Fork' für das Repository 'flow-demo'
  2. Kehren Sie zu Heroku zurück und klicken Sie auf Login. Klicken Sie nach der Anmeldung auf New und anschließend auf Create new pipeline. Erstellen einer neuen Pipeline
  3. Geben Sie Ihrer neuen Pipeline einen Namen (z. B. flow-demo-pipeline), belassen Sie Ihren Namen im Feld "Pipeline Owner", verbinden Sie sie mit dem in Schritt 1 abgezweigten Repository und klicken Sie auf Create Pipeline. Benennen Ihrer Pipeline

Ausführen von Review Apps:

Nun, da Sie eine Pipeline haben, lassen Sie uns Anwendungen erstellen, damit Sie eine Review App anlegen können (Review Apps funktionieren nur, wenn sich mindestens eine Anwendung in der Pipeline befindet):

  1. Um eine neue Anwendung zu erstellen, klicken Sie unter "Staging" auf Add app... und dann Create new app. Geben Sie Ihrer Anwendung einen Namen (z. B. flow-staging-demoapp) und klicken Sie auf Create app. Erstellen einer neuen Anwendung
  2. Erstellen Sie als Nächstes mit den gleichen Schritten eine Produktionsanwendung. Klicken Sie unter "Production" auf Create new app und geben Sie ihr einen Namen (z. B. flow-production-demoapp).
  3. Sobald Sie eine Staging-Anwendung erstellt haben, wird die Option Enable Review Apps verfügbar. Klicken Sie in der Spalte "Review Apps" auf Enable Review Apps und aktivieren Sie Create new review apps for new pull requests automatically. Dadurch wird für jede Pull Request, die Sie im zugehörigen GitHub Repository erstellen, eine Review App erstellt. Wenn Sie vorhaben, diese Pipeline nur für dieses Modul und Testzwecke zu verwenden, wählen Sie Destroy stale review apps automatically. Klicken Sie dann auf Enable.
    Aktivieren von Review Apps
  4. Klicken Sie auf die kleinen Pfeile neben Ihrer Staging-Anwendung und dann auf Configure automatic deploys. Belassen Sie den Branch auf "master" und klicken Sie auf Enable Automatic Deploys.
    Konfigurieren automatischer Bereitstellungen
  5. Jetzt werden wir einige Änderungen an Ihrem GitHub-Repository vornehmen und prüfen, wie diese sich in Ihrer Heroku-Pipeline widerspiegeln.
  6. Wechseln Sie auf GitHub zum Repository "flow-demo repository", das Sie zuvor über den Befehl "Fork" abgezweigt haben. Klicken Sie auf den Ordner Public, um ihn zu öffnen, und dann auf die Datei index.html.
  7. Klicken Sie rechts oben auf das kleine Bleistiftsymbol, um "index.html" zu bearbeiten.
  8. Lassen Sie uns nun einige kleine Änderungen an der Text- und Schriftfarbe vornehmen. Wir halten es einfach, da Sie gerade erst begonnen haben, sich mit Heroku Flow vertraut zu machen: Ändern Sie die Farbe "h2" von blue in green und den Text der Klasse "p" von Running with Heroku Flow in Built with Heroku.
    Ändern des Codes auf GitHub
  9. Scrollen Sie nun nach unten und geben Sie einen kurzen Commit-Titel und eine Kurzbeschreibung ein. Wählen Sie dann Create a new branch for this commit and start a pull request aus. Übernehmen Sie für den Branch-Namen die Standardeinstellung und klicken Sie auf Propose file change. Erstellen eines Branchs und Commits
  10. Auf der nächsten Seite können Sie die vorgenommenen Änderungen überprüfen. Klicken Sie auf Create Pull Request.
  11. Kehren Sie zu Ihrem Heroku Dashboard zurück. Sie finden in der Spalte "Review Apps" eine neue Review App vor. Um zu prüfen, wie die von Ihnen vorgenommenen Änderungen in einem Browserfenster aussehen, klicken Sie auf die kleinen Pfeile neben der Review App und dann auf Open app in browser. Öffnen der Review App im Browser

Bereitstellen in der Produktion:

Sie können erkennen, dass die Review App die Änderungen widerspiegelt, die Sie gerade am Code auf GitHub vorgenommen haben. Herzlichen Glückwunsch zur ersten Heroku Pipeline und Review App. Wir können nun mit dem Zusammenführen von Änderungen zurück in den Master-Branch fortfahren.

  1. Wechseln Sie zu GitHub und wählen Sie die Registerkarte Pull Requests aus. Ihre Pull Request Update index.html sollte als offene Pull Request angezeigt werden. Überprüfen der Pull Request auf GitHub
  2. Klicken Sie darauf, um die Pull-Request-Details anzuzeigen. Klicken Sie dann auf Merge pull request und anschließend auf Confirm merge.
  3. Kehren Sie zu Ihrem Heroku Dashboard zurück. Sie sehen, dass Ihre Anwendung unter "Staging" erstellt wird. Diese Bereitstellung erfolgt automatisch beim Zusammenführen von Änderungen zurück im Master-Branch, da Sie zuvor automatische Bereitstellungen aktiviert haben. Staging-Anwendung wird erstellt
  4. Wenn Sie neben Ihrer "flow-staging-demoapp" den Befehl Open app in browser auswählen, sehen Sie die Farbe Grün und den in Built with Heroku geänderten Text. Staging-Umgebungen sind Klone von Produktionsumgebungen, in denen alle Codeänderungen getestet werden, bevor sie in die Produktion überführt und Teil des Endprodukts werden. Da die Staging-Anwendung genauso aussieht wie die Review App, gibt es keine Probleme. Wir können sie per Push in die letzte Produktionsphase überführen.
  5. Klicken Sie auf Promote to production, um Codeänderungen nun per Push in die Produktion zu übertragen. Überprüfen Sie nochmals den Namen der Produktionsanwendung und klicken Sie auf Promote. In Produktion überführen
  6. Beachten Sie, dass die Bereitstellung der App in der Produktion beginnt. Produktionsanwendung wird erstellt
  7. Klicken Sie neben Ihrer "flow-production-demoapp" auf Open app in browser. Sie können feststellen, dass Ihre Codeänderungen den Weg in Ihre endgültige Anwendung in der Produktion gefunden haben.