Erste Schritte mit dem Aufbau von Node.js-, Express-, Ejs- und Mongodb-Servern und der Anwendungsentwicklung von Scratch_node.js aus

Dieser Artikel ist eine Adaption von Feiyus „[Übersetzung] Erste Schritte für Front-End-Entwickler, Erstellen von Node.js, Express, Jade, Mongodb Server von Grund auf“. Der Grund, warum ich Jade in Ejs geändert habe, ist, dass ich Ejs denke Genauer gesagt sollten die Gewohnheiten von WEB-Programmierern besser mit den Nutzungsgewohnheiten von PHP- und ASP-Programmierern übereinstimmen. Okay, ohne weitere Umschweife beginnen wir direkt mit dem Tutorial.

Teil 1 – 15-minütige Installation

Wenn Sie wirklich von Grund auf lernen möchten, nehmen Sie sich zunächst die Zeit, die Umgebung einzurichten. Es ist nicht schwierig, ich verwende Win8, daher sieht das ein wenig anders aus als die Tutorials für die Verwendung von Mac und Ubuntu oder anderen *nix-Systemen, aber im Grunde ist es dasselbe.

Schritt 1 – Node.JS installieren

Es ist ganz einfach: Gehen Sie zur offiziellen Website von Node.js und klicken Sie auf die große grüne Schaltfläche „Installieren“. Ihr System wird automatisch erkannt und Sie können die richtige Installationsdatei herunterladen. (Wenn nicht, klicken Sie auf die Schaltfläche „Herunterladen“, um den gewünschten Download auszuwählen.) Führen Sie das Installationsprogramm aus und schon kann es losgehen. Sie haben Node.js installiert und NPM (Node Package Manager) ermöglicht Ihnen die einfache Installation verschiedener nützlicher Pakete in Node.

Schritt 2 – Express installieren

Da Node nun läuft, benötigen wir ein paar Dinge, die es uns ermöglichen, tatsächlich eine nutzbare Site zu erstellen. Als nächstes müssen wir Express installieren, ein Framework, das Node von einer einfachen Anwendung in einen Webserver verwandelt, der eher dem Webserver ähnelt, den wir normalerweise verwenden. Wir müssen mit Express beginnen, weil wir die Gerüstfunktionalität benötigen, die es bietet. Wir geben diesen Befehl ein:

Code kopieren Der Code lautet wie folgt:

c:node>npm install -g express

Auf diese Weise ist Express korrekt in unserem Knoten installiert und weltweit verfügbar gemacht worden. Im Befehlszeilenfenster werden eine Reihe von Ausgaben angezeigt, hauptsächlich http 304- und GET-Anfragen. Dies ist normal. Express sollte installiert und verfügbar sein.

Schritt 3 – Erstellen Sie ein Express-Projekt

Wir werden Express und Ejs verwenden, jedoch nicht für die CSS-Vorverarbeitung. Wir schreiben etwas CSS von Hand. Wir müssen EJS oder andere Template-Engines verwenden, um Node- und Express-Daten zu verarbeiten. Wenn Sie HTML kennen, ist Ejs nicht schwierig. Denken Sie daran, dass Sie sich konzentrieren müssen, sonst kann leicht etwas schief gehen.

Geben Sie nun im selben Befehlszeilenfenster Folgendes ein:

Code kopieren Der Code lautet wie folgt:

c:node>express –sessions nodetest1

Drücken Sie die Eingabetaste und Sie werden eine Menge solcher Dinge sehen:

Code kopieren Der Code lautet wie folgt:

C:node>express --sessions nodetest1
erstellen: nodetest1
erstellen: nodetest1/package.json
erstellen: nodetest1/app.js
erstellen: nodetest1/routes
erstellen: nodetest1/routes/index.js
erstellen: nodetest1/routes/user.js
erstellen: nodetest1/views
erstellen: nodetest1/views/index.ejs
erstellen: nodetest1/public/images
erstellen: nodetest1/public/javascripts
erstellen: nodetest1/public
erstellen: nodetest1/public/stylesheets
erstellen: nodetest1/public/stylesheets/style.css

Abhängigkeiten installieren:
$ cd nodetest1 && npm install

Führen Sie die App aus:
$ Knoten-App

