Ein MEAN Stack ist ein kostenloser, quelloffener, beliebter JavaScript-Software-Stack, der für die Entwicklung dynamischer Websites und Webanwendungen verwendet wird. Es besteht aus vier Komponenten:MongoDB, Express, Angular und Node.js. Angular wird für die Frontend-Entwicklung verwendet, während Node.js, Express und MongoDB für die Backend-Entwicklung verwendet werden. Ein MEAN-Stack basiert auf der JavaScript-Sprache, sodass er alle Aspekte einer Anwendung handhaben kann.
In diesem Tutorial zeigen wir Ihnen, wie Sie einen MEAN Stack auf Ubuntu 20.04 installieren.
Voraussetzungen
- Ein frischer Ubuntu 20.04 VPS auf der Atlantic.Net Cloud Platform
- Ein gültiger Domainname, der auf Ihre Server-IP verweist
- Ein auf Ihrem Server konfiguriertes Root-Passwort
Schritt 1 – Atlantic.Net Cloud-Server erstellen
Melden Sie sich zunächst bei Ihrem Atlantic.Net Cloud Server an. Erstellen Sie einen neuen Server mit Ubuntu 20.04 als Betriebssystem und mindestens 1 GB RAM. Stellen Sie über SSH eine Verbindung zu Ihrem Cloud-Server her und melden Sie sich mit den oben auf der Seite hervorgehobenen Anmeldeinformationen an.
Sobald Sie sich bei Ihrem Ubuntu 20.04-Server angemeldet haben, führen Sie den folgenden Befehl aus, um Ihr Basissystem mit den neuesten verfügbaren Paketen zu aktualisieren.
apt-get update -y
Schritt 2 – MongoDB installieren
Zunächst müssen Sie eine MongoDB-Datenbank auf Ihrem Server installieren. Standardmäßig ist die neueste Version von MongoDB im Standard-Repository von Ubuntu 20.04 verfügbar, sodass Sie sie einfach mit dem folgenden Befehl installieren können:
apt-get install mongodb -y
Starten Sie nach der Installation von MongoDB den MongoDB-Dienst und ermöglichen Sie ihm, beim Systemneustart mit dem folgenden Befehl zu starten:
systemctl start mongodb systemctl enable mongodb
Schritt 3 – Node.js installieren
Installieren Sie zunächst alle erforderlichen Abhängigkeiten mit dem folgenden Befehl:
apt-get install curl gnupg2 unzip git gcc g++ make -y
Sobald alle Abhängigkeiten installiert sind, fügen Sie das Node.js-Repository mit dem folgenden Befehl hinzu:
curl -sL https://deb.nodesource.com/setup_14.x | bash -
Nach dem Hinzufügen des Repositorys. Sie können Node.js mit dem folgenden Befehl installieren:
apt-get install nodejs -y
Überprüfen Sie nach der Installation von Node.js die Node.js-Version mit dem folgenden Befehl:
node -v
Sie sollten die folgende Ausgabe erhalten:
v14.15.1
Installieren Sie als Nächstes andere erforderliche Pakete, einschließlich Garn, gulp und pm2, mit dem folgenden Befehl:
npm install -g yarn npm install -g gulp npm install pm2 -g
Sobald alle Pakete installiert sind, können Sie mit dem nächsten Schritt fortfahren.
Schritt 4 – MEAN Stack installieren und konfigurieren
Laden Sie zunächst die neueste Version von MEAN mit dem folgenden Befehl herunter:
git clone https://github.com/meanjs/mean
Sobald der Download abgeschlossen ist, ändern Sie das Verzeichnis in mean und installieren Sie alle erforderlichen Abhängigkeiten mit dem folgenden Befehl:
cd mean yarn install
Bearbeiten Sie als Nächstes die Datei server.js mit dem folgenden Befehl:
nano server.js
Ersetzen Sie alle Zeilen durch Folgendes:
const express = require('express');
const MongoClient = require('mongodb').MongoClient;
const app = express();
app.use('/', (req, res) => {
MongoClient.connect("mongodb://localhost:27017/test", function(err, db){
db.collection('Example', function(err, collection){
collection.insert({ pageHits: 'pageHits' });
db.collection('Example').count(function(err, count){
if(err) throw err;
res.status(200).send('Page Hits: ' + Math.floor(count/2));
});
});
});
});
app.listen(3000);
console.log('Server running at http://localhost:3000/');
module.exports = app; Speichern und schließen Sie die Datei, wenn Sie fertig sind, und starten Sie dann den Server mit dem folgenden Befehl:
pm2 start server.js
Sie sollten die folgende Ausgabe erhalten:
Aktivieren Sie als Nächstes server.js mit dem folgenden Befehl, um beim Systemneustart zu starten:
pm2 startup
An diesem Punkt ist der MEAN-Stack installiert und lauscht auf Port 3000. Sie können dies mit dem folgenden Befehl überprüfen:
ss -antpl | grep 3000
Sie sollten die folgende Ausgabe erhalten:
LISTEN 0 511 *:3000 *:* users:(("node",pid=26014,fd=20)) Schritt 5 – Nginx als Reverse-Proxy für MEAN konfigurieren
Als Nächstes müssen Sie Nginx als Reverse-Proxy installieren und konfigurieren, um auf die MEAN-Anwendung zuzugreifen.
Installieren Sie zuerst den Nginx-Webserver mit dem folgenden Befehl:
apt-get install nginx -y
Erstellen Sie nach der Installation eine neue Konfigurationsdatei für den virtuellen Nginx-Host mit dem folgenden Befehl:
nano /etc/nginx/sites-available/mean
Fügen Sie die folgenden Zeilen hinzu:
server {
listen 80;
server_name mean.example.com;
access_log /var/log/nginx/mean-access.log;
error_log /var/log/nginx/mean-error.log;
location / {
proxy_set_header X-Forwarded-Host $host;
proxy_set_header X-Forwarded-Server $host;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://localhost:3000/;
}
} Speichern und schließen Sie die Datei, wenn Sie fertig sind, und aktivieren Sie dann den virtuellen Host mit dem folgenden Befehl:
ln -s /etc/nginx/sites-available/mean /etc/nginx/sites-enabled/
Bearbeiten Sie als Nächstes die Hauptkonfigurationsdatei von Nginx und legen Sie hash_bucket_size:
festnano /etc/nginx/nginx.conf
Fügen Sie die folgende Zeile unter http {
hinzuserver_names_hash_bucket_size 64;
Speichern und schließen Sie die Datei und überprüfen Sie dann Nginx mit dem folgenden Befehl auf Syntaxfehler:
nginx -t
Sie sollten die folgende Ausgabe erhalten:
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok nginx: configuration file /etc/nginx/nginx.conf test is successful
Starten Sie abschließend den Nginx-Dienst neu, um die Konfigurationsänderungen zu übernehmen:
systemctl restart nginx
Schritt 6 – Zugriff auf die MEAN-Anwendung
Öffnen Sie nun Ihren Webbrowser und greifen Sie über die URL http://mean.example.com auf die MEAN-Anwendung zu . Sie sollten Ihre MEAN-Anwendung auf dem folgenden Bildschirm sehen:
Im obigen Bildschirm wird die Zahl automatisch erhöht, wenn Sie die Seite aktualisieren.
Schlussfolgerung
Herzliche Glückwünsche! Sie haben MEAN Stack mit Nginx erfolgreich als Reverse-Proxy auf dem Ubuntu 20.04-Server installiert. Sie können jetzt ganz einfach Ihre eigene dynamische Anwendung mit einem MEAN Stack auf Ihrem VPS-Hosting-Konto bei Atlantic.Net bereitstellen.