Node.js Express FrameWork-Tutorial – Lernen Sie in 10 Minuten

In diesem Tutorial werden wir das Express-Framework untersuchen. Dieses Framework ist so aufgebaut, dass es als minimales und flexibles Node.js-Webanwendungs-Framework fungiert und einen robusten Satz an Funktionen für die Erstellung ein- und mehrseitiger sowie hybrider Webanwendungen bietet.

Was ist Express.js?

Express.js ist ein Node js-Webanwendungsserver-Framework, das speziell für die Erstellung einseitiger, mehrseitiger und hybrider Webanwendungen entwickelt wurde.

Es ist zum Standard-Server-Framework für node.js geworden. Express ist der Backend-Teil des sogenannten MEAN-Stacks.

Der MEAN ist kostenlos und Open Source JavaSkript Software-Stack zum Erstellen dynamischer Websites und Webanwendungen, der die folgenden Komponenten enthält:

1) MongoDB – Die Standard-NoSQL-Datenbank

2) Express.js – Das Standard-Webanwendungs-Framework

3) Angular.js - Die JavaScript-MVC-Framework für Webanwendungen

4) Node.js – Framework für skalierbare serverseitige und Netzwerkanwendungen.

Das Express.js-Framework macht es sehr einfach, eine Anwendung zu entwickeln, die zur Verarbeitung mehrerer Arten von Anforderungen wie GET-, PUT- und POST- und DELETE-Anforderungen verwendet werden kann.

Express installieren und verwenden

Express wird über den Node Package Manager installiert. Dies kann durch Ausführen der folgenden Zeile in der Befehlszeile erfolgen

npm install express

Der obige Befehl fordert den Node-Paketmanager auf, die erforderlichen Express-Module herunterzuladen und entsprechend zu installieren.

Lassen Sie uns unser neu installiertes Express-Framework verwenden und eine einfache „Hello World“-Anwendung erstellen.

Unsere Anwendung wird ein einfaches Servermodul erstellen, das Portnummer 3000 überwacht. Wenn in unserem Beispiel eine Anfrage über den Browser an dieser Portnummer gestellt wird, sendet die Serveranwendung eine „Hallo Welt“-Antwort an den Client .

Express installieren und verwenden

var express=require('express');
var app=express();
app.get('/',function(req,res)
{
res.send('Hello World!');
});
var server=app.listen(3000,function() {});

Code-Erklärung:

  1. In unserer ersten Codezeile verwenden wir die Funktion require, um das „Express-Modul“ einzubinden.
  2. Bevor wir das Express-Modul verwenden können, müssen wir ein Objekt daraus erstellen.
  3. Hier erstellen wir eine Callback-Funktion. Diese Funktion wird immer dann aufgerufen, wenn jemand zum Stammverzeichnis unserer Webanwendung navigiert http://localhost:3000 . Die Callback-Funktion wird verwendet, um die Zeichenfolge „Hello World“ an die Webseite zu senden.
  4. In der Callback-Funktion senden wir die Zeichenfolge „Hello World“ an den Client zurück. Der Parameter „res“ wird verwendet, um Inhalte an die Webseite zurückzusenden. Dieser „res“-Parameter wird vom „request“-Modul bereitgestellt, um es einem zu ermöglichen, Inhalte an die Webseite zurückzusenden.
  5. Anschließend verwenden wir die Listen-to-Funktion, um unsere Serveranwendung dazu zu bringen, Client-Anfragen auf Port Nr. 3000 abzuhören. Sie können hier jeden verfügbaren Port angeben.

Wenn der Befehl erfolgreich ausgeführt wird, wird die folgende Ausgabe angezeigt, wenn Sie Ihren Code im Browser ausführen.

Ausgang:

Express.js

Aus der Ausgabe,

  • Sie können deutlich erkennen, dass, wenn wir zur URL des lokalen Hosts auf Port 3000 navigieren, auf der Seite die Zeichenfolge „Hallo Welt“ angezeigt wird.
  • Da wir in unserem Code ausdrücklich erwähnt haben, dass der Server Port Nr. 3000 abhört, können wir die Ausgabe anzeigen, wenn wir zu dieser URL navigieren.

Was sind Routen?

Routing bestimmt die Art und Weise, wie eine Anwendung auf eine Clientanfrage an einen bestimmten Endpunkt reagiert.

Beispielsweise kann ein Client eine GET-, POST-, PUT- oder DELETE-HTTP-Anfrage für verschiedene URLs wie die unten gezeigten stellen;