Schritt 4 – Abhängigkeiten bearbeiten

Okay, wir haben jetzt eine grundlegende Projektstruktur, aber wir sind noch nicht fertig. Sie werden feststellen, dass der Express-Installationsprozess eine Datei namens package.json in Ihrem nodetest1-Verzeichnis erstellt. Sie sollte wie folgt aussehen.

Code kopieren Der Code lautet wie folgt:

{
„name“: „Anwendungsname“,
„Version“: „0.0.1“,
„privat“: wahr,
„Skripte“: {
„start“: „node app.js“
},
„Abhängigkeiten“: {
„express“: „3.4.8“,
„ejs“: „*“
}
}

Dies ist eine Standarddatei im JSON-Format, die unsere Anwendung und ihre Abhängigkeiten darstellt. Wir müssen noch etwas hinzufügen. Zum Beispiel Aufrufe von Mongodb und Monk. Ändern Sie den Teil mit den Abhängigkeiten wie folgt:

Code kopieren Der Code lautet wie folgt:

„Abhängigkeiten“: {
„express“: „3.4.8“,
„ejs“: „*“,
„mongodb“: „*“,
„monk“: „*“
}

Schritt 5 – Abhängigkeiten installieren

Jetzt haben wir die Abhängigkeiten des Projekts definiert. Das * weist NPM an, „die neueste Version zu installieren“. Kehren Sie zum Befehlszeilenfenster zurück, geben Sie das Verzeichnis nodetest1 ein und geben Sie Folgendes ein:

Code kopieren Der Code lautet wie folgt:

C:nodenodetest1>npm install

Es wird eine Menge Zeug ausgegeben. Dies liegt daran, dass es unsere geänderte JSON-Datei direkt liest, die darin enthaltenen Abhängigkeiten identifiziert und die erforderlichen Dateien installiert. Wenn NPM installiert ist, sollten Sie über ein Verzeichnis „node_modules“ verfügen, das alle Abhängigkeitsdateien enthält, die unser Projekt benötigt.

Jetzt haben wir eine voll funktionsfähige App und sie ist betriebsbereit. Probieren wir es aus! Stellen Sie sicher, dass Ihr aktuelles Verzeichnis das Verzeichnis „nodetest1“ ist. Geben Sie Folgendes ein:

Code kopieren Der Code lautet wie folgt:

C:nodenodetest1>node app.js

Nachdem Sie die Eingabetaste gedrückt haben, sehen Sie:

Code kopieren Der Code lautet wie folgt:

Express-Server überwacht Port 3000

wunderbar. Öffnen Sie den Browser und geben Sie http://localhost:3000 ein. Es sollte eine Begrüßungsseite für Express angezeigt werden.

Jetzt haben Sie Ihren eigenen Node JS WebServer, der mit der Express-Engine und der Ejs-HTML-Vorlagen-Engine läuft. So schwierig ist das doch nicht, oder?

Teil 2 – Okay, lass uns „Hallo, Welt!“ schreiben

Öffnen Sie Ihren häufig verwendeten Texteditor oder eine andere IDE. Ich persönlich verwende gerne Sublime Text. Öffnen Sie app.js in Ihrem nodetest1-Verzeichnis. Diese Datei ist der Kern Ihrer App. Sie sollten etwa Folgendes sehen:

Code kopieren Der Code lautet wie folgt:

var express = require('express');
var Routen = require('./routes');
var user = require('./routes/user');
var http = require('http');
var path = require('path');

Dies definiert lediglich eine Reihe von JavaScript-Variablen und verweist auf einige Pakete und Abhängigkeiten, Knotenfunktionen und Routen. Routen entsprechen einer Sammlung von Modellen und Controllern in MVC. Sie sind für die Weiterleitung von Anforderungen verantwortlich und enthalten auch einige Verarbeitungslogiken. Express hat all diese Dinge für uns erstellt. Lassen Sie uns vorerst die Benutzerroute ignorieren und beginnen, die Route der obersten Ebene zu schreiben (gesteuert durch Routenindex.js).

Schreiben Sie am Ende der obigen Datei:

Code kopieren Der Code lautet wie folgt:

var app = express();

Dieser Satz ist entscheidend. Es instanziiert Express und weist es unserer App-Variablen zu. Im folgenden Inhalt wird diese Variable zum Konfigurieren einer Reihe von Express-Parametern verwendet. Geben Sie weiter Folgendes ein:

Code kopieren Der Code lautet wie folgt:

// alle Umgebungen
app.set('port', process.env.PORT || 3000);
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));

Dadurch werden der Port, das Verzeichnis, in dem nach Ansichten gesucht wird, die zum Verarbeiten dieser Ansichten zu verwendende Vorlagen-Engine und einige andere Dinge festgelegt. Beachten Sie auch die letzte Zeile, die Express anweist, statische Dateien im Verzeichnis public/ als Dateien im Verzeichnis der obersten Ebene zu hosten. Ihr Bildverzeichnis ist beispielsweise in c:nodenodetest1publicimages gespeichert, die tatsächliche Zugriffsadresse lautet jedoch http://localhost:3000/images/.

Hinweis: Sie müssen diese Zeile
einfügen

Code kopieren Der Code lautet wie folgt:

app.use(express.bodyParser());

Wechseln Sie zu

Code kopieren Der Code lautet wie folgt:

app.use(express.urlencoded());

Dadurch werden einige Warnmeldungen im Knotenfenster ignoriert, während die App ausgeführt wird. Hauptsächlich einige mögliche zukünftige Änderungen an Express und seinen Plug-Ins. Wenn Sie diese Änderung nicht vornehmen, erhalten Sie eine Reihe von Warnungen, dass bestimmte Funktionen bald ablaufen, wenn das Programm ausgeführt wird.

Dann hinzufügen:

Code kopieren Der Code lautet wie folgt:

// nur Entwicklung
if ('development' == app.get('env')) {
app.use(express.errorHandler());
}

Auf diese Weise können Sie während der Entwicklung einige Fehlerprüfungen durchführen.

Weiter erhöhen:

Code kopieren Der Code lautet wie folgt:

app.get('/',routes.index);
app.get('/users', user.list);

Dadurch wird dem Router mitgeteilt, welche Route er verwenden soll, wenn eine URI-Anfrage eintrifft. Beachten Sie, dass die Benutzervariable zuvor definiert und /routes/user.js zugeordnet wurde. Wir werden die in dieser Datei definierte Listenfunktion aufrufen. Hier kann eine Liste der Benutzer angezeigt werden.

Weiter erhöhen:

Code kopieren Der Code lautet wie folgt:

http.createServer(app).listen(app.get('port'), function(){
console.log('Express-Server überwacht Port ' app.get('port'));
});

Erstellen Sie abschließend einen http-Server und starten Sie ihn. Das ist so ziemlich alles.

(Der obige Inhalt ist in der vom neuen Express generierten Vorlage vollständig, Sie müssen ihn nicht selbst schreiben)

Jetzt schreiben wir etwas Nützliches. Wir werden nicht direkt „Hallo Welt!“ auf unsere Indexseite schreiben. Wir werden diese Gelegenheit nutzen, um zu lernen, wie man das Routenrouting verwendet und wie die Ejs-Engine funktioniert. Fügen Sie nach dem Abschnitt app.get() der obigen app.js-Datei eine Zeile hinzu:

app.get('/helloworld',routes.helloworld);
Wenn Sie im Befehlszeilenfenster Strg C drücken, um den app.js-Prozess zu beenden, ihn dann neu zu starten und dann über einen Browser auf http://localhost:3000/helloworld zuzugreifen, erhalten Sie einen sehr aufregenden Knotenfehler und Folgendes Meldung im Befehlszeilenfenster: Eine Reihe von Absturzaufforderungen. Dies liegt daran, dass wir das Routing nicht geändert haben, um diesen Pfad zu verarbeiten. Lass uns das machen. Gehen Sie in Ihrem Editor zum Routenverzeichnis, suchen Sie index.js und öffnen Sie es. Es sollte so aussehen:

Code kopieren Der Code lautet wie folgt:

/*
* Startseite ERHALTEN.
*/

exports.index = function(req, res){
res.render('index', { title: 'Express' });
};

Fügen wir eine neue Seite hinzu. Ich bevorzuge es, für jedes Verzeichnis der ersten Ebene eine unabhängige Routendatei zu erstellen, aber jetzt planen wir nicht, eine vollständige Verzeichnisstruktur für helloworld unter Ansichten zu erstellen, daher werden wir vorerst das Index-Routing verwenden. Fügen Sie am Ende dieser Datei Folgendes hinzu:

