So erstellen Sie eine Website auf einem Raspberry Pi mit Node.js, Express und MongoDB Teil 1: 6 Schritte

2024 Autor: John Day | [email protected]. Zuletzt bearbeitet: 2024-01-30 07:19

Willkommen zu TEIL 1 meines Tutorials zur node.js-Webanwendung. In Teil 1 wird die erforderliche Software für die Entwicklung von node.js-Apps erläutert, wie Sie die Portweiterleitung verwenden, eine App mit Express erstellen und Ihre App ausführen. Der zweite Teil dieses Tutorials wird den gesamten Code und die Struktur meiner vollständigen Webanwendung behandeln. Wenn Sie dazu bereit sind, besuchen Sie es hier.

Beim Erstellen meiner persönlichen Startseite fiel es mir also sehr schwer, aus dem Unkraut herauszukommen. Es gibt mehr im Internet, als ich jemals über das Erstellen einer Webseite verstehen werde.

Dies ist eine Anleitung zur Verwendung von Node.js, Express und Mongodb. um eine Webseite zu erstellen.

Der Code für all das ist hier.

Meine Webseite heißt Das Internet. Bitte besuchen Sie, wenn Sie einen interaktiveren Blick auf eine persönliche Website wünschen.

Ich begann diese Seite, um eine persönliche Präsenz im Internet mit Projekten zu haben, die ich gemacht habe, mit Links zu meinen instructables-Projekten für weitere Details.

Diese Seite wird bei mir zu Hause auf einem Pi Zero W gehostet.

Schritt 1: Dinge, die Sie brauchen

1. Zeit. Ich kann nicht betonen, dass es ein langwieriger Prozess ist, eine Site zu entwickeln und das Innenleben wirklich zu verstehen. Ich habe einen Abschluss in Elektrotechnik mit Schwerpunkt Mikroelektronik und eine Liebe zum Programmieren, und das hat mich noch Monate gekostet.

Dieses Tutorial ist ein guter Baustein, aber bitte lesen Sie mehr Dokumentation online, um jeden Teil zu verstehen.

2. Raspberry Pi - jedes Modell ist geeignet. Auch jeder Computer, auf dem Linux läuft, ist ausreichend. Eigentlich reicht jeder Computer aus, ich gehe nur genauer darauf ein, wie man ihn auf einem Pi ausführt.

3. Internetverbindung - wenn Sie dies weltweit hosten möchten. Zur Konfiguration der Portweiterleitung wird ein Router oder ein Netzwerk-Switch benötigt.

4. Software - Jede Codierungsplattform funktioniert, Sublime, Webstorm, Notepadd++, Visual Studios oder alles andere. Ich habe hauptsächlich Webstorm oder Sublime verwendet.

Schritt 2: Portweiterleitung auf Ihrem Raspberry Pi

Ich gehe also davon aus, dass Sie Ihren Himbeer-Pi bereits eingerichtet haben. Wenn nicht, sehen Sie sich dieses einfache Tutorial hier an.

Auf meinem Pi läuft Jessie lite und es ist alles Terminal. Der Vorteil davon ist, dass ich nicht viele Prozesse im Hintergrund habe, die meinen Server bei hohem Datenverkehr verlangsamen könnten. Lassen Sie mich jetzt sagen, dass dieses Tutorial für Websites mit geringem Traffic gedacht ist. Jede Site mit hohem Datenverkehr ist auf einem Pi langsam und kann Ihren Server zum Absturz bringen.

Port-Weiterleitung

Wenn Ihr Pi eingerichtet ist, müssen Sie die Portweiterleitung auf Ihrem Router oder Switch aktivieren. Suchen Sie dazu die Portweiterleitungseinstellungen in Ihrem Router. Jeder Router ist anders, ich zeige hier meine Linksys Velop GUI.

Meine Site ist auf Port 3000 konfiguriert, dies kann im Quellcode in der Datei app.js oder www geändert werden.

Ich habe auch Port 22 für die Weiterleitung eingerichtet, damit ich SSH in mein pi kann, dies kann in den pi-Einstellungen eingerichtet werden. SSH ist eine Möglichkeit, das Terminal auf Ihrem Pi zu verwenden, während Sie sich nicht im selben Netzwerk befinden, und auch ohne die Anzeigeausgabe des Pi zu verwenden. Auf diese Weise kann ich meine Website von einem anderen Computer aus aktualisieren und die Änderungen auf mein Pi übertragen.

Folgen Sie den Bildern, um die Portweiterleitung einzurichten.

DNS-Dienst

Sie benötigen einen Dienst, der Ihre IP-Adresse mit einem Webadressennamen verknüpft. Sie können die globale IP-Adresse Ihres Routers gefolgt von der Portnummer eingeben, um auf Ihre Site zuzugreifen. Dies ist jedoch schwierig, insbesondere wenn sich Ihre globale IP ändert. Ein DNS-Dienst verfolgt und aktualisiert diese Änderungen, sodass Ihr Webname und Ihre IP-Adresse verknüpft sind. Ich wähle einen kostenlosen Dienst über No-IP zu nutzen. Sie können gerne alles bezahlen, was Sie wollen. Dies ist nur ein kostenloser Weg, den ich kenne.

www.noip.com/

Schritt 3: Erforderliche Software auf Pi. installieren

Wenn Sie meinen GitHub-Code heruntergeladen haben, müssen Sie nichts weiter tun, als einen einfachen npm-Startbefehl auszuführen, um die Site zum Laufen zu bringen. Da dies jedoch ein ausführliches Tutorial ist, werde ich erklären, wie Sie alle benötigten Software und Pakete installieren.