http://localhost:3000/Books
http://localhost:3000/Students

Im obigen Beispiel ist

  • Wenn für die erste URL eine GET-Anfrage gestellt wird, sollte die Antwort idealerweise eine Liste von Büchern sein.
  • Wenn die GET-Anfrage für die zweite URL gestellt wird, sollte die Antwort idealerweise eine Liste von Studenten sein.
  • Basierend auf der URL, auf die zugegriffen wird, wird eine andere Funktionalität auf dem Webserver aufgerufen und dementsprechend die Antwort an den Client gesendet. Dies ist das Konzept des Routings.

Jede Route kann über eine oder mehrere Handlerfunktionen verfügen, die ausgeführt werden, wenn die Route übereinstimmt.

Die allgemeine Syntax für eine Route ist unten dargestellt

app.METHOD(PATH, HANDLER)

Worin,

1) app ist eine Instanz des Express-Moduls

2) METHOD ist eine HTTP-Anfragemethode (GET, POST, PUT oder DELETE)

3) PATH ist ein Pfad auf dem Server.

4) HANDLER ist die Funktion, die ausgeführt wird, wenn die Route übereinstimmt.

Schauen wir uns ein Beispiel an, wie wir Routen im Express implementieren können. In unserem Beispiel werden 3 Routen erstellt

  1. Eine /Node-Route, die die Zeichenfolge „Tutorial on Node“ anzeigt, wenn auf diese Route zugegriffen wird
  2. Eine /Angular-Route, die die Zeichenfolge „Tutorial on Angular“ anzeigt, wenn auf diese Route zugegriffen wird
  3. Eine Standardroute /, die die Zeichenfolge „Willkommen bei Guru99 Tutorials“ anzeigt.

Unser Grundcode bleibt derselbe wie in den vorherigen Beispielen. Der folgende Ausschnitt ist ein Add-on, das zeigt, wie Routing implementiert wird.

Routen in Node.js

var express = require('express');
var app = express();
app.route('/Node').get(function(req,res)
{
    res.send("Tutorial on Node");
});
app.route('/Angular').get(function(req,res)
{
    res.send("Tutorial on Angular");
});
app.get('/',function(req,res){
    res.send('Welcome to Guru99 Tutorials');
}));

Code-Erklärung:

  1. Hier definieren wir eine Route für die URL http://localhost:3000/Node wird im Browser ausgewählt. An die Route hängen wir eine Rückruffunktion an, die aufgerufen wird, wenn wir zur Knoten-URL navigieren. Die Funktion verfügt über zwei Parameter.
  • Der Hauptparameter, den wir verwenden werden, ist der Parameter „res“, mit dem Informationen an den Client zurückgesendet werden können.
  • Der Parameter „req“ enthält Informationen über die gestellte Anfrage. Manchmal können im Rahmen der gestellten Anfrage zusätzliche Parameter gesendet werden. Daher kann der Parameter „req“ verwendet werden, um die gesendeten zusätzlichen Parameter zu finden.
  1. Wir verwenden die Sendefunktion, um die Zeichenfolge „Tutorial on Node“ an den Client zurückzusenden, wenn die Node-Route gewählt wird.
  2. Hier definieren wir eine Route für die URL http://localhost:3000/Angular wird im Browser ausgewählt. An die Route hängen wir eine Rückruffunktion an, die aufgerufen wird, wenn wir zur Angular-URL navigieren.
  3. Wir verwenden die Sendefunktion, um die Zeichenfolge „Tutorial on Angular“ an den Client zurückzusenden, wenn die Angular-Route gewählt wird.
  4. Dies ist die Standardroute, die ausgewählt wird, wenn man zur Route der Anwendung navigiert – http://localhost:3000. Wenn die Standardroute ausgewählt wird, wird die Nachricht „Willkommen bei Guru99 Tutorials“ an den Client gesendet.

Wenn der Befehl erfolgreich ausgeführt wird, wird die folgende Ausgabe angezeigt, wenn Sie Ihren Code im Browser ausführen.

Ausgang:

Routen in Node.js

Aus der Ausgabe,

  • Sie können deutlich sehen, dass, wenn wir zur URL des lokalen Hosts auf Port 3000 navigieren, auf der Seite die Zeichenfolge „Willkommen bei den Guru99-Tutorials“ angezeigt wird.
  • Denn in unserem Code haben wir erwähnt, dass unsere Standard-URL diese Meldung anzeigen würde.

Routen in Node.js