Code kopieren Der Code lautet wie folgt:

exports.helloworld = function(req, res){
res.render('helloworld', { title: 'Hello, World!' });
};

Es wird für die Verarbeitung dieser URI-Anfrage verantwortlich sein, aber jetzt haben wir keine tatsächliche Seite, die res.render rendern kann. Dies ist die Aufgabe von Ejs. Gehen Sie in Ihr Ansichtsverzeichnis, öffnen Sie index.ejs und speichern Sie es als helloworld.ejs-Datei. Es sollte nun so aussehen:

Code kopieren Der Code lautet wie folgt:

<%= title %>

Willkommen bei <%= title %>

Es sollte leicht zu verstehen sein.
Speichern Sie die Datei. Drücken Sie Strg C im Befehlszeilenfenster, um app.js zu unterbrechen, und geben Sie dann node app.js ein, um es neu zu starten. Tipp: Wenn Sie eine EJS-Vorlagendatei ändern, müssen Sie den Server nicht neu starten. Wenn Sie jedoch eine js-Datei wie app.js oder eine Routing-js-Datei ändern, müssen Sie den Server neu starten, um die Auswirkung zu sehen.

Beachten Sie nach dem Serverstart, dass der Server http://localhost:3000/helloworld öffnet und Sie diese schöne Oberfläche sehen sollten:

Okay! Da wir nun eine Route haben, die unsere Vorlage verarbeiten kann, sehen wir den gewünschten Effekt. Als nächstes erstellen wir ein Modell (Datenschicht).

Teil 3 – Erstellen der Datenbank und Auslesen der Daten

Schritt 1 – Mongodb installieren

Schließen wir den Texteditor und kehren zum Befehlszeilenfenster zurück. Verwenden Sie zunächst einen Browser, öffnen Sie http://mongodb.org/ und laden Sie Mongo herunter. Klicken Sie im Hauptmenü auf den Download-Link, um die für Ihr System geeignete Version zu finden. Laden Sie für 64-Bit-Win8 die 64-Bit-Version *2008R2 herunter. Nachdem Sie die Zip-Datei heruntergeladen haben, entpacken Sie sie nach c:mongo oder c:program filesmongo oder wo auch immer, das spielt keine Rolle. Wir speichern die Daten in unserem Verzeichnis nodetest1.

Schritt 2 – Mongod und Mongo ausführen

Erstellen Sie ein Unterverzeichnis data in unserem Verzeichnis nodetest1, geben Sie dann das bin-Verzeichnis Ihres Mongodb-Verzeichnisses in das Befehlszeilenfenster ein und geben Sie Folgendes ein:

Code kopieren Der Code lautet wie folgt:

mongod –dbpath c:nodenodetest1data

Sie werden sehen, dass der Mongo-Server startet. Der erste Start wird eine Weile dauern, da er vorab etwas Festplattenspeicher zuweisen und einige andere Aufgaben erledigen muss. Wenn die Meldung „[initandlisten] wartet auf Verbindungen an Port 27017“ angezeigt wird, ist der Vorgang erledigt. Es gibt nichts weiter zu tun, der Server läuft bereits. Jetzt müssen Sie ein weiteres Befehlszeilenfenster öffnen, das Bin-Verzeichnis des Mongo-Verzeichnisses eingeben und
eingeben

Code kopieren Der Code lautet wie folgt:

Mongo

Sie werden einige Eingabeaufforderungen wie diese sehen:

Code kopieren Der Code lautet wie folgt:

c:mongo>mongo
MongoDB-Shell-Version: 2.4.5
Verbindung herstellen mit: test

Wenn Sie zu diesem Zeitpunkt auf das Mongod-Fenster schauen, wird eine Meldung angezeigt, dass eine Verbindung hergestellt wurde. Wir werden diesen Befehlszeilen-Client als nächstes verwenden, um unsere Datenbank manuell zu verarbeiten, aber das ist für unsere Website nicht notwendig.

Schritt 3 – Erstellen Sie eine Datenbank

Machen Sie sich über die obige Aufforderung zum Herstellen einer Verbindung zum Testen keine Sorgen. Dies ist lediglich die Standarddatenbank, die Mongo verwendet, wenn Sie keine Datenbank angeben. Es wird nicht einmal die Datenbank mit dem Namen test erstellt, es sei denn, Sie fügen ihr einen Datensatz hinzu. Lassen Sie uns eine eigene Datenbank erstellen. Geben Sie im Mongo-Befehlszeilenfenster Folgendes ein:

Code kopieren Der Code lautet wie folgt:

Verwenden Sie nodetest1

Die Datenbank wird nicht erstellt, es sei denn, wir fügen einige Daten in sie ein.

Schritt 4 – Fügen Sie einige Daten hinzu

Mein Lieblingsmerkmal von MongoDB ist, dass es JSON als Datenstruktur verwendet, was bedeutet, dass ich damit sehr vertraut bin. Wenn Sie mit JSON nicht vertraut sind, sollten Sie sich zunächst darüber informieren; es würde den Rahmen dieses Tutorials sprengen.

Wir fügen der Sammlung einige Daten hinzu. In diesem Tutorial haben wir nur eine einfache Datenbank und lassen nur zwei Felder übrig: Benutzername und E-Mail. Unsere Daten sehen so aus:

Code kopieren Der Code lautet wie folgt:

{
"_id" : 1234,
„Benutzername“: „cwbuecheler“,
„E-Mail“: „cwbuecheler@nospam.com“
}

Sie können Ihre eigenen _id-Feldwerte erstellen, aber ich denke, es ist besser, dies Mongo zu überlassen. Es erstellt für jeden Datensatz einen eindeutigen Wert. Mal sehen, wie es funktioniert. Geben Sie im Mongo-Fenster Folgendes ein:

Code kopieren Der Code lautet wie folgt:

db.usercollection.insert({ „username“ : „testuser1″, „email“ : „testuser1@testdomain.com“ })

Wichtiger Hinweis: db ist die Datenbank nodetest1, die wir oben erstellt haben, und usercollection ist unsere Sammlung, die einer Datentabelle entspricht. Beachten Sie, dass wir diese Sammlung nicht im Voraus erstellen müssen, sie wird automatisch erstellt, wenn sie zum ersten Mal verwendet wird. Okay, drücken Sie die Eingabetaste. Wenn alles gut geht, werden Sie... nichts sehen. Das ist nicht gut, geben Sie ein:

Code kopieren Der Code lautet wie folgt:

db.usercollection.find().pretty()

Wenn Sie neugierig sind: Die hübsche Methode formatiert die Ausgabe und fügt Zeilenumbrüche und Einrückungen hinzu. Es sollte lauten:

Code kopieren Der Code lautet wie folgt:

{
"_id" : ObjectId("5202b481d2184d390cbf6eca"),
„Benutzername“: „testuser1“,
„email“: „testuser1@testdomain.com“
}

Natürlich sollte die ObjectID, die Sie erhalten, unterschiedlich sein, Mongo generiert automatisch eine. Wenn Sie schon einmal JSON-Schnittstellendienste verwendet haben, denken Sie jetzt: Wow, es sollte sehr einfach sein, dies im Web aufzurufen! Nun ja, du hast recht.

Tipp: Als formeller Dienst sollten Sie nicht wollen, dass alle Daten auf der obersten Ebene gespeichert werden. Informationen zum Design der Mongodb-Datenstruktur finden Sie bei Google.

Da wir nun ein paar Daten haben, fügen wir weitere hinzu. Geben Sie im Mongo-Fenster ein:

Code kopieren Der Code lautet wie folgt:

newstuff = [{ "Benutzername" : "testuser2", "email" : "testuser2@testdomain.com" }, { "username" : "testuser3", "email" : "testuser3@testdomain.com" }]
db.usercollection.insert(newstuff);

Beachten Sie, dass wir mehrere Daten gleichzeitig über einzelne Daten an die Sammlung übergeben. Wie einfach! Verwenden Sie den Suchbefehl oben und Sie werden diese drei Daten sehen.

Jetzt integrieren wir den zuvor erstellten Webserver und die Datenbank.

Schritt 5 – Mongo mit Knoten verbinden

Jetzt erstellen wir eine Seite, um die Datensätze in der Datenbank in einer schönen Tabelle anzuzeigen. Dies ist der HTML-Inhalt, den wir generieren werden:

Code kopieren Der Code lautet wie folgt:

• testuser1


• testuser2


• testuser3

Ich weiß, das ist nicht sehr wissenschaftlich, aber es ist gut, dass Sie es verstehen. Wir wollen lediglich ein einfaches Programm zum Lesen und Schreiben von Datenbanken erstellen und keine vollständige Website erstellen. Zuerst fügen wir ein wenig Inhalt zu app.js (dem Herz und der Seele unserer Anwendung) hinzu, damit wir eine Verbindung zu Mongodb herstellen können. Öffnen Sie c:nodenodetest1app.js. Oben sehen Sie:

Code kopieren Der Code lautet wie folgt:

var express = require('express');
var Routen = require('./routes');
var user = require('./routes/user');
var http = require('http');
var path = require('path');

Fügen Sie darunter hinzu:

Code kopieren Der Code lautet wie folgt:

// Neuer Code
var mongo = require('mongodb');
var monk = require('monk');
var db = monk('localhost:27017/nodetest1');

Diese Zeilen teilen der App mit, dass wir eine Verbindung zu MongoDB herstellen müssen. Unser Datenbankstandort ist localhost:27017/nodetest1. Beachten Sie, dass 27017 der Standardport von Mongodb ist. Wenn Sie den Port aus irgendeinem Grund ändern, notieren Sie ihn hier und ändern Sie ihn entsprechend. Schauen Sie sich nun das Ende der Datei an:

Code kopieren Der Code lautet wie folgt:

app.get('/',routes.index);
app.get('/users', user.list);
app.get('/helloworld',routes.helloworld);

Fügen Sie unten eine Zeile hinzu:

Code kopieren Der Code lautet wie folgt:

app.get('/userlist',routes.userlist(db));

Diese Zeile teilt der App mit, dass wir die DB-Variable an die Userlist-Route übergeben müssen, wenn ein Benutzer auf den /userlist-Pfad zugreift. Aber wir haben noch keine Benutzerlistenroute, also erstellen wir jetzt eine.

Schritt 6 – Daten in Mongo lesen und anzeigen

Öffnen Sie c:nodenodetest1routesidnex.js mit Ihrem Editor. Es gibt zwei Routen, Index und Hallo Welt. Jetzt fügen wir die dritte hinzu:

Code kopieren Der Code lautet wie folgt:

exports.userlist = function(db) {
Rückgabefunktion(req, res) {
      varcollection = db.get('usercollection');
       collection.find({},{},function(e,docs){
              res.render('userlist', {
„Benutzerliste“: Dokumente
            });
});
};
};

Nun, die Dinge werden etwas kompliziert. Hier definieren wir zunächst eine Funktion zum Empfangen der von uns übergebenen Datenbankvariablen und rufen dann ein Seitenrendering auf, das mit den beiden vorherigen Routen identisch ist. Wir teilen ihm mit, dass es die Benutzersammlung lesen, eine Suche durchführen und die zurückgegebenen Daten in der docs-Variablen speichern muss. Sobald wir den Inhalt gelesen haben, rufen wir render auf, um die Benutzerlisten-Vorlagenseite zu rendern, und übergeben die erhaltene Dokumentvariable als Benutzerlistenvariable in der Vorlagen-Engine.

Als nächstes erstellen Sie unsere Ejs-Vorlage. Öffnen Sie index.ejs im Verzeichnis „views“, speichern Sie es als userlist.ejs und ändern Sie dann den HTML-Code so, dass er wie folgt aussieht:

Code kopieren Der Code lautet wie folgt:

Benutzerliste

<%
for(var i in userlist){
%>

• “><%=userlist[i].username%> <% } %>
  

Speichern Sie die Datei und starten Sie den Knotenserver neu. Ich hoffe, Sie erinnern sich daran, wie man neu startet. Öffnen Sie den Browser und besuchen Sie http://localhost:3000/userlist. Sie sollten eine Oberfläche wie diese sehen:

Klicken Sie auf die Schaltfläche „Senden“ und es wird die Fehlermeldung „Post kann nicht auf /adduser gepostet werden“ angezeigt. Lass es uns reparieren.