Führen Sie auf Ihrem Pi- oder Linux-Computer (es gibt verschiedene Befehle für die Verwendung von Windows) die folgenden Befehle aus.

Ich habe diese in einzelne Schritte unterteilt, um es einfacher zu machen.

1. Node.js und npm installieren

Node.js ist im Grunde das Java-Skript, das den Server erstellt. NPM ist Node Package Manager und verarbeitet die gesamte Middleware, die mit node.js benötigt wird.

Führen Sie zur Installation die folgenden Befehle auf einem Linux- oder Mac-Computer aus.

curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash sudo apt-get install -y nodejs

Um unter Windows herunterzuladen, verwenden Sie einfach die hier gefundene exe.

Dieser Link ist für Linux-Hilfe, wenn nicht auf einem Himbeer-Pi.

2. MongoDB installieren

MongoDB ist genau das, eine Datenbank. Ich verwende dies für einen Login- und Traffic-Zähler-Teil meiner Webseite.

Führen Sie zur Installation die folgenden Befehle auf einem Linux- oder Mac-Computer aus.

sudo apt-key adv --keyserver hkp://keyserver.ubuntu.com:80 --recv 0C49F3730359A14518585931BC711F9BA15703C6

echo "deb https://repo.mongodb.org/apt/debian jessie/mongodb-org/3.4 main" | sudo tee /etc/apt/sources.list.d/mongodb-org-3.4.list

sudo apt-get update

sudo apt-get install -y mongodb-org

Um unter Windows herunterzuladen, verwenden Sie einfach die hier gefundene exe.

Dieser Link ist für Linux-Hilfe, wenn nicht auf einem Himbeer-Pi.

3. Grunt installieren

Grunt ist wie npm, da Sie es in Verbindung mit anderen Plugins verwenden können. Ich verwende es nicht für meine App, aber es ist sehr hilfreich bei der Automatisierung von Aufgaben. Dieser Schritt kann komplett übersprungen werden, damit Ihre App funktioniert.

Verwenden Sie für Windows, Mac oder Linux den folgenden Befehl.

npm install -g grunt-cli

4. Express installieren

Express ist eine einfache Möglichkeit, das Node-Js-Framework zu verwenden. Wir werden einen Express-Generator installieren. Dies schafft den einfach zu bedienenden Rahmen einer Webanwendung.

Verwenden Sie für Windows, Mac oder Linux den folgenden Befehl.

npm install Express-Generator -g

Schritt 4: Erstellen Sie eine Express Node.js-App

Navigieren Sie zu dem Ordner, in dem Sie Ihre App speichern möchten. Sobald Sie sich hier befinden, befinden sich alle zukünftigen Installationen in diesem Ordner.

Führen Sie die folgenden Befehle auf einem Linux- oder Mac-Computer aus, um das Verzeichnis zu ändern.

sudo cd /home/pi/myapp

Für Windows:

cd C:\Benutzer\pi\Desktop\myapp

Verwenden Sie den Express-Generator, um das erforderliche Knoten-js-Framework zu erstellen.

Namen meiner App ausdrücken

Dadurch wird ein reines express-node.js-Projekt erstellt. Sie können die Funktionen in diesem Schritt bearbeiten, indem Sie mit dem Befehl -h nach verschiedenen Befehlen suchen, wie unten gezeigt. Oder Sie können die generierte Vorlage manuell bearbeiten, wie ich es getan habe. Ich werde dies in Teil 2 ausführlicher besprechen. Sie können diesem Code andere Variablen hinzufügen, um Einstellungen in Ihrer Anwendung zu ändern, z. B. die Verwendung von HTML, Handlebars, Jade und anderen. Führen Sie dazu den Befehl aus:

ausdrücken -h

Fahren Sie mit der Einrichtung Ihrer node.js-Webanwendung fort, indem Sie die folgenden Befehle ausführen:

cd nameofmyapp

npm installieren

Dadurch werden alle erforderlichen Pakete installiert, die Ihre node.js-Webanwendung zum Ausführen benötigt, und weitere, die zur Verwendung verfügbar sind.

In diesem Beispiel wäre der Dateipfad für die Anwendung:

/home/pi/myapp/nameofmyapp

Dies liegt daran, dass der Express-Generator eine Datei basierend auf der Zeichenfolge erstellt, die Sie danach platzieren. Wenn Sie sich bereits im gewünschten Verzeichnis befinden, verwenden Sie einfach Express.

Schritt 5: Führen Sie Ihre Webanwendung aus

Führen Sie den Befehl aus, um Ihre node.js-Webanwendung auszuführen:

npm start

Um es beim Codieren effizienter zu machen, damit unsere Anwendung automatisch aktualisiert wird, nachdem wir Änderungen vorgenommen haben, werden wir Nodemon installieren.

npm install -g nodemon

Hier würden Ihnen die meisten Tutorials sagen, dass Sie Spaß beim Bauen haben und Sie die harte Beinarbeit herausfinden müssen. In den nächsten Schritten werde ich Sie durch die Erstellung meiner Anwendung führen.

Schritt 6: Gutschrift

Nicht wirklich ein Schritt, aber ich möchte meine Quellen und Inspirationen für dieses Tutorial auflisten.

Diese Github-ReadMe wurde von einem guten Freund während der Arbeit an unserem Senior-Design-Projekt geschrieben und diente als Inspiration für die Erstellung meiner Website.

github.com/SDP-DT04/Web-Application/blob/m…

Dieses Tutorial war ein hilfreiches Werkzeug bei der Erstellung einer Webanwendung.

kroltech.com/2013/12/29/boilerplate-web-app…

Weitere Informationen zu einer node.js-Site finden Sie in meinem Teil 2.