NodeJS-Tutorial zum Erstellen eines einfachen Artikels zur Veröffentlichung von system_node.js

Vorwort

Wir werden heute ein einfaches Pressemitteilungssystem erstellen. Die erste Stufe des Systems muss nicht allzu schwierig sein. Es hat hauptsächlich die folgenden Funktionen

① Verwaltung von Nachrichtentypen

② Nachrichtenverwaltung (mit Bild-Upload-Funktion)

③ Durchsuchen von Nachrichten

Obwohl es nicht viele Funktionen gibt, deckt es auch viele grundlegende Vorgänge ab. Das Programm fügt nur Anhänge hinzu, löscht sie, prüft sie und lädt sie hoch, was ausreichend ist. Beginnen wir also noch heute mit unserer Studie

Vorbereitung

Nach den gestrigen Problemen haben wir bereits NodeJS- und MongoDB-Umgebungen. Jetzt können wir direkt neue Projektdateien und Datenbankdateien erstellen

Der erste Schritt besteht darin, die Eingabeaufforderung zu öffnen, zum Laufwerk D zu wechseln und

einzugeben

Code kopieren Der Code lautet wie folgt:

D:>express -e news

Dann baut das System automatisch und problemlos die Grundumgebung auf

Offensichtlich sind viele Modulabhängigkeiten nicht vorhanden. Machen Sie zu diesem Zeitpunkt einfach den Test der gestrigen package.json:

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“: „*“,
„mongodb“: „*“
}
}

Anschließend wechseln Sie in das Projektverzeichnis:

Code kopieren Der Code lautet wie folgt:

nmp install

Nachdem alle abhängigen Dateien heruntergeladen wurden, geben wir

ein

Code kopieren Der Code lautet wie folgt:

D:news>node app
Express-Server überwacht Port 3000

Also lief unser Programm problemlos. Als wir die URL öffneten, stellten wir fest, dass es tatsächlich kein Problem gab

PS: Hier gibt es ein Problem, das Aufmerksamkeit erfordert. Die von uns heruntergeladene Datei ist nicht UTF-8-codiert, daher muss die Dateicodierung möglicherweise von Ihnen vereinheitlicht werden.

Wenn das Programm ausgeführt wird, ist eine datenbankbezogene Konfiguration erforderlich

① Erstellen Sie zunächst einen neuen News-Ordner im MongoDB-Verzeichnis

② Fügen Sie die Konfigurationsdatei „settings.js“ zum Projekt hinzu

Code kopieren Der Code lautet wie folgt:

module.exports = {
cookieSecret: 'myNews',
db: 'news',
Host: 'localhost'
};

③ Erstellen Sie ein neues Modellverzeichnis und eine neue db.js

Code kopieren Der Code lautet wie folgt:

var Settings = require('../settings'),
Db = require('mongodb').Db,
Connection = require('mongodb').Connection,
Server = require('mongodb').Server;
module.exports = new Db(settings.db, new Server(settings.host, Connection.DEFAULT_PORT), {safe: true });

④ Erstellen Sie ein neues news.bat-Programm auf dem Desktop

Code kopieren Der Code lautet wie folgt:

d:mongodbbinmongod.exe -dbpath d:mongodbnews

Um die Datenbank in Zukunft zu starten, müssen wir sie nur noch ausführen. Damit sind unsere vorbereitenden Vorbereitungen im Grunde abgeschlossen

Aber hier gibt es zwei ärgerliche Dinge: Zum einen ist es nervig, die Nachrichtensendung jedes Mal zu starten, und zum anderen muss man neu starten, um etwas zu ändern. Deshalb werden wir diese beiden Probleme hier zuerst lösen

① Erstellen Sie eine neue news_app.bat auf dem Desktop und führen Sie sie später aus, um das Programm zu starten

Code kopieren Der Code lautet wie folgt:

node d:newsapp

② Supervisor ist ein Prozessschutzprogramm. Wir können ihn verwenden, um das Programm neu zu starten und dann unsere node_app.bat anzupassen

Code kopieren Der Code lautet wie folgt:

Supervisor d:newsapp

Natürlich müssen Sie es vorher installieren:

Code kopieren Der Code lautet wie folgt:

npm install -g supervisor

Danach ist nach dem Ändern der Datei kein manueller Neustart erforderlich (news_app muss im Projektverzeichnis abgelegt werden), daher endet die Vorbereitungsarbeit hier

Projektstruktur

Nach dem ersten Schritt müssen wir über die Projektstruktur nachdenken

