Express, das weltweit meistgenutzte Node.js-Framework, ermöglicht es Entwicklern, Backend-Webserver mit JavaScript zu erstellen. Dieses Framework bietet das meiste, was Backend-Entwickler brauchen, von Haus aus und vereinfacht das Routing und die Beantwortung von Webanfragen.
Wir haben bereits einen Leitfaden mit allem, was du über Express.js wissen solltest, und dieser praktische Artikel zeigt dir, wie du es benutzen kannst. In diesem Tutorial wird erklärt, wie du eine Node.js-Beispielanwendung mit Express.js erstellst und einsetzt.
Wie du schnell Anwendungen mit Express.js erstellst
Diese Anleitung zeigt dir, wie du eine Webanwendung erstellst, die Anfragen an einen Endpunkt entgegennimmt, einen Parameter der Anfrage für einen Datenbankaufruf verwendet und Informationen aus der Datenbank als JSON zurückgibt.
Voraussetzungen
Um diesem Tutorial zu folgen, musst du sicherstellen, dass du Folgendes auf deinem Computer installiert hast:
- Node.js und Node Package Manager (npm) – Wichtige Laufzeitumgebung und Paketmanager für JavaScript.
- Git – Verteiltes Versionskontrollsystem, das die gemeinschaftliche Softwareentwicklung erleichtert.
Express Anwendungs-Generator
Du kannst Express zu bestehenden Node-Anwendungen hinzufügen, wie in unserem Express.js-Leitfaden beschrieben. Wenn du aber von Grund auf neu anfängst, gibt es eine noch schnellere Möglichkeit: den Express-Generator.
Der offizielle Express-Generator von Express.js ist ein Node-Paket, mit dem du ein neues Anwendungsskelett erstellen kannst. Dazu musst du zunächst einen Ordner für deine Anwendung erstellen und dann den Befehl npx ausführen (verfügbar in Node.js 8.2.0):
mkdir express-application
npx express-generatorNach erfolgreicher Erstellung zeigt das Terminal eine Liste der erstellten Ordner/Dateien sowie Befehle für die Installation von Abhängigkeiten und die Ausführung der Anwendung an. Installiere die Abhängigkeiten, indem du den folgenden Befehl ausführst:
npm installStarte als nächstes deinen Webserver:
DEBUG=myapp:* npm startDie Skelettanwendung hat eine vorgefertigte Index-Route, die eine einfache Homepage darstellt. Du kannst sie in deinem Browser ansehen, indem du localhost:3000 aufrufst.
Erkunden der Skelett-Express-Anwendung
Wenn du deine Express-Anwendung in deinem bevorzugten Code-Editor öffnest, wirst du eine Grundstruktur vorfinden, die das Rückgrat deiner Webanwendung bildet.
/
|-- /node_modules
|-- /public
|-- /routes
|-- index.js
|-- users.js
|-- /views
|-- error.jade
|-- index.jade
|-- layout.jade
|-- app.js
|-- package.json- node_modules: In diesem Verzeichnis werden alle installierten Abhängigkeiten und Bibliotheken für das Projekt gespeichert.
- public: Enthält statische Dateien wie CSS, JavaScript, Bilder usw. Diese Dateien werden direkt an den Browser des Kunden geliefert.
- routes: Hier werden die Dateien gespeichert, die für die Definition verschiedener Routen und die Bearbeitung von Anfragen von verschiedenen URLs zuständig sind.
- views: Enthält Vorlagen oder Ansichten, die der Server rendert, um die Benutzeroberfläche zu gestalten. Hier sind error.jade, index.jade und layout.jade Vorlagen, die in der Jade Templating Language geschrieben wurden. Sie helfen dabei, dynamische Inhalte zu strukturieren und für die Nutzerinnen und Nutzer darzustellen.
- app.js: Diese Datei dient normalerweise als Einstiegspunkt für die Express-Anwendung. Hier wird der Server konfiguriert, die Middleware eingerichtet, die Routen definiert und die Anfragen und Antworten verarbeitet.
- package.json: Diese Datei enthält Metadaten über die Anwendung. Sie hilft bei der Verwaltung von Abhängigkeiten und der Projektkonfiguration.
Die Handhabung von Routen verstehen
In deiner Express-Anwendung werden im routes-Verzeichnis die Routen als separate Dateien definiert. Die primäre Route, oft auch Index-Route genannt, befindet sich in der Datei routes/index.js.
Diese Index-Route bearbeitet eine GET Anfrage und antwortet mit einer vom Framework in HTML generierten Webseite. Der folgende Codeschnipsel veranschaulicht, wie eine GET -Anfrage bearbeitet wird, um eine einfache Willkommensseite zu erstellen:
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('index', { title: 'Express' });
});
module.exports = router;Wenn du die res.render() funktion zu res.send()modifizierst, ändert sich der Antworttyp von HTML zu JSON:
var express = require('express');
var router = express.Router();
router.get('/', function(req, res, next) {
res.send({ key: 'value' });
});
module.exports = router;Um die Möglichkeiten zu erweitern, wird eine weitere Route in dieselbe Datei eingefügt, die einen neuen Endpunkt einführt, der einen Parameter akzeptiert. Dieser Codeschnipsel zeigt, wie deine Anwendung den Datenverkehr an einem anderen Endpunkt verarbeiten, einen Parameter extrahieren und mit seinem Wert in JSON antworten kann:
/* GET a new resource */
router.get('/newEndpoint', function(req, res, next) {
res.send({ yourParam: req.query.someParam });
});Wenn du eine GET Anfrage an localhost:3000/newEndpoint?someParam=whatever sendest, erhältst du eine JSON-Ausgabe, die den String „whatever“ enthält.
Express und Kinsta Anwendungs-Hosting
Webanfragen von deinem Computer an deinen Computer zu stellen, ist toll, aber die Webentwicklung ist erst dann abgeschlossen, wenn du den Localhost verlässt. Zum Glück macht Kinsta die Bereitstellung von Anwendungen im Web einfach, auch wenn du eine Datenbank brauchst.
Jetzt wollen wir die Möglichkeiten deiner Anwendung erweitern, indem wir die Datenbankfunktionalität integrieren und sowohl die Anwendung als auch die Datenbank im Web bereitstellen, sodass du von jedem Computer aus darauf zugreifen kannst.
Bevor du deine Express-Anwendung auf dem Kinsta Anwendungs-Hosting bereitstellst, musst du den Code und die Dateien deiner Anwendung auf den von dir gewählten Git-Anbieter (Bitbucket, GitHub oder GitLab) übertragen. Stelle sicher, dass du eine .gitignore-Datei im Stammverzeichnis deiner Anwendung erstellst und node_modules einfügst, um zu verhindern, dass diese Dateien zu deinem Git-Anbieter übertragen werden.
Sobald dein Repository eingerichtet ist, folgst du diesen Schritten, um deine Express-Anwendung bei Kinsta einzusetzen:
- Logge dich ein oder erstelle ein Konto, um dein MyKinsta-Dashboard zu sehen.
- Autorisiere Kinsta bei deinem Git-Anbieter.
- Klicke in der linken Seitenleiste auf Anwendungen und dann auf Anwendung hinzufügen.
- Wähle das Repository und den Branch aus, von dem aus du die Anwendung bereitstellen möchtest.
- Gib deiner Anwendung einen eindeutigen Namen und wähle einen Standort für das Rechenzentrum.
- Als Nächstes konfigurierst du deine Build-Umgebung. Wähle die Standard-Build-Maschinen-Konfiguration mit der für diese Demo empfohlenen Nixpacks-Option.
- Verwende alle Standardkonfigurationen und klicke dann auf Anwendung erstellen.
Kinsta funktioniert sofort mit dem Express-Anwendungsgenerator! Sobald du diese Schritte abgeschlossen hast, beginnt deine Anwendung automatisch mit dem Build- und Bereitstellungs-Prozess.
Auf dem Bereitstellungsbildschirm wird eine URL angezeigt, unter der Kinsta deine Anwendung bereitstellt. Du kannst /newEndpoint?someParam=whatever anhängen, um den Endpunkt zu testen, der im vorherigen Abschnitt dieses Artikels erstellt wurde.
So fügst du eine Datenbank zur Express-Anwendung hinzu
Für die meisten produktiven Anwendungen ist eine Datenbank unerlässlich. Zum Glück vereinfacht Kinsta diesen Prozess, indem es vollständig verwaltete Datenbankdienste anbietet, die unglaublich einfach einzurichten sind.
Hier erfährst du, wie du eine Datenbank bei Kinsta einrichten kannst:
- Navigiere zum Bereich Datenbanken in der Seitenleiste des MyKinsta-Dashboards.
- Klicke auf Datenbank erstellen. Konfiguriere die Details deiner Datenbank, indem du einen Namen eingibst und den Datenbanktyp auswählst.
- Wähle die Option PostgreSQL. Ein Datenbank-Benutzername und ein Passwort werden automatisch generiert:
Der MyKinsta-Datenbankkonfigurationsschritt zum Hinzufügen einer neuen Datenbank - Wähle denselben Rechenzentrumsstandort, an dem du deine Express-Anwendung gehostet hast, und konfiguriere die gewünschte Größe.
- Bestätige die Zahlungsinformationen und klicke auf Datenbank erstellen.
Sobald die Datenbank erfolgreich erstellt wurde:
- Rufe die Details der Datenbank auf, indem du auf sie klickst. Navigiere auf der Seite Übersicht zum Abschnitt Interne Verbindungen.
- Wähle die entsprechende Anwendung aus.
- Aktiviere die Option Umgebungsvariablen für die Anwendung hinzufügen.
- Klicke auf Verbindung hinzufügen, um die neu erstellte Datenbank mit deiner Anwendung zu verbinden.
Kopiere als Nächstes den Verbindungsstring der neu erstellten Datenbank, um dich mit einem Datenbanktool mit ihr zu verbinden. Jedes SQL-Verbindungstool ist ausreichend, aber in dieser Demonstration wird Beekeeper verwendet. Öffne die Anwendung und klicke auf Von URL importieren, füge den Verbindungsstring ein und klicke auf Importieren. Damit kannst du SQL auf der von Kinsta gehosteten Datenbank ausführen, die du gerade erstellt hast.
Als Nächstes erstellst du eine elementare Tabelle mit einem einzigen Eintrag, indem du mit deinem Datenbanktool einige SQL-Anweisungen gegen die gehostete Datenbank ausführst:
CREATE TABLE "States"
( id integer CONSTRAINT states_pk PRIMARY KEY,
state_name varchar(100),
capital varchar(100),
state_bird varchar(100),
"createdAt" TIMESTAMPTZ NOT NULL DEFAULT NOW(),
"updatedAt" TIMESTAMPTZ NOT NULL DEFAULT NOW()
);
INSERT INTO "States"
VALUES(1, 'ohio', 'columbus', 'cardinal');Füge die folgenden Datenbankpakete zu deinem Projekt hinzu:
npm install sequelize pgDie sequelize ist eine ORM für Node.js, und pg dient als PostgreSQL-Client und ermöglicht die Interaktion zwischen Node.js-Anwendungen und PostgreSQL-Datenbanken.
Als Nächstes schreibst du den Anwendungscode, der eine GET Anfrage mit einem id Parameter annimmt und die Informationen in der Datenbank zurückgibt, die mit diesem id verbunden sind. Ändere dazu deine index.js-Datei entsprechend:
var express = require('express');
var router = express.Router();
const { Sequelize, DataTypes } = require('sequelize');
const sequelize = new Sequelize(process.env.CONNECTION_URI, {
dialect: 'postgres',
protocol: 'postgres',
});
const State = sequelize.define('State', {
// Model attributes are defined here
state_name: {
type: DataTypes.STRING,
allowNull: true,
unique: false
},
capital: {
type: DataTypes.STRING,
allowNull: true,
unique: false
},
state_bird: {
type: DataTypes.STRING,
allowNull: true,
unique: false
},
}, {
// Other model options go here
});
async function connectToDB() {
try {
sequelize.authenticate().then(async () => {
// await State.sync({ alter: true });
})
console.log('Connection has been established successfully.');
} catch (error) {
console.error('Unable to connect to the database:', error);
}
}
connectToDB();
/* GET a new resource */
router.get('/state', async function(req, res, next) {
const state = await State.findByPk(req.query.id);
if (state) {
res.send(state)
} else {
res.status(404).send("state not found");
}
});
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('index', { title: 'Express' });
});
/* GET a new resource */
router.get('/newEndpoint', function(req, res, next) {
res.send({ yourParam: req.query.someParam });
});
module.exports = router;Übertrage die Codeänderungen und lege sie in deinem Git-Repository ab. Stelle sie dann manuell auf Kinsta bereit oder warte auf die automatische Bereitstellung.
Wenn du jetzt den Endpunkt /states mit id=1 abfragst, erhältst du einen Status aus der Datenbank.
Das ist alles, was du wissen musst! Du kannst dir den kompletten Projektcode auf GitHub ansehen.
Zusammenfassung
Dieser Artikel hat gezeigt, wie das Express-Framework das Erstellen und Bereitstellen einer Node.js-Anwendung schnell und einfach macht. Mit dem Express-Generator kannst du in wenigen einfachen Schritten eine neue Anwendung erstellen. Mit Kinstas Anwendungs-Hosting ist die Bereitstellung der Anwendung sehr einfach und erfordert nur minimale Einstellungen.
Die Leistungsfähigkeit und Einfachheit des Express-Frameworks für die Entwicklung von Node.js-Anwendungen ist beachtlich. Mit Kinsta kannst du den Schwung, den Express und Node.js dir geben, in die Bereitstellungsphase deines Projekts mitnehmen, ohne Zeit mit der Konfiguration zu verschwenden.
Was denkst du über den Express-Anwendungsgenerator? Hast du ihn schon einmal zur Entwicklung von Anwendungen genutzt? Teile uns deine Erfahrungen in den Kommentaren unten mit!
Schreibe einen Kommentar