Node.js installieren und einen Webserver starten

tutorial

In diesem Tutorial geht es darum, einen einfachen Webserver auf Node.js-Basis zu installieren und zu testen. Dieses Tutorial ist im Rahmen der Summer Schools in Bremen (Informatica Feminale) und Salzburg (ditact) entstanden.

Was ist Node.js? Was ist npm?

Node.js ist eine Softwareumgebung für Javascript, welche es u.a. ermöglicht, serverseitige Javascript-Anwendungen (-> Webserver) auf einem beliebigen Betriebssystem zu programmieren.

Wofür brauchen wir npm? Mit dem Node Package Manager (npm) können wir die Kernfunktionalität von Node.js über Zusatzpakete erweitern. Entwickler_innen aus der ganzen Welt stellen ihre Pakete dort kostenlos zur Verfügung.

Los geht's!

Node.js installieren

Windows 7/8/10

Für Windows stellt die offizielle Node.js-Website für die jeweiligen Versionen Node.js als Download zur Verfügung: https://nodejs.org/en/download/. Lade die richtige Datei (.msi) herunter und starte den Installer mit einem Doppelklick. Der Wizard wird dich durch den sehr kurzen Installationsprozess begleiten. Wähle während der Installation die Standardeinstellungen. npm wird hier glücklicherweise gleich mitinstalliert.

MacOS

Über die offizielle Node.js-Website kannst du den Installer (.pkg) für Node.js herunterladen: https://nodejs.org/en/download/. Starte den Installer über deinen Mac und befolge die (kurzen) Installationsanweisungen. Wähle während der Installation die Standardeinstellungen. npm wird hier glücklicherweise gleich mitinstalliert.

Linux/Ubuntu

In Ubuntu kann Node.js über die Paketverwaltung installiert werden. Da npm nicht automatisch mitinstalliert wird, holen wir dies manuell nach.

sudo apt-get install nodejs
sudo apt-get install npm

Mit dem Terminal arbeiten / Die Installation von Node.js und npm prüfen

Mit dem Terminal können wir unser Betriebssystem textbasiert steuern. Häufigster Vorbehalt gegen das Terminal ist, dass es komplex und damit schwierig zu erlernen sei. Für einige Aufgaben ist er jedoch sehr gut geeignet, weswegen wir für dieses Tutorial / den Kurs ein wenig damit arbeiten werden. Öffne das Terminal (= Kommandozeile oder CLI oder Konsole) deines Betriebssystems:

  • In Windows 8 und 10 geht das mit einem Klick mit der rechten Maustaste unten links im Bildschirm auf das Windows-Symbol oder mit der Tastenkombination [Windows] und [X]. Danach muss die "Eingabeaufforderung" oder die "Eingabeaufforderung (Administrator)" aus der Liste ausgewählt werden.
  • In Windows 7 klickst du auf das Windows-Symbol links unten und suchst unter "Dateien/Programme durchsuchen" nach "Eingabeaufforderung".
  • In vielen Linux-Distributionen öffnet sich das Terminal durch die Tastenkombination [Strg] + [Alt] + [T].
  • Auf MacOS führt die Tastenkombination [cmd] + [Leertaste] zur Spotlight-Suche. Dort kann nach "Terminal" gesucht und dieser ausgeführt werden.

Nun prüfen wir, ob auf unserem Betriebssystem Node.js und npm korrekt installiert wurden. Das geht mit den Terminal-Befehlen

npm -v

Im besten Fall informiert dich dein Betriebssystem nun darüber, ob und in welcher Version Node.js und npm installiert sind. Falls eine Fehlermeldung erscheint, solltest du den Installationsvorgang wiederholen.

Den Webserver einrichten / Express.js installieren

  • Lege auf deinem Computer einen Ordner an, in dem du während des Kurses arbeiten möchtest. Den Ort kannst du beliebig festlegen.
  • Innerhalb dieses Ordners lege zwei neue Dateien an (in Windows z. B. per Rechtsklick: "Neues Textdokument")!
  • Benenne eine Datei um in "server.js", die andere in "index.html". (In Windows solltest du sicher gehen, dass sich die Dateiendung mitändert, und nicht etwa eine Datei nach dem Schema "server.js.txt" und "index.html.txt" entstanden ist!)
  • Navigiere im Terminal zum neu angelegten Ordner. Der Befehl dazu lautet "cd" gefolgt vom entsprechenden Pfad. Für ein Windows-System könnte der Befehl so lauten:

cd C:\Users\Ulrike\Projekte\Neues-Projekt1

  • Für ein macOS-System wäre dies ein Beispiel-Befehl:

cd /Volumes/PROJECTS/Neues-Projekt1

  • Wenn du erfolgreich warst, wird der Pfad, in dem du dich nun befindest, der neuen Kommandozeile voran gestellt.
  • Installiere in diesem Ordner das npm-Paket "Express.js", den de-Facto-Standard für Webanwendungen unter Node.js mit dem Terminal-Befehl

npm install express

  • Öffne die Datei "server.js" in einem Texteditor (z. B. "Sublime") und füge diesen Quellcode ein: 
    const express = require('express');
const app = express();

app.use(express.static(__dirname + '/dist'));

app.get('/', function (req, res) {
res.sendFile(__dirname + '/index.html');
})

app.get('/about', function (req, res) {
res.sendFile(__dirname + '/about.html');
})

app.listen(3000);
console.log("server started on port 3000");
  • Öffne die Datei "index.html" und füge einen beliebigen Text ein, z. B. "Hello World!". Optional kannst du eine weitere Datei "about.html" erstellen und diese mit Leben füllen.
  • Jetzt müssen wir unseren Webserver nur noch starten. Im Quellcode haben wir ihn bereits angewiesen, die Datei _index.html _auszugeben.

Den Webserver starten

Prüfe noch einmal, ob du dich in deinem Terminal im richtigen Dateipfad befindest. Wenn ja, gib ins Terminal den folgenden Befehl ein:

node server.js

Navigiere in deinem Browser zur URL http://127.0.0.1:3000/ oder http://localhost:3000/. Wenn alles geklappt hat, wird dort nun der Inhalt des von dir angelegten HTML-Dokuments angezeigt, also z. B. "Hello World".

In diesem Beispiel-Tutorial übernimmt unser Server das Handling der Routen (z. B. /about) für uns. Wir könnten den Server auch noch weitere Aufgaben erfüllen lassen, z. B. die Anbindung einer Datenbank.

Den Webserver stoppen

Den gestarteten Webserver kannst du jederzeit wieder stoppen. Dann ist er nicht mehr unter der URL http://127.0.0.1:3000/ erreichbar. Im Terminal musst du dazu lediglich [Strg] + [C] bzw. [Ctrl] + [C] drücken.

Scroll