In diesem Beitrag erstellen wir eine persönliche Website mit Schienen und stellen sie für Heroku bereit. Heroku ist eine Cloud-Anwendungsplattform - eine neue Methode zum Erstellen und Bereitstellen von Webanwendungen. Das Beste an Heroku ist, dass Sie nicht für das Hosten grundlegender Web-Apps bezahlen müssen, da Heroku sie als kostenlos eingestuft hat. Wir werden eine Single-Page-Rails-Anwendung erstellen und es wird eine statische Website sein, die als Portfolio verwendet werden kann.
Unten sehen Sie den Schnappschuss der Rails-Anwendung (bereitgestellt auf Heroku Hier )
Beginnen wir mit der Erstellung dieser Rails-Anwendung. Ich gehe davon aus, dass Sie Ruby und Rails bereits installiert haben. Stellen Sie sicher, dass Sie Ruby 2.0 und Rails 4.2.2 haben. Sie können die Version an der Eingabeaufforderung überprüfen.
Hinweis: Wir werden Ruby 2.0 und Rails 4.2.2 verwenden. Wenn Sie verschiedene Versionen von Ruby und Rails haben, funktionieren einige der in diesem Beitrag gezeigten Schritte möglicherweise nicht für Sie.
Projekt erstellen:
Wir werden unser Projekt als Website benennen. Verwenden Sie zum Erstellen des Projekts den Befehl Rails new website
Rails generiert automatisch alle Dateien und installiert alle erforderlichen Edelsteine, indem das automatisch installierte Run-Bundle wie unten gezeigt ausgeführt wird
Jetzt sehen Sie einen Website-Ordner unter Ihrem Laufwerk C: (den Speicherort, von dem aus wir den Befehl Rails new website ausgeführt haben). Öffnen wir den Website-Ordner in einer IDE. Ich habe Brackets IDE von Adobe. Sie können jede andere verwenden, da dies keine Rolle spielt.
Projektstruktur:
Die generierte Projektstruktur sieht wie folgt aus
Obwohl wir noch keinen Code geschrieben haben, können Sie die Website-Anwendung jetzt ausführen. Führen Sie zum Ausführen der Website-Anwendung den Befehl Rails im Website-Ordner aus (siehe Abbildung unten)
Wie Sie im obigen Schnappschuss sehen können, wurde unsere Website-App unter bereitgestellthttp: // localhost: 3000
Beim Zugriff auf die URL wird der folgende Bildschirm angezeigthttp: // localhost: 3000
Wir möchten jedoch unsere Anwendungshauptseite beim Zugriff auf die URL anzeigenhttp: // localhost: 3000 /.Dazu erstellen wir eine index.html-Seite im öffentlichen Ordner unseres Website-Projekts.
Hinweis: Rails wird beim Zugriff auf die Stamm-URL automatisch die Seite index.html bereitstellenhttp: // localhost: 3000
Derzeit haben wir nur eine Zeile in der index.html-Seite.
Lassen Sie uns auf die Root-URL zugreifenhttp: // localhost: 3000
Lassen Sie uns nun unserer index.html-Seite etwas Leben einhauchen, indem wir einige Bilder hinzufügen - JS und cooles CSS. Wir werden das Graustufenthema vom Start-Bootstrap an verwenden.
Graustufen Start Bootstrap Theme - -
Unten finden Sie die Momentaufnahme des Graustufen-Start-Bootstrap-Themas, das wir verwenden werden. Wir werden dieses Thema an unsere Anforderungen anpassen.
Sie können dieses Thema von herunterladen http://startbootstrap.com/template-overviews/grayscale/
Laden Sie das Graustufenthema herunter und kopieren Sie CSS, font-awesome, fonts, img, JS und index.html in das öffentliche Verzeichnis des Website-Projekts. Unten finden Sie den Projekt-Snapshot nach dem Hinzufügen von CSS, JS, Schriftarten, Bilderordner und index.html-Seite im öffentlichen Verzeichnis des Website-Projekts.
Lassen Sie uns jetzt unser Website-Projekt ausführen:
Beim Ausführen des Projekts wird eine gut aussehende Graustufen-Themenseite angezeigt.
Binär-Dezimal-Konverter Java
Wir werden die index.html-Seite (im öffentlichen Verzeichnis des Website-Projekts) ändern, um ihr ein professionelles Aussehen zu verleihen.
Unten sehen Sie den Schnappschuss des Website-Projekts, nachdem Sie die Änderungen auf der Seite index.html vorgenommen haben. Wir haben gerade die Bilder geändert und einen Teil des Textes bearbeitet, um ihn individuell zu gestalten.
Sie können die Datei index.html und grayscale.CSS nach Ihren Wünschen ändern. Jetzt können wir unsere Website-Anwendung für Heroku bereitstellen.
Den Code an Github senden:
Bevor wir die Anwendung auf Heroku bereitstellen, müssen wir unseren Code in ein entferntes Github-Repository übertragen. Dafür benötigen Sie einen Github-Account. Wenn Sie kein Github-Konto haben, erstellen Sie eines unter www.github.com .
Sie müssen Github auch unter Windows installieren. Laden Sie den Github für Windows von herunter https://windows.github.com/ .
Nachdem Sie den Github heruntergeladen und auf Ihrem Computer installiert haben, öffnen Sie die Github-Anwendung und konfigurieren Sie Ihre Github-Anmeldeinformationen. Wählen Sie die Git Bash-Shell als Standard-Shell (Sie können auch eine beliebige andere Option auswählen) und speichern Sie die Änderungen.
Sie müssen ein Repository auf Github erstellen, in dem wir unser Website-Projekt remote speichern. Um ein Repository zu erstellen, melden Sie sich bei Github an und klicken Sie auf die neue Repository-Option, die auf der grünen Schaltfläche angezeigt wird.
Benennen Sie Ihr Repository (in diesem Fall haben wir es railtoheroku genannt) und klicken Sie wie unten gezeigt auf den Link Repository erstellen.
Github wird die Remote-URL bereitstellen ( https://github.com/eMahtab/railtoheroku.git in diesem Fall) für das railtoheroku-Repository, das benötigt wird, wenn der Code vom lokalen Computer an Github übertragen wird.
Jetzt können wir unseren Website-Projektcode an Github senden. Führen Sie die folgenden Schritte aus, um den Code an Github zu senden.
Öffnen Sie die Git-Shell und initialisieren Sie das Website-Verzeichnis mit dem Befehl Git init wie folgt:
Fügen Sie nun alle Dateien im Website-Verzeichnis unter Versionskontrolle hinzu, indem Sie Git add ausführen.
Übernehmen Sie alle Dateien, indem Sie Git Commit ausführen - m 'Final Commit'
Fügen Sie das Remote-Repository wie folgt hinzu:
Nun der letzte Schritt, der den Code tatsächlich in das Github-Repository überträgt:
Wir sind mit Github fertig. Der nächste Teil ist die tatsächliche Bereitstellung der Anwendung für Heroku.
Bereitstellen der Anwendung auf Heroku:
Erstellen Sie ein Heroku-Konto unter https://www.heroku.com/
Hinweis : Wir müssen einige Änderungen für die Bereitstellung der Anwendung auf Heroku vornehmen. Heroku unterstützt SqLite 3 nicht, sondern verfügt über eine PostgreSQL-Datenbank. Also müssen wir die sqlite3-Abhängigkeit aus gemfile entfernen. Heroku benötigt den Edelstein rails_12factor, der von Heroku verwendet wird, um statische Assets wie Bilder und Stylesheets bereitzustellen. Die beiden in Gemfile erforderlichen Änderungen sind nachstehend zusammengefasst:
Entfernen Sie die Zeile gem 'sqlite3' aus Gemfile
Fügen Sie Gemfile die folgenden Zeilen hinzu
Gruppe: Entwicklung ,: Test do #<<<< not in production gem 'sqlite3' end group :production do gem 'pg', '0.17.1' gem 'rails_12factor', '0.0.2' end
Lassen Sie uns überprüfen, ob alles einwandfrei funktioniert, nachdem Sie die Änderungen an Gemfile vorgenommen haben. Speichern Sie die Gemfile und führen Sie sie aus Bundle installieren mit einer speziellen Flagge (–ohne Produktion), um die lokale Installation von Produktionsedelsteinen zu verhindern.
Übernehmen Sie die in Gemfile vorgenommenen Änderungen in das Remote-Repository von Github:
Übertragen Sie die Änderungen in das Remote-Github-Repository:
Erstellen einer neuen Anwendung bei Heroku:
Melden Sie sich bei Heroku an und erstellen Sie eine neue App. Ich habe meine App railtoheroku benannt. Sie können es benennen, was Sie wollen. Klicken Sie auf App erstellen, um die benannte App zu erstellen.
Verbinden des Github-Repositorys mit der Heroku-App:
Der nächste Schritt besteht darin, Ihr Github-Repository mit Heroku zu verknüpfen.
Unten haben wir unser Github-Repository railtoheroku angeschlossen
Sobald wir unser Github-Repository mit Heroku verbunden haben, können wir unsere Anwendung bereitstellen. Scrollen Sie zum Bereitstellen der Anwendung nach unten zur manuellen Bereitstellungsoption und klicken Sie auf Bereitstellungszweigoption.
Bereitstellen der Anwendung:
Sobald Sie auf Zweig bereitstellen klicken, beginnt Heroku mit der Installation der Edelsteine aus Gemfile in der Produktion:
Sobald alle Edelsteine installiert und die Anwendung bereitgestellt ist, wird die Glückwunschmeldung von Heroku angezeigt: 'Ihre App wurde erfolgreich bereitgestellt.'
Um Ihre bereitgestellte Anwendung anzuzeigen, klicken Sie einfach auf die Schaltfläche Anzeigen, und Sie können sehen, dass Ihre Anwendung erfolgreich bereitgestellt wurde.
Wenn Sie Probleme haben, während Sie einen der oben genannten Schritte ausführen, kommentieren Sie bitte unten. Hoffe dir hat dieser Beitrag gefallen.
Hast du eine Frage an uns? Bitte erwähnen Sie es in den Kommentaren und wir werden uns bei Ihnen melden.
Zusammenhängende Posts:
Analysieren von XML-Dateien mit SAX Parser