Schritt 2 – Erstellen Sie Ihre Datenbankverarbeitungsfunktion

Wie zuvor ändern wir app.js, dann die Routendatei und dann die EJS-Vorlage. Hier ist jedoch keine EJS-Vorlage erforderlich, da unser Beitrag später springt. Fügen Sie nach dem Abschnitt app.get() von app.js eine Zeile hinzu:

Code kopieren Der Code lautet wie folgt:

app.post('/adduser',routes.adduser(db));

Beachten Sie, dass dies app.post und nicht app.get ist. Lassen Sie uns die Route einrichten. Erstellen Sie in „routes/index.js“ unsere Datenbankeinfügefunktion. Dieser ist relativ groß, daher empfehle ich Ihnen, einen guten Kommentar zu schreiben.

Code kopieren Der Code lautet wie folgt:

exports.adduser = function(db) {
Rückgabefunktion(req, res) {

// Unsere Formularwerte abrufen. Diese basieren auf den „Name“-Attributen
        var userName = req.body.username;
        var userEmail = req.body.useremail;

// Stellen Sie unsere Sammlung ein
      varcollection = db.get('usercollection');

// An die DB senden
       collection.insert({
"Benutzername": Benutzername,
„email“ : userEmail
           }, Funktion (err, doc) {
               if (err) {
// Wenn es fehlschlägt, Fehler zurückgeben
                   res.send("Beim Hinzufügen der Informationen zur Datenbank ist ein Problem aufgetreten.");
            }
             sonst {
// Wenn es funktioniert hat, stellen Sie den Header so ein, dass in der Adressleiste nicht immer noch /adduser
steht                    res.location("userlist");
// Und weiter zur Erfolgsseite
                    res.redirect("userlist");
            }
});

}
}

Natürlich müssen Sie in einem echten Projekt noch viele Überprüfungen durchführen. Beispielsweise dürfen Benutzernamen und E-Mails nicht wiederholt werden und E-Mail-Adressen müssen bestimmten Formatregeln entsprechen. Aber ignorieren wir das vorerst. Sie können sehen, dass der Benutzer nach Abschluss des Einfügens in die Datenbank zur Benutzerlistenseite zurückspringt, wo er die neu eingefügten Daten sehen sollte.

Ist das der beste Weg?

Schritt 3 – Mit der Datenbank verbinden und Daten schreiben

Stellen Sie sicher, dass Ihr Mongod läuft! Starten Sie dann Ihren Knotenserver neu. Öffnen Sie http://localhost:3000/newuser mit einem Browser. Jetzt geben wir einige Inhalte ein und klicken auf die Schaltfläche „Senden“. Wenn alles gut geht, sollten wir wieder auf der Benutzerlistenseite sein und die neuen Daten sehen, die wir gerade hinzugefügt haben.

Nachdem wir das Lesen und Schreiben der Mongodb-Datenbank mit Node.js, Express und Ejs offiziell abgeschlossen haben, sind wir bereits großartige Programmierer.

Herzlichen Glückwunsch, wirklich. Wenn Sie dieses Tutorial sorgfältig lesen und sorgfältig studieren, anstatt nur den Code zu kopieren, sollten Sie über ein vollständiges Konzept für Routen, Ansichten, das Lesen von Daten und das Schreiben von Daten verfügen. Das ist alles, was Sie wissen müssen, um eine andere vollständige Website zu entwickeln! Egal was du denkst, ich finde es ziemlich cool.

Teil 5 – Nächste Schritte

Starten Sie jetzt und Ihre Möglichkeiten sind endlos. Sie können einen Blick auf Mongoose werfen, ein weiteres Node-Paket für die Arbeit mit MongoDB-Datenbanken. Es ist größer als Monk und verfügt über mehr Funktionen. Sie können sich auch Stylus ansehen, eine CSS-Engine für Express. Sie können das Node Express Mongo-Tutorial googeln, um zu sehen, was folgt. Lerne fleißig und mache jeden Tag Fortschritte.

Ich hoffe, dieses Tutorial kann hilfreich sein. Ich habe es geschrieben, weil ich zu Beginn des Lernens so etwas wirklich brauchte, es aber nicht finden konnte. Wenn Sie es bis hierher geschafft haben, vielen Dank!