Aus der Ausgabe,

  • Sie können sehen, dass, wenn die URL in /Node geändert wurde, die entsprechende Node-Route gewählt und die Zeichenfolge „Tutorial On Node“ angezeigt wird.

Routen in Node.js

Aus der Ausgabe,

  • Sie können sehen, dass, wenn die URL in /Angular geändert wurde, die entsprechende Node-Route ausgewählt und die Zeichenfolge „Tutorial On Angular“ angezeigt wird.

Beispiel-Webserver mit express.js

Anhand unseres obigen Beispiels haben wir gesehen, wie wir basierend auf dem Routing entscheiden können, welche Ausgabe angezeigt werden soll. Diese Art des Routings wird in den meisten modernen Webanwendungen verwendet. Der andere Teil eines Webservers betrifft die Verwendung von Vorlagen in Node js.

Beim Erstellen schneller On-the-Fly-Node-Anwendungen besteht eine einfache und schnelle Möglichkeit darin, Vorlagen für die Anwendung zu verwenden. Auf dem Markt sind viele Frameworks zum Erstellen von Vorlagen verfügbar. In unserem Fall nehmen wir das Beispiel des Jade-Frameworks für die Vorlagenerstellung.

Jade wird über den Node Package Manager installiert. Dies kann durch Ausführen der folgenden Zeile in der Befehlszeile erfolgen

npm install jade

Der obige Befehl fordert den Node-Paketmanager auf, die erforderlichen Jade-Module herunterzuladen und entsprechend zu installieren.

Anmerkungen: In der neuesten Version von Node ist Jade veraltet. Verwenden Sie stattdessen Mops.

Lassen Sie uns unser neu installiertes Jade-Framework verwenden und einige grundlegende Vorlagen erstellen.

Schritt 1) Der erste Schritt besteht darin, eine Jade-Vorlage zu erstellen. Erstellen Sie eine Datei mit dem Namen index.jade und fügen Sie den folgenden Code ein. Stellen Sie sicher, dass Sie die Datei im Ordner „views“ erstellen

Beispiel-Webserver mit Express.js

  1. Hier geben wir an, dass der Titel der Seite in den Wert geändert wird, der beim Aufruf dieser Vorlage übergeben wird.
  2. Wir geben außerdem an, dass der Text im Header-Tag durch den Text ersetzt wird, der in der Jade-Vorlage übergeben wird.

Beispiel-Webserver mit Express.js

var express=require('express');
var app=express();
app.set('view engine','jade');
app.get('/',function(req,res)
{
res.render('index',
{title:'Guru99',message:'Welcome'})
});
var server=app.listen(3000,function() {});

Code-Erklärung:

  1. Das erste, was in der Anwendung angegeben werden muss, ist die „Ansichts-Engine“, die zum Rendern der Vorlagen verwendet wird. Da wir zum Rendern unserer Vorlagen Jade verwenden werden, geben wir dies entsprechend an.
  2. Die Renderfunktion wird zum Rendern einer Webseite verwendet. In unserem Beispiel rendern wir die Vorlage (index.jade), die zuvor erstellt wurde.
  3. Wir übergeben die Werte „Guru99“ und „Welcome“ an die Parameter „title“ bzw. „message“. Diese Werte werden durch die in der index.jade-Vorlage deklarierten Parameter „title“ und „message“ ersetzt.

Wenn der Befehl erfolgreich ausgeführt wird, wird die folgende Ausgabe angezeigt, wenn Sie Ihren Code im Browser ausführen.

Ausgang:

Beispiel-Webserver mit Express.js

Aus der Ausgabe,

  • Wir können sehen, dass der Titel der Seite auf „Guru99“ und die Kopfzeile der Seite auf „Willkommen“ gesetzt wird.
  • Dies liegt an der Jade-Vorlage, die in unserer Node-JS-Anwendung aufgerufen wird.

Zusammenfassung

  • Das Express-Framework ist das am häufigsten verwendete Framework für die Entwicklung von Node-JS-Anwendungen. Das Express-Framework basiert auf dem node.js-Framework und hilft bei der schnellen Entwicklung serverbasierter Anwendungen.
  • Routen werden verwendet, um Benutzer basierend auf der gestellten Anfrage zu verschiedenen Teilen der Webanwendungen umzuleiten. Die Reaktion für jede Route kann unterschiedlich sein, je nachdem, was dem Benutzer angezeigt werden muss.
  • Mithilfe von Vorlagen können Inhalte effizient eingefügt werden. Jade ist eine der beliebtesten Template-Engines, die in Node.js-Anwendungen verwendet werden.