① Die Startseite ist ein Index, in dem alle Nachrichtentypen und Nachrichtenelemente aufgelistet werden

② Jede Nachricht verfügt über drei Schaltflächen: Bearbeiten/Löschen/Anzeigen

③ Auf der Startseite gibt es eine Schaltfläche zum Hinzufügen von Nachrichten (Sie können beim Hinzufügen Bilder hochladen)

Grundfunktionen sind wie oben

Also haben wir die Routing-Funktion in der App entfernt und alle Routen in den Index aufgenommen

Code kopieren Der Code lautet wie folgt:

//Füge die Routing-Funktion in den Index ein
//app.get('/',routes.index);
//app.get('/users', user.list);
Routen(App);

Code kopieren Der Code lautet wie folgt:

module.exports = Funktion (App) {
//Homepage, jetzt auch die Homepage
app.get('/', Funktion (req, res) {
res.render('index', { title: 'Express' });
});
app.get('/add', function (req, res) {
res.send('News-Anfrage hinzufügen');
});
app.get('/delete', function (req, res) {
res.send('Newsanfrage löschen');
});
app.get('/view', function (req, res) {
res.send('News-Anfrage anzeigen');
});
app.get('/update', function (req, res) {
res.send('Nachrichtenanfrage ändern');
});
};

Der erste Schritt ist so einfach, da das Hinzufügen von Nachrichten eine separate Seite haben sollte und das Klicken auf die Schaltfläche „Hinzufügen“ eine andere Verarbeitung zur Folge hat, sodass jede Anfrage intern aufgeschlüsselt werden muss. Die aktuellen Vorschriften lauten wie folgt:

/ Standardseite, die alle Genres und Nachrichten anzeigt, mit einer Schaltfläche zum Löschen

/add Rufen Sie die Seite zum Hinzufügen von Nachrichten auf

/addNews Nachrichtenspezifische Beitragsanfrageadresse hinzufügen (Antwort beim Klicken auf die Schaltfläche)

/delete Newsanfrage löschen

/spezifische Nachrichtenabfrage anzeigen

Also habe ich die obige Route leicht modifiziert:

Code kopieren Der Code lautet wie folgt:

module.exports = Funktion (App) {
//Homepage, jetzt auch die Homepage
app.get('/', Funktion (req, res) {
res.render('index', { title: 'Express' });
});
app.get('/add', function (req, res) {
res.send('Neuigkeitsseite hinzufügen');
});
app.post('/addNews', function (req, res) {
res.send('Anfrage zum Hinzufügen von Nachrichten wird bearbeitet');
});
app.get('/delete', function (req, res) {
res.send('Newsanfrage löschen');
});
app.get('/view', function (req, res) {
res.send('News-Anfrage anzeigen');
});
};

Wir müssen also mehrere neue Vorlagen erstellen, um unsere Webseiten zu organisieren. Hier trennen wir nicht den Kopf und das Ende, sondern nur die einfachste Seite

Zwei Vorlagendateien hinzugefügt, add und view, die sich vorübergehend genauso verhalten wie index.ejs, und Navigation geändert

Code kopieren Der Code lautet wie folgt:

module.exports = Funktion (App) {
//Homepage, jetzt auch die Homepage
app.get('/', Funktion (req, res) {
res.render('index', { title: 'Express' });
});
app.get('/add', function (req, res) {
res.render('add', { title: 'News-Seite hinzufügen' });
});
app.post('/addNews', function (req, res) {
res.send('Anfrage zum Hinzufügen von Nachrichten wird bearbeitet');
});
app.get('/delete', function (req, res) {
res.send('Newsanfrage löschen');
});
app.get('/view', function (req, res) {
res.render('view', { title: 'News-Anfrage anzeigen' });
});
};

Dies ist das Ende der Projektstruktur

Datenoperation

Nachdem die Gesamtstruktur fertig ist, müssen wir Datenoperationen durchführen:

① Daten hinzufügen (Nachrichten hinzufügen)

② Daten anzeigen (Nachrichten anzeigen)

③ Daten löschen (Nachrichten löschen)

Ursprünglich ging es auch um Typoperationen, aber als ich es tat, konnte ich es nicht herausfinden. Ich lasse es vorerst in Ruhe, weil man beim ersten Mal leicht verwirrt wird

Neuigkeiten hinzufügen

Hier verwenden wir keine Formularübermittlung, wir verwenden Ajax... Hier stellen wir die Zepto-Bibliothek vor, damit unsere Seite so aussieht

Code kopieren Der Code lautet wie folgt:

                                                                                                     

                                                                                               

Titel:

Inhalt: