SlideShare ist ein Scribd-Unternehmen logo
1 von 82
Einstieg in Node.js
Für .NET-Entwickler mit Visual Studio Code und
TypeScript
Gregor Biswanger | Freier Dozent, Berater, Trainer und Autor
about.me/gregor.biswanger
Über mich
 Freier Dozent, Berater und Trainer
 Schwerpunkte Softwarearchitektur, XAML, Web
und Cross-Plattform Entwicklung
 Technologieberater für die Intel Developer Zone
 Sprecher auf Konferenzen und User Groups
 Programmverantwortlicher bei der DWX 17 für
den Cross-Platform- und Web-Backend-Day
 Freier Autor für heise.de, dotnetpro,
WindowsDeveloper und viele weitere
Fachmagazine
 Video-Trainer bei video2brain und Microsoft
Gregor Biswanger
Microsoft MVP, Intel Black Belt &
Intel Software Innovator
cross-platform-blog.de
about.me/gregor.biswanger
Was ist Node.js? Wir lüften das Geheimnis
Was ist Node.js?
 Node.js ist eine serverseitige Plattform zum
Betrieb von Netzwerkanwendungen.
Insbesondere lassen sich Webserver damit
realisieren.
 JavaScript kann außerhalb vom Browser genutzt
werden
 Basiert auf der JavaScript-Laufzeitumgebung
„V8“ (Google Chrome).
 Läuft unter Windows, Linux und Mac OSX
 In C, C++ und JavaScript geschrieben.
 Flexibles Modulsystem (NPM).
 Ideal für viele gleichzeitige I/O Verbindungen.
Download
Nodejs.org
Der Papa von Node.js
 Ryan Dahl
 Gesponsert von der Firma Joyent
 Spezialisiert für Virtualisierung und
Cloud Computing
Das Geburtsjahr von Node.js: 2009
 Ryan Dahl startete am 16.02.2009 mit
dem Node-Projekt
 Ihm wurde dann 2011 auf der Oscon
Konferenz, der O’Reilly Open Source
Award verliehen
 InfoWorld hat Node.js im August 2011
mit dem Bossie Award für beste Open-
Source-Software in der Kategorie
„Entwicklertools“ ausgezeichnet
Top Rockstars auf GitHub
 Auf Platz 2 (Stand: 2012)
 831 Entwickler
 Über 300 Releases
 Über 1.500 Beobachter
 Über 19.000 Stars
 Über 2.400 Forks
Cross-Plattform Desktop Software mit Node.js
 Für den Desktop mit NW.JS oder Electron
 Node.js wird auf dem Client bereitgestellt
 https://github.com/nwjs/nw.js/wiki/List-of-
apps-and-companies-using-nw.js
JavaScript für Internet der Dinge (IoT)
 Das Linux Derivat Yocto bietet mit Node.js die
Möglichkeit auf Hardware zuzugreifen und
einen Web-Server zu Hosten
 Verwendet vor allem vom Intel Galileo Board
und Intel Edison
 Zur Entwicklung dient dann das Intel XDK IoT
Edition
 Das ebenfalls das Node-Webkit nutzt
 Kostenloses Video auf Channel 9 meinerseits:
 https://channel9.msdn.com/Blogs/TechTalk/Episode
-53-IoT-Development-mit-Intel-Galieo--Edison-
und-Nodejs
Node.js nur ein Hype?
 Der Technologieradar von ThoughtWorks bewertet Node.js
als eine ausgereifte und bewährte Technologie, die für den
Unternehmenseinsatz geeignet ist.
 Quelle (Januar 2014):
 http://www.thoughtworks.com/de/radar/
Bekannte Webseiten, die auf Node.js laufen
 Trello
 WordPress.com
 Walmart.com
 LinkedIn
 Yahoo
 (Für einige Services)
 Google
 (Für einige Services)
 Microsoft
 (Yammer)
 (Azure Mobile Services)
 Mozilla
 TheNewYorkTimes
 GitHub (Für Downloads)
 Uvm.
Quellen:
https://github.com/nodejs/node-v0.x-archive/wiki/Projects,-Applications,-and-Companies-Using-Node
https://www.quora.com/What-are-the-biggest-websites-built-with-Node-js-on-the-server-side
https://de.wikipedia.org/wiki/Node.js
Ein Erfahrungsbericht von PayPal
 5 Entwickler starteten im Januar mit Java eine Web-App zu
programmieren
 Verwendeten das Spring Framework
 In März starteten 2 Entwickler mit Node.js eine Web-App zu
programmieren
 Kraken.js, express und dust.js
 Im Juni hatten beide Applikationen die gleiche Funktionalität
 Der Node.js Entwicklungserfolg in Zahlen:
 Mit weniger Entwicklern, fast doppelt so schnell programmiert
 Es wurde circa 33% weniger Code benötigt
 Mit circa 40% weniger Dateien aufgebaut
Quelle: https://www.paypal-engineering.com/2013/11/22/node-js-at-paypal/
Ein Erfahrungsbericht von WordPress
Quelle: https://developer.wordpress.com/2015/11/23/the-story-behind-the-new-wordpress-com
Der erste Web-Server Platz frei für „Hallo Welt“
Der Berühmte „Hallo Welt“ Node.js Web-Server
 Starten in der Konsole mit dem Befehl
node datei.js
 Das Tool Nodemon kann Änderungen
der Datei erkennen und Node
automatisch neustarten
 npm install nodemon –g
 nodemon datei.js
var http = require('http');
http.createServer((request, response) => {
response.writeHead(200, {
'Content-Type': 'text/html'
});
response.write('Hallo Welt');
response.end();
}).listen(3000);
Wie funktioniert
Node.js?
Ein Blick auf die Architektur
Basiert auf eine Ereignisgesteuerte Architektur
 Auch bekannt als Event-driven
Architecture
 Spart somit Ressourcen, was eine
besonders große Anzahl gleichzeitig
bestehender Netzwerkverbindungen
ermöglicht
Node.js Architektur
Node.js
Node.js Core Library (JavaScript)
Node.js Bindings (C++)
Google V8 (C++) Libuv (C)
(Früher Libev & Libeio)
var fs = require('fs');
fs.readFile('Hallo.txt', 'utf8', function(err, contents) {
console.log(contents);
});
console.log('after calling readFile');
after calling readFile
Ausgabe
myFile.js
Hallo Welt von Hallo.txt!
1 Thread
1 Neuer Thread zur System-APIAsynchrone Antwort von der System API
JavaScript Architektur – Call Stack
Call Stack function multiply(a, b) {
return a * b;
}
function square(n) {
return multiply(n, n);
}
function printSquare(n) {
var squared = square(n);
console.log(squared);
}
printSquare(4);
16
Ausgabe
main()
printSquare(4)
square(4)
multiply(4, 4)
console.log(..)
JavaScript Architektur – Call Stack
Call Stack function foo() {
return foo();
}
foo();
main()
foo()
foo()
foo()
foo()
foo()
foo()
foo()
JavaScript Architektur – Event Loop
Call StackJS Engine API
Task Queue
console.log("Hello");
setTimeout(function callback() {
console.log("World");
}, 0);
console.log("Ohh!");
Hello
AusgabeEvent Loop
main()
console.log("Hello")
Ohh!
World
setTimeout(callback)console.log("Ohh!")
callback
timer
callback
callback()
console.log("World")
Node.js Architektur – Event Loop
Node.js
Node.js Core Library (JavaScript)
Node.js Bindings (C++)
Google V8 (C++)
var fs = require('fs');
fs.readFile('Hallo.txt', 'utf8', function(err, contents) {
console.log(contents);
});
console.log('after calling readFile');
after calling readFile
Ausgabe
myFile.js
Hallo Welt von Hallo.txt!
1 Thread
1 Neuer Thread zur System-APIAsynchrone Antwort von der System API
Call StackTask Queue
callback
main()
require("fs")fs.readFile(..)console.log("after..")
callback(err, contents)
console.log("contents")
Event
Loop
Libuv (C)
Thread Pool
Klassische Web-Server (Apache, Tomcat, IIS…)
Clients Web-Server Backend
DB
Betriebssystem
Dateien
Dienste
Request
Request
Request
Request
Thread 1
Thread 2
Thread 3
Thread 4
Request
Request
Request
Response
ResponseResponse
ThreadPool
Response
Response
Response
Response
Klassische Web-Server - Request/Response Model
 Clients senden eine Anfrage zum Web-Server.
 Web-Server stellt intern eine begrenzte Anzahl
von Thread-Pools zum Verarbeiten der Client-
Anfragen.
 Der Web-Server läuft in einer Endlos-Schleife
und wartet auf Client-Anfragen.
 Wenn der Web-Server eine Anfrage entgegen
nimmt:
 Wird für die Anfrage ein Thread erzeugt
 Die Anfrage wird dem Thread zugeordnet
 Der Thread kümmert sich um die Verarbeitung
der Anfrage
 Der Thread sendet die verarbeitete Antwort
zurück an den Web-Server
 Der Web-Server sendet diese Antwort an den
jeweiligen Client
Node.js Web-Server
Clients Web-Server Backend
DB
Betriebssystem
Dateien
Dienste
Request
Request
Request
Request
Response
Response
Response
Response
Request
Event Loop
Single Threaded
Event Queue
Non-Blocking
IO Tasks
Node.js internal
Thread Pool
Thread 1
Thread 2
Request Request
Request Request
Request
Response
Request
Thread 3
Response
RequestResponeResponse
Node.js Web-Server - Single-Threaded Event Loop Model
 Clients senden eine Anfrage zum Web-Server.
 Node.js Web-Server stellt intern eine begrenzte Anzahl von Thread-Pools zum Verarbeiten der Client-
Anfragen.
 Node.js Web-Server empfängt die Anfragen und stellt sie in eine Warteschlange (Event Queue).
 Node.js Web-Server hat intern eine Komponente, die als „Event-Loop“ bekannt ist. Diese läuft in einer
Schleife um Anfragen zu empfangen und zu verarbeiten.
 Der Event-Loop läuft unter einem Thread und ist das Herz von Node.js.
 Bei jedem Durchlauf der Schleife, wird der Event Queue auf Anfragen überprüft.
 Wenn eine Anfrage im Event Queue liegt, wird diese genommen:
 Der Code der Anfrage wird sofort verarbeitet
 Wenn der Code keine blockierenden I/O-Operationen erfordert, wird er bis zum Ende
ausgeführt und die Antwort sofort an den Client zurückgesendet
 Wenn blockierende I/O-Operationen vorhanden sind, wie zum Beispiel eine Interaktion mit der
Datenbank, Dateisystem oder Diensten, dann folgt ein anderer Ansatz:
 Überprüfung ob interne Threads verfügbar sind.
 Anfrage wird einem Thread zugewiesen
 Der Thread verarbeitet die gewünschte Anfrage
 Der Thread sendet die Antwort zurück zur Event-Loop
 Falls die Event-Loop frei ist, wird die Antwort durch sie sofort an den Client gesendet
 Andernfalls wird die Antwort zum Event Queue auf die Warteschlange gelegt und zum nächst
möglichen Zeitpunkt von der Event-Loop an den Client gesendet
Was hat diese Arbeitsweise für Vorteile in Node.js?
 Ryan Dahl (der Entwickler von Node.js) hat dafür einmal
folgendes Beispiel genutzt:
„Man stelle sich vor, ein ausgeführtes Programm, ist eine Person, die bei sich im Büro am Schreibtisch
arbeitet. Benötigt das Programm Informationen aus dem Level2-Cache, entspricht das in etwa dem
Öffnen der Schreibtischschublade in dem die Informationen liegen. Für Daten aus dem RAM muss man
schon von seinem Platz aufstehen, zur gegenüberliegenden Seite des Büros laufen und die Informationen
dort aus einem großen Aktenschrank rausholen und sich wieder an seinen Platz begeben.
Greift man hingegen auf Daten von der Festplatte zu, steht man auf, verlässt das Büro und das Gebäude,
setzt sich in ein Taxi, fährt zum Flughafen, nimmt die nächste Maschine nach Tokio, holt dort die
Informationen ab und fliegt wieder zurück.“
Die Kosten von I/O Operationen
I/O Quelle CPU Cycles
L1-Cache* 3
L2-Cache* 14
RAM 250
Festplatte 41.000.000
Netzwerk 240.000.000
* Im Hardwarebereich weisen vor allem moderne CPUs zwei oder drei Cacheebenen auf; sonstige Geräte besitzen meist nur
eine Cacheebene.
Im Softwarebereich wird meist nur eine Cacheebene benutzt, eine prominente Ausnahme bilden Webbrowser, die zwei Ebenen
nutzen (Arbeitsspeicher und Festplattenlaufwerk).
Quelle: Wikipedia
Node.js bei PayPal
Quelle: https://www.paypal-engineering.com/2013/11/22/node-js-at-paypal/
Performance Unterschiede
Quelle: http://www.hostingadvice.com/blog/comparing-node-js-vs-php-performance
Performance Unterschiede
Quelle: http://mikaelkoskinen.net/post/asp-net-web-api-vs-node-js-benchmark-take-2
Vor- und Nachteile vom Node.js Web-Server
Gut
 Hohe Performance
 Skalierbar
 JSON-API per Default und leichtgewichtig
 Streaming - Videofilme können schon beim Hochladen
beim Server in ein anderes Format transkodiert werden
 Web-Echtzeit durch Web-Sockets Unterstützung
Schlecht
 Rechenintensive Anwendungen die eine hohe CPU
Auslastung beanspruchen
Zusammenfassung
 Node.js verwendet die Single-Threaded Event Loop Model Architektur
 Node.js-Anforderungen waren von beginn an auf Performance und
Skalierbarkeit ausgelegt
 JavaScript für Server und Client
 Nur eine Sprache muss beherrscht werden können
 Namenhafte Unternehmen setzen bereits erfolgreich auf Node.js
Das Modulsystem Dependency Management
CommonJS Module Spezifikation
 CommonJS, kurz CJS, ist eine Initiative, die es sich zum
Ziel gesetzt hat Spezifikationen/API’s für JavaScript zu
definieren
 http://wiki.commonjs.org/wiki/CommonJS
 Damit existierender Code wiederverwendet werden
kann, wurde das Module-System entwickelt
 Vergleichbar mit Assemblies/Namespaces unter .NET
 Einfache Syntax
 Entworfen für synchrones Laden von JavaScript-Dateien
ohne Script-Tag (asynchron geht auch)
 Kann zum Beispiel auch komplilieren (CoffeeScript)
 Wird unter Node.js, CouchDB und Titanium Mobile
verwendet
 Für JavaScript im Browser gibt es ab ECMAscript 6 die
Asynchronous Module Definition (AMD)
JS-Datei JS-Datei
CommonJS
(Mediator)
Modul A Modul B
Code Code
Ein Modul hat seinen eigenen Kontext (Scope)
 Auf Objekte, Funktionen oder Variablen von anderen
Modulen kann dabei nicht zugegriffen werden
 Es sei denn, ein anderes Modul wird mittels "require()"
geladen
 Vergleichbar mit using aus .NET
 Erstellt man innerhalb von einem Modul eine Variable, so
ist diese innerhalb von diesem Modul privat und nicht im
globalen Kontext verfügbar
 Ein Modul muss dabei nicht zwingend eine Datei sein.
Theoretisch könnte das Modul zum Beispiel auch aus
einer Datenbank stammen. In der Praxis ist dies jedoch
eine Datei.
 Der String, der das Modul identifiziert, entspricht dem
Pfad zur jeweiligen Datei, wobei auf die Dateiendung ".js"
verzichtet wird.
var foo = require('./foo');
foo.bar()
Inhalte vom Modul öffentlich stellen
 Innerhalb eines Moduls existiert eine
spezielle Variable "module.exports",
um innerhalb von einen Modul Variablen,
Objekte oder Funktionen nach außen
verfügbar zu machen
 Alles was dieser Variable zugewiesen
wird, ist später über das Modul
erreichbar
module.exports.sayHello =
() => console.log(„Hello“);
Module sind statisch
 Immer wenn ein Modul eingebunden wird, wird dieses
nicht neu geladen oder neu ausgeführt
 Es behält daher immer seinen Status
Node.js Core Module
 Node.js besitzt bereits Basis-Module die fest
in die Umgebung integriert sind
 Es können auch weitere Module
nachinstalliert, oder gar selbst geschrieben
werden
 Alle Core Module sind Funktions-
Biblioteken, die grundlegende Aufgaben wie
z.B. den Umgang mit dem Betriebssystem,
Netzwerk-Technologien oder
Verschlüsselungen abdecken
 Core Module Dokumentation
 https://nodejs.org/api/
var os = require('os');
var platform = os.platform();
console.log(platform);
Module mit
TypeScript
Support für CommonJS
Konfiguration für CommonJS-Support
 TypeScript unterstützt CommonJS
 In der tsconfig.json-Datei muss
diese Unterstützung explizit aktiviert
werden
 Wichtig! Das Verzeichnis
node_modules sollte ignoriert werden
{
"compilerOptions": {
"module": "commonjs",
"sourceMap": true
},
"exclude": [
"node_modules"
]
}
tsconfig.json
Das Require mit TypeScript
 Soll eine externe TS-Datei mittels
require geladen werden, oder
existiert für das zu ladende Modul eine
Type Definitions-Datei, wird die
Instanz mittels import anstatt
var/let vorgenommen
 Falls nichts von beiden vorhanden sein
sollte, verwendet man weiterhin
var/let
import http = require('http');
Einfacher Export mit TypeScript
 Einfach die freigebende Klasse mit
export deklarieren
 Es wird keine zusätzliche module
Deklaration benötigt
export class Foo() {
...
Node Package
Manager
Libraries auf Bestellung und noch
mehr!
Node Package Manager
 Der Node Package Manager (npm) ist ein
Paketmanager für die JavaScript-
Laufzeitumgebung node.js
 Wird bei der node.js Installation
bereitgestellt
 Unter .NET ist es vergleichbar mit NuGet
 Ende Januar 2016 enthielt das Repositorium
knapp 236.209 Pakete
 Ende Januar 2016 enthielt NuGet zum
Vergleich 49.781 Pakete
 https://www.npmjs.com
Konsolen-Anwendung
npm
Die Package.json
 Diese enthält wichtige Metadaten zum
eigenen Projekt/Modul
 Vereinfacht die Arbeit im Team und beim
Deployen
 Skripte können hinterlegt werden
 Für Tests und Tasks
 Installierte Module können registriert
werden
Package.json Erstellen
npm init
{
"name": "helloworld",
"version": "1.0.0",
"description": "my first package.json file",
"main": "index.js",
"scripts": {
"test": ""
},
"author": "Gregor Biswanger",
"license": "ISC"
}
Package.json
Ein Paket installieren
 Ein Paket wird über die Konsole installiert
 Beim Installieren werden deren Paket-
Abhängigkeiten ebenfalls installiert
 Die Pakete werden immer in ein
Standardverzeichnis installiert
 node_modul
 Wenn bei require kein Pfad im String
eingegeben wird, sucht CommonJS
automatisch im node_modul nach dem
gewünschten Modul
Paket installieren
npm install Paketname
npm install [Verzeichnis mit Paket]
Ein Paket installieren und registrieren
 Die Package.json kann sich installierte
Pakete merken
 Es wird zwischen „Benötigt zur Produktion“
und „Benötigt zur Entwicklungszeit“
unterschieden
 Das hilft beim Deployement, nur die wirklich
relevanten Module zu installieren
 Versionsverwaltungen können so schlanker
gehalten werden und es werden Konflikte
bei Updates verhindert
 Die .ignoregit-Datei sollte dann folgende
Zeile beinhalten: node_modules/ Paket installieren und Registrieren
npm install Paketname --save
npm install Paketname --save-dev
{
"name": "helloworld",
"version": "1.0.0",
"description": "my first package.json file",
"main": "index.js",
"scripts": {
"test": ""
},
"author": "Gregor Biswanger",
"license": "ISC",
"dependencies": {
"underscore": "^1.8.3"
},
"devDependencies": {
"gulp": "^3.9.0"
}
}
Package.json
Regeln zur Paketversionierung
 ^1.8.3 (1.x.x)
 Hauptversion bleibt konstant, weitere Hauptrevision
werden installiert, wenn verfügbar
 ~1.8.3 (1.8.x)
 Updatet nur eine Minor Version höher, wenn
verfügbar
 1.8.3
 Bleibt konstant die gleiche Version
 <1.8.3 oder <=1.8.3
 Kleiner als die definierte Version oder kleiner bzw.
gleich der definierten Version
 >1.8.3 oder >=1.8.3
 Größer als die definierte Version oder größer bzw.
gleich der definierten Version
{
...
"dependencies": {
"underscore": "^1.8.3"
},
"devDependencies": {
"gulp": "^3.9.0"
}
}
Package.json
Registriere Pakete installieren
 Wenn innerhalb im Projekt npm
install aufgerufen wird, werden alle
registrieren Pakete unter dependencies
der Package.json installiert
 Mit einem zusätzlichen
production-Attribut werden alle
devDependencies installiert
Paket installieren im Projektverzeichnis
npm install
npm install -production
Ein Paket Global installieren
 Pakete stehen für alle Projekte zur
Verfügung
 Hauptsächlich sind das Pakete, die zur
Entwicklungszeit benötigt werden
 Zum Beispiel TypeScript, Grunt oder Gulp
 Pfad der globalen Pakete unter Windows:
 C:UsersGregorAppDataRoamingnpmnode_modules
Paket Global installieren
npm install Paketname -g
Scripte hinter Standard-Scripte festlegen
NPM Unterstützt ein Script-Property innerhalb der package.json, für folgende Scripts:
 prepublish Wird ausgeführt BEVOR ein Paket veröffentlicht wird
 publish, postpublish Wird ausgeführt NACH dem veröffentlichen eines Pakets
 preinstall Wird ausgeführt BEVOR ein Paket installiert wird
 install, postinstall Wird ausgeführt NACH dem ein Paket installiert wurde
 preuninstall, uninstall Wird ausgeführt BEVOR ein Paket uninstalliert wird
 postuninstall Wird ausgeführt NACH dem ein Paket uninstalliert wurde
 preversion, version Wird ausgeführt BEVOR ein Paket höher versioniert wird
 postversion Wird ausgeführt NACH dem ein Paket höher versioniert wurde
 pretest, test, posttest Wird ausgeführt bei npm test
 prestop, stop, poststop Wird ausgeführt bei npm stop
 prestart, start, poststart Wird ausgeführt bei npm start
 prerestart, restart, postrestart Wird ausgeführt bei npm restart. Hinweis: Laufende Scripts werden dabei nicht beendet.
Script starten
npm Scriptname
{
"name": "helloworld",
"version": "1.0.0",
"description": "my fir..",
"main": "index.js",
"scripts": {
"start": "node index.js"
},
...
Package.json
Eigene Scripte festlegen
Script starten
npm run Scriptname
{
"name": "helloworld",
"version": "1.0.0",
"description": "my fir..",
"main": "index.js",
"scripts": {
"tsc": "tsc"
},
...
Package.json
 Es können auch eigene Scripte hinterlegt werden
 Diese werden durch den zusätzlichen run Befehl
ausgeführt
 Kombinationen von unterschiedlichen Tasks mit
nur einem Befehl, sind mit der Erweiterung
concurrently möglich
1. npm install concurrently --save-dev
2. "start": "concurrent "npm run tsc" "npm test"
Express.js
 Ein Web Application Framework für node.js
 Inspiriert vom Sinatra-Framework (Ruby)
 Es erweitert Node.js um Werkzeuge, mit denen das
Entwickeln moderner Webanwendungen einfacher
gestaltet wird
 Vergleichbar mit der Microsoft Web-API
(Nur besser )
 Kommunikation mit REST (HTTP) per Standard
 Request/Response-Handling
 Routing
 View Templating
 Session Support
 Static Files Support
 Middleware
 Zum Beispiel Funktionen die sich zwischen Request und Response
hängen können (Logger etc.)
 Und vieles mehr…
Installation
npm install express --save
var express = require("express");
var app = express();
app.get("/", function (request, response) {
response.send("Hello World");
});
app.listen(3000);
GET-Aktion
 GET-Aktion mittels get-Funktion
hinterlegen
 Routing per String beschreiben
 Parameter werden zusätzlich mit
Doppelpunkt und Variablenamen
beschrieben
 state für Statuscode
 Rückgabe-Funktion
 render für HTML-Inhalt mit View Engine
 send für Text-Inhalt
 json für JSON-Inhalt
 redirect zur Weiterleitung
var express = require("express");
var app = express();
app.get("/api/sayHello/:name", (request, response) => {
var name = request.params.name;
if (!isNaN(name)) {
response
.status(400)
.send("No string as name");
} else {
response.json({
"message": name
});
}
});
app.listen(3000);
Queries
 Gewöhnliche Query-Parameter können
ebenfalls abgefragt werden
 Diese befinden sich unter
request.query.PARAMETERNAME
 Diese müssen nicht zusätzlich im
Routing beschrieben werden
var express = require("express");
var app = express();
// http:localhost:3000/api/sayHello?name=NodeJS
app.get("/api/sayHello/", (request, response) => {
var name = request.query.name;
var result = {
message: name
};
if (!isNaN(name)) {
response
.status(400)
.send("No string as name");
} else {
response.json(result);
}
});
app.listen(3000);
Express Pipeline
 Node.js und Express.js unterstützen
Middleware
 Vergleichbar mit ASP.NET Pipeline oder
ASP.NET MVC/Web-API Filters
 Middleware wird über die use-Funktion
Global für jede Anfrage bereitgestellt
 Middleware kann ebenfalls als Single-
Middleware einer einzelnen Anfrage
mitgegeben werden (z.B. upload.array())
app.use("/", express.static("public"));
app.use(bodyParser.urlencoded({
extended: true
}));
app.post("/api/sayHello", upload.array(),
(request, response) => {
...
});
Express Pipeline Architektur
app.use("/", express.static("public"));
app.use(bodyParser.urlencoded({
extended: true
}));
app.post("/api/sayHello", upload.array(),
(request, response) => {
...
});
query
Request http://localhost:3000/api/sayHello
expressInit
Static Handler
Url Encoded
Upload Array
Anonym Function
Eigene Middleware
 Das Schreiben einer eigenen
Middleware ist sehr einfach
 Die Signatur der Funktion entspricht:
 Request
 Response
 Next
 Nach der Verarbeitung der eigenen
Logik, muss nur die Next-Funktion
aufgerufen werden, ansonsten wird
die Pipeline nicht fortgesetzt
var express = require("express");
var app = express();
function consoleWriter(request, response, next) {
console.log("Request Path: " + request.path);
next();
}
app.use(consoleWriter);
app.get("/", function (request, response) {
response.send("Hello World");
});
app.listen(3000);
Statische Dateien in Express bereitstellen
 Wenn Sie statische Dateien wie Bilder,
CSS-Dateien und JavaScript-Dateien
bereitstellen wollen, verwenden Sie die
in Express integrierte
Middlewarefunktion express.static
 Der Name dieses Verzeichnisses ist nicht
Teil der URL
 Alle weiteren Unterverzeichnisse werden
ebenfalls automatisch bereitgestellt
 Falls eine Index.html-Datei im
Verzeichnis liegt, wird diese
standardmäßig geladen
var express = require("express");
var app = express();
app.use("/", express.static("public"));
app.listen(3000);
Der Vergleich
ASP.NET ASMX
 Wird bei ASP.NET Web-Forms als Standard verwendet
 Kommunikation mittels SOAP
 Verbirgt die Details wie der Service funktioniert
Node.js/Express.js
 Unterstützt kein SOAP
 Ersichtlich wie der Service funktioniert
 JSON Conversion per Standard verfügbar
 Man muss verstehen, was man sendet (Statuscodes,
Header etc.)
Der Vergleich
WCF
 Konfiguration über Konventionen
 Trennt die Transport Logik über Interfaces
 Abhängig von der Konfiguration
 Unterstützt ebenfalls REST durch zusätzliche Attribute
Node.js/Express.js
 Spezialisiert auf die HTTP-Kommunikation
 Über die Middleware werden einfach weitere
Kommunikationen ermöglicht (z.B. Web-Sockets mit
Socket.io)
 TCP ebenfalls möglich, benötigt dazu allerdings
separate Implementationen
 Kleine bis gar keine Konfiguration nötig
Der Vergleich
ASP.NET MVC / Web-API
 Erstellt API je nach Rückgabetyp
 Verwendet Attribute für keine-GET Funktionen
 Integrierte View Engine per Standard
 Route-Funktionen verstreut auf unterschiedliche
Dateien, obwohl sie im gleichen Kontext liegen würden
 Pushen von Daten nur mit SignalR möglich
 Eigene Services dafür nötig
 Web-API ist sehr ähnlich zu Express.js
 Routing Regeln müssen zusätzlich über Route Location
festgelegt werden
 Mehr zusätzliche Konfigurationen nötig
Node.js/Express.js
 Verwendet für jede Funktion ein eigenes Verb
 Pushen von Daten über Middleware einfach möglich
(Socket.io)
 Unterschiedliche View-Engines können verwendet
werden
 Unterschiedliche Route-Funktionen können in der
gleichen Datei implementiert werden
 Routing Regeln per Standard einfach vorhanden
View Engines Serverseitiges Rendern
Jade
 Ist eine View Engine und ähnlich zu
ASP.NET MVC
 Rendert Jade-Dateien zu HTML
serverseitig
 Master Templates können genutzt
werden
 Verfügt über Razor ähnliche Features
 Aus eigener Erfahrung: Ist leider stark
Fehleranfällig und Fehlermeldungen sind
nicht aussagekräftig
 http://jade-lang.com
Installation
npm install jade --save
Jade mit Express.js
 Es wird kein require für Jade benötigt
 Einfach nur die View Engine
registrieren
 Express.js erstellt intern ein eigenes
require
 Jade-Datei mit Jade-Format erzeugen
und referenzieren
 Jade verwendet als
Standardverzeichnis views
var express = require("express");
var app = express();
app.set("view engine", "jade");
app.get("/", function (request, response) {
response.render("jade/index“);
});
app.listen(3000);
Jade - View Template Format
doctype html
html(lang="en")
head
title= pageTitle
script(type='text/javascript').
if (foo) {
bar(1 + 5)
}
body
h1 Jade - node template engine
#container.col
if youAreUsingJade
p You are amazing
else
p Get on it!
p.
Jade is a terse and simple
templating language with a
strong focus on performance
and powerful features.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Jade</title>
<script type="text/javascript">
if (foo) {
bar(1 + 5)
}
</script>
</head>
<body>
<h1>Jade - node template engine</h1>
<div id="container" class="col">
<p>You are amazing</p>
<p>
Jade is a terse and simple
templating language with a
strong focus on performance
and powerful features.
</p>
</div>
</body>
</html>
Jade-Format HTML-Format
Jades Razor
 Ein JSON-Objekt wird beim Rendern
mitgegeben
 Innerhalb einer Jades-Datei wird dann
mittels „= JSON-Propertyname“ ein
Binding erzeugt
var express = require("express");
var app = express();
app.set("view engine", "jade");
app.get("/", function (request, response) {
response.render("jade/index", {
title: "Hello from Jade!"
});
});
app.listen(3000);
doctype html
html(lang="en")
head
title= title
body
h1= title
p This is an express app!
Jades Layout File
 Ein fixes Layout für alle Unterseiten
kann festgelegt werden
 Ähnlich zu ASP.NET Masterpages
 In der layout.jade-Datei wird ein
eigener Blockname definiert
 In der Unterseite wird auf die Layout-
Datei verwiesen und wie der eigene
Blockname heißt
doctype html
html(lang="en")
head
title= title
body
block content
footer This is the footer
extends layout
block content
h1= title
p This is an express app!
index.jade
layout.jade
EJS
 Ist eine View Engine und ähnlich zu
ASP.NET Web-Forms
 Steht für Embedded JavaScript
 Verfügt über Razor ähnliche Features
 Kann auch Masterpages nutzen
 Benötigt dazu extra das Modul ejs-locals
und muss bei Express.js registriert
werden
 http://www.embeddedjs.com
Installation
npm install ejs --save
npm install ejs-locals --save
EJS mit Express.js
 Es wird kein require für EJS benötigt, nur
für den Layout-Support (ejs-locals)
 Einfach nur die View Engine registrieren
 Express.js erstellt intern ein eigenes
require
 EJS-Datei im HTML-Format erzeugen
und referenzieren
 EJS verwendet als Standardverzeichnis
views
 Innerhalb von der Syntax <%- und %>
wird JavaScript ausgeführt
var express = require("express");
var app = express();
var ejsEngine = require("ejs-locals");
app.engine("ejs", ejsEngine);
app.set("view engine", "ejs");
app.get("/", function (request, response) {
response.render("ejs/index", {
title: "Hello from EJS!"
});
});
app.listen(3000);
<!DOCTYPE html>
<html>
<head>
<title>
<%- title %>
</title>
</head>
<body>
<div>
<%- title %>
</div>
</body>
</html>
EJS Layout File
 Ein fixes Layout für alle Unterseiten
kann festgelegt werden
 Ähnlich zu ASP.NET Masterpages
 In der layout.ejs-Datei wird ein
eigener Blockname mit body definiert
 In der Unterseite wird auf die Layout-
Datei verwiesen
...
<body>
<div>
<%- body %>
</div>
</body>
</html>
<% layout("layout.ejs") -%>
<h1><%- title %></h1>
<p>This is from
<%- title %>
</p>
index.ejs
layout.ejs
Vash
 Laut Webseite: „Vash, the 60 billion
double-dollar template-maker.“
 Ist eine View Engine und ähnlich zu
ASP.NET MVC
 Verwendet Razor-Syntax
 Mehr als ähnlich ;)
 Kann auch Masterpages nutzen
 https://github.com/kirbysayshi/vash
Installation
npm install vash --save
Vash mit Express.js
 Es wird kein require für Vash benötigt
 Einfach nur bei der View Engine
registrieren
 Express.js erstellt intern ein eigenes
require
 Vash-Datei im HTML-Format erzeugen
und referenzieren
 Vash verwendet als Standardverzeichnis
views
 Innerhalb von der @-Syntax wird
JavaScript ausgeführt
var express = require("express");
var app = express();
app.set("view engine", "vash");
app.get("/", function (request, response) {
response.render("vash/index", {
title: "Hello from Vash!"
});
});
app.listen(3000);
<!DOCTYPE html>
<html>
<head>
<title>
@model.title
</title>
</head>
<body>
<div>
@model.title
</div>
</body>
</html>
Vash Layout File
 Ein fixes Layout für alle Unterseiten
kann festgelegt werden
 Ähnlich zu ASP.NET Masterpages
 In der layout.vash-Datei wird ein
eigener Blockname definiert
 In der Unterseite wird auf die Layout-
Datei verwiesen und ein Block-
Bereich festgelegt
...
<body>
<div>
@html.block("body")
</div>
</body>
</html>
@html.extend("vash/layout", function(model){
@html.block("body", function(model){
<h1>@model.title</h1>
<p>This is from the server!</p>
})
})
index.vash
layout.vash
Node.js vs.
ASP.NET
Kampf der Giganten
Der Vergleich
ASP.NET
 Internet Information Services (IIS)
 Eigenständiger Dienst der Installiert und Konfiguriert
werden muss
 C#/VB.NET
 EF/SQL Server
 ASP.NET Web Forms
 ASP.NET MVC/Razor
 ASP.NET Web-API
 SignalR
 AngularJS/Ember/Backbone/KnockoutJS uvm.
Node.js
 Node.exe
 Die Anwendung selbst stellt den Web-Server zur Verfügung.
Konfiguration findet direkt im Code statt. (Leichtgewichtiger
als IIS)
 JavaScript
 (Die gleiche Sprache wie auf dem Client)
 Kann auch .NET-Code ausführen mit Edge.js
 MongoDB oder andere Datenbanken
 (SQL Server geht auch, nur kein EF Komfort)
 Mehrere View Engines
 EJS (Ählich zu Web Forms)
 Jade/Razor (Ähnlich zu MVC/Razor)
 Vash
 Express
 Socket.io
 AngularJS/Ember/Backbone/KnockoutJS uvm.
Microsofts Geheimplan: Node.js mit dem ChakraCore
 Microsofts JavaScript Engine ChakraCore
für Node.js
 Microsoft setzt verstärkt auf Cloud-First
 ASP.NET vNext setzt komplett auf
Node.js-Konzepte
 Cross-Plattform Support für .NET
 Modular durch Paketmanager
 Und vieles weitere…
 Tools für die Node.js-Entwicklung
 Visual Studio, VS Code
Ein Experiment von Microsoft zeigt…
Quelle: http://news.softpedia.com/news/and-so-it-begins-microsoft-asks-node-js-to-allow-chakracore-edge-alongside-google-s-v8-engine-499183.shtml
Kann bereits selbst getestet werden
 Läuft neben einer bereits installierten
Node.js-Version
 https://github.com/Microsoft/node/releas
es/tag/node-chakracore-6.0.0-pre2
FRAGEN?
Kostenlose Artikel zum Thema Node.js auf
http://www.cross-platform-blog.de
http://about.me/Gregor.Biswanger
Ich freue mich auf Feedback!
Vielen Dank!

Weitere ähnliche Inhalte

Was ist angesagt?

digitalSTROM Developer Day 2011: digitalSTROM bindet auch externe Komponenten...
digitalSTROM Developer Day 2011: digitalSTROM bindet auch externe Komponenten...digitalSTROM Developer Day 2011: digitalSTROM bindet auch externe Komponenten...
digitalSTROM Developer Day 2011: digitalSTROM bindet auch externe Komponenten...digitalSTROM.org
 
Vagrant, Puppet, Docker für Entwickler und Architekten
Vagrant, Puppet, Docker für Entwickler und ArchitektenVagrant, Puppet, Docker für Entwickler und Architekten
Vagrant, Puppet, Docker für Entwickler und ArchitektenOPITZ CONSULTING Deutschland
 
Automatischer Build mit Maven
Automatischer Build mit MavenAutomatischer Build mit Maven
Automatischer Build mit MavenStefan Scheidt
 
JavaScript für Java-Entwickler W-JAX 2013
JavaScript für Java-Entwickler W-JAX 2013JavaScript für Java-Entwickler W-JAX 2013
JavaScript für Java-Entwickler W-JAX 2013Oliver Zeigermann
 
Docker Workshop Experten Forum Stuttgart 2015, Agile Methoden GmbH
Docker Workshop Experten Forum Stuttgart 2015, Agile Methoden GmbHDocker Workshop Experten Forum Stuttgart 2015, Agile Methoden GmbH
Docker Workshop Experten Forum Stuttgart 2015, Agile Methoden GmbHagilemethoden
 
Nagios Conference 2007 | Pluginprogrammierung in Perl by Wolfgang Barth
Nagios Conference 2007 |  Pluginprogrammierung in Perl by Wolfgang BarthNagios Conference 2007 |  Pluginprogrammierung in Perl by Wolfgang Barth
Nagios Conference 2007 | Pluginprogrammierung in Perl by Wolfgang BarthNETWAYS
 
Windows 10 IoT Core
Windows 10 IoT CoreWindows 10 IoT Core
Windows 10 IoT CoreJens Siebert
 
Hendrik Jungnitsch: Software verpacken mit Docker
Hendrik Jungnitsch: Software verpacken mit DockerHendrik Jungnitsch: Software verpacken mit Docker
Hendrik Jungnitsch: Software verpacken mit Dockergedoplan
 
HTML5 und node.js Grundlagen
HTML5 und node.js GrundlagenHTML5 und node.js Grundlagen
HTML5 und node.js GrundlagenMayflower GmbH
 
Docker Security - Architektur und Sicherheitsfunktionen von Containervirtuali...
Docker Security - Architektur und Sicherheitsfunktionen von Containervirtuali...Docker Security - Architektur und Sicherheitsfunktionen von Containervirtuali...
Docker Security - Architektur und Sicherheitsfunktionen von Containervirtuali...inovex GmbH
 
EntwicklerCamp 2014 - DOTS reloaded
EntwicklerCamp 2014 - DOTS reloadedEntwicklerCamp 2014 - DOTS reloaded
EntwicklerCamp 2014 - DOTS reloadedRené Winkelmeyer
 
Eine Stunde was mit Api First!
Eine Stunde was mit Api First!Eine Stunde was mit Api First!
Eine Stunde was mit Api First!JanWeinschenker
 
Tipps und Tricks im Umgang mit Docker
Tipps und Tricks im Umgang mit DockerTipps und Tricks im Umgang mit Docker
Tipps und Tricks im Umgang mit DockerNicholas Dille
 
docker.io - Secure And Portable Containers Made Easy
docker.io - Secure And Portable Containers Made Easydocker.io - Secure And Portable Containers Made Easy
docker.io - Secure And Portable Containers Made Easyinovex GmbH
 
Docker - Automatisches Deployment für Linux-Instanzen
Docker - Automatisches Deployment für Linux-Instanzen Docker - Automatisches Deployment für Linux-Instanzen
Docker - Automatisches Deployment für Linux-Instanzen B1 Systems GmbH
 
docker.io @ CentOS 7 - Secure And Portable Containers Made Easy
docker.io @ CentOS 7 - Secure And Portable Containers Made Easydocker.io @ CentOS 7 - Secure And Portable Containers Made Easy
docker.io @ CentOS 7 - Secure And Portable Containers Made Easyinovex GmbH
 
Build Patterns - Patterns und Best Practices für den Build Prozess
Build Patterns - Patterns und Best Practices für den Build ProzessBuild Patterns - Patterns und Best Practices für den Build Prozess
Build Patterns - Patterns und Best Practices für den Build ProzessRalf Abramowitsch
 

Was ist angesagt? (20)

digitalSTROM Developer Day 2011: digitalSTROM bindet auch externe Komponenten...
digitalSTROM Developer Day 2011: digitalSTROM bindet auch externe Komponenten...digitalSTROM Developer Day 2011: digitalSTROM bindet auch externe Komponenten...
digitalSTROM Developer Day 2011: digitalSTROM bindet auch externe Komponenten...
 
Vagrant, Puppet, Docker für Entwickler und Architekten
Vagrant, Puppet, Docker für Entwickler und ArchitektenVagrant, Puppet, Docker für Entwickler und Architekten
Vagrant, Puppet, Docker für Entwickler und Architekten
 
Automatischer Build mit Maven
Automatischer Build mit MavenAutomatischer Build mit Maven
Automatischer Build mit Maven
 
JavaScript für Java-Entwickler W-JAX 2013
JavaScript für Java-Entwickler W-JAX 2013JavaScript für Java-Entwickler W-JAX 2013
JavaScript für Java-Entwickler W-JAX 2013
 
Dockerize It - Mit apex in die amazon cloud
Dockerize It - Mit apex in die amazon cloudDockerize It - Mit apex in die amazon cloud
Dockerize It - Mit apex in die amazon cloud
 
Docker Workshop Experten Forum Stuttgart 2015, Agile Methoden GmbH
Docker Workshop Experten Forum Stuttgart 2015, Agile Methoden GmbHDocker Workshop Experten Forum Stuttgart 2015, Agile Methoden GmbH
Docker Workshop Experten Forum Stuttgart 2015, Agile Methoden GmbH
 
Nagios Conference 2007 | Pluginprogrammierung in Perl by Wolfgang Barth
Nagios Conference 2007 |  Pluginprogrammierung in Perl by Wolfgang BarthNagios Conference 2007 |  Pluginprogrammierung in Perl by Wolfgang Barth
Nagios Conference 2007 | Pluginprogrammierung in Perl by Wolfgang Barth
 
Windows 10 IoT Core
Windows 10 IoT CoreWindows 10 IoT Core
Windows 10 IoT Core
 
Hendrik Jungnitsch: Software verpacken mit Docker
Hendrik Jungnitsch: Software verpacken mit DockerHendrik Jungnitsch: Software verpacken mit Docker
Hendrik Jungnitsch: Software verpacken mit Docker
 
HTML5 und node.js Grundlagen
HTML5 und node.js GrundlagenHTML5 und node.js Grundlagen
HTML5 und node.js Grundlagen
 
Docker Security - Architektur und Sicherheitsfunktionen von Containervirtuali...
Docker Security - Architektur und Sicherheitsfunktionen von Containervirtuali...Docker Security - Architektur und Sicherheitsfunktionen von Containervirtuali...
Docker Security - Architektur und Sicherheitsfunktionen von Containervirtuali...
 
EntwicklerCamp 2014 - DOTS reloaded
EntwicklerCamp 2014 - DOTS reloadedEntwicklerCamp 2014 - DOTS reloaded
EntwicklerCamp 2014 - DOTS reloaded
 
Eine Stunde was mit Api First!
Eine Stunde was mit Api First!Eine Stunde was mit Api First!
Eine Stunde was mit Api First!
 
Tipps und Tricks im Umgang mit Docker
Tipps und Tricks im Umgang mit DockerTipps und Tricks im Umgang mit Docker
Tipps und Tricks im Umgang mit Docker
 
docker.io - Secure And Portable Containers Made Easy
docker.io - Secure And Portable Containers Made Easydocker.io - Secure And Portable Containers Made Easy
docker.io - Secure And Portable Containers Made Easy
 
Docker - Automatisches Deployment für Linux-Instanzen
Docker - Automatisches Deployment für Linux-Instanzen Docker - Automatisches Deployment für Linux-Instanzen
Docker - Automatisches Deployment für Linux-Instanzen
 
docker.io @ CentOS 7 - Secure And Portable Containers Made Easy
docker.io @ CentOS 7 - Secure And Portable Containers Made Easydocker.io @ CentOS 7 - Secure And Portable Containers Made Easy
docker.io @ CentOS 7 - Secure And Portable Containers Made Easy
 
systemd & Docker
systemd & Dockersystemd & Docker
systemd & Docker
 
Node.js Security
Node.js SecurityNode.js Security
Node.js Security
 
Build Patterns - Patterns und Best Practices für den Build Prozess
Build Patterns - Patterns und Best Practices für den Build ProzessBuild Patterns - Patterns und Best Practices für den Build Prozess
Build Patterns - Patterns und Best Practices für den Build Prozess
 

Ähnlich wie Kuck mal, Node.js! Einstieg für .NET Entwickler mit Visual Studio Code und TypeScript

German: Softwareprodukte aus einem Source Code mit Javascript
German: Softwareprodukte aus einem Source Code mit JavascriptGerman: Softwareprodukte aus einem Source Code mit Javascript
German: Softwareprodukte aus einem Source Code mit JavascriptRalf Schwoebel
 
Einsatz von Subversion bei der Entwicklung technisch-wissenschaftlicher Software
Einsatz von Subversion bei der Entwicklung technisch-wissenschaftlicher SoftwareEinsatz von Subversion bei der Entwicklung technisch-wissenschaftlicher Software
Einsatz von Subversion bei der Entwicklung technisch-wissenschaftlicher SoftwareAndreas Schreiber
 
elemente websolutions - Zusammenfassung T3DD09
elemente websolutions - Zusammenfassung T3DD09elemente websolutions - Zusammenfassung T3DD09
elemente websolutions - Zusammenfassung T3DD09elemente websolutions
 
C / C++ Api for Beginners
C / C++ Api for BeginnersC / C++ Api for Beginners
C / C++ Api for BeginnersUlrich Krause
 
C API for Lotus Notes & Domino
C API for Lotus Notes & DominoC API for Lotus Notes & Domino
C API for Lotus Notes & DominoUlrich Krause
 
C/ C++ for Notes & Domino Developers
C/ C++ for Notes & Domino DevelopersC/ C++ for Notes & Domino Developers
C/ C++ for Notes & Domino DevelopersUlrich Krause
 
Continuous Delivery für Cloud-native Anwendungen auf Cloud-nativer Infrastruktur
Continuous Delivery für Cloud-native Anwendungen auf Cloud-nativer InfrastrukturContinuous Delivery für Cloud-native Anwendungen auf Cloud-nativer Infrastruktur
Continuous Delivery für Cloud-native Anwendungen auf Cloud-nativer InfrastrukturQAware GmbH
 
Templates, Code & Tools
Templates, Code & ToolsTemplates, Code & Tools
Templates, Code & ToolsUlrich Krause
 
Python in der Luft- und Raumfahrt
Python in der Luft- und RaumfahrtPython in der Luft- und Raumfahrt
Python in der Luft- und RaumfahrtAndreas Schreiber
 
Was gibt es Neues im Docker-Universum
Was gibt es Neues im Docker-UniversumWas gibt es Neues im Docker-Universum
Was gibt es Neues im Docker-UniversumNicholas Dille
 
Top 10 Internet Trends 2006
Top 10 Internet Trends 2006Top 10 Internet Trends 2006
Top 10 Internet Trends 2006Jürg Stuker
 
Top 10 Internet Trends 2007
Top 10 Internet Trends 2007Top 10 Internet Trends 2007
Top 10 Internet Trends 2007Jürg Stuker
 
Windows Azure Platform Overview
Windows Azure Platform   OverviewWindows Azure Platform   Overview
Windows Azure Platform OverviewOliver Michalski
 
Fachreferat: Visual Studio 2012, Windows 8 und .NET 4.5
Fachreferat: Visual Studio 2012, Windows 8 und .NET 4.5Fachreferat: Visual Studio 2012, Windows 8 und .NET 4.5
Fachreferat: Visual Studio 2012, Windows 8 und .NET 4.5Digicomp Academy AG
 
Ionic 2 - Hybridapps auf Steroiden
Ionic 2 - Hybridapps auf SteroidenIonic 2 - Hybridapps auf Steroiden
Ionic 2 - Hybridapps auf SteroidenHendrik Lösch
 
Make Developers Fly: Principles for Platform Engineering
Make Developers Fly: Principles for Platform EngineeringMake Developers Fly: Principles for Platform Engineering
Make Developers Fly: Principles for Platform EngineeringQAware GmbH
 
Android Apps mit Xamarin entwickeln
Android Apps mit Xamarin entwickelnAndroid Apps mit Xamarin entwickeln
Android Apps mit Xamarin entwickelnAndré Krämer
 
Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)
Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)
Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)greenrobot
 

Ähnlich wie Kuck mal, Node.js! Einstieg für .NET Entwickler mit Visual Studio Code und TypeScript (20)

German: Softwareprodukte aus einem Source Code mit Javascript
German: Softwareprodukte aus einem Source Code mit JavascriptGerman: Softwareprodukte aus einem Source Code mit Javascript
German: Softwareprodukte aus einem Source Code mit Javascript
 
Node.js
Node.jsNode.js
Node.js
 
Einsatz von Subversion bei der Entwicklung technisch-wissenschaftlicher Software
Einsatz von Subversion bei der Entwicklung technisch-wissenschaftlicher SoftwareEinsatz von Subversion bei der Entwicklung technisch-wissenschaftlicher Software
Einsatz von Subversion bei der Entwicklung technisch-wissenschaftlicher Software
 
elemente websolutions - Zusammenfassung T3DD09
elemente websolutions - Zusammenfassung T3DD09elemente websolutions - Zusammenfassung T3DD09
elemente websolutions - Zusammenfassung T3DD09
 
C / C++ Api for Beginners
C / C++ Api for BeginnersC / C++ Api for Beginners
C / C++ Api for Beginners
 
C API for Lotus Notes & Domino
C API for Lotus Notes & DominoC API for Lotus Notes & Domino
C API for Lotus Notes & Domino
 
C/ C++ for Notes & Domino Developers
C/ C++ for Notes & Domino DevelopersC/ C++ for Notes & Domino Developers
C/ C++ for Notes & Domino Developers
 
Continuous Delivery für Cloud-native Anwendungen auf Cloud-nativer Infrastruktur
Continuous Delivery für Cloud-native Anwendungen auf Cloud-nativer InfrastrukturContinuous Delivery für Cloud-native Anwendungen auf Cloud-nativer Infrastruktur
Continuous Delivery für Cloud-native Anwendungen auf Cloud-nativer Infrastruktur
 
Templates, Code & Tools
Templates, Code & ToolsTemplates, Code & Tools
Templates, Code & Tools
 
Was ist neu in .NET 4.5?
Was ist neu in .NET 4.5?Was ist neu in .NET 4.5?
Was ist neu in .NET 4.5?
 
Python in der Luft- und Raumfahrt
Python in der Luft- und RaumfahrtPython in der Luft- und Raumfahrt
Python in der Luft- und Raumfahrt
 
Was gibt es Neues im Docker-Universum
Was gibt es Neues im Docker-UniversumWas gibt es Neues im Docker-Universum
Was gibt es Neues im Docker-Universum
 
Top 10 Internet Trends 2006
Top 10 Internet Trends 2006Top 10 Internet Trends 2006
Top 10 Internet Trends 2006
 
Top 10 Internet Trends 2007
Top 10 Internet Trends 2007Top 10 Internet Trends 2007
Top 10 Internet Trends 2007
 
Windows Azure Platform Overview
Windows Azure Platform   OverviewWindows Azure Platform   Overview
Windows Azure Platform Overview
 
Fachreferat: Visual Studio 2012, Windows 8 und .NET 4.5
Fachreferat: Visual Studio 2012, Windows 8 und .NET 4.5Fachreferat: Visual Studio 2012, Windows 8 und .NET 4.5
Fachreferat: Visual Studio 2012, Windows 8 und .NET 4.5
 
Ionic 2 - Hybridapps auf Steroiden
Ionic 2 - Hybridapps auf SteroidenIonic 2 - Hybridapps auf Steroiden
Ionic 2 - Hybridapps auf Steroiden
 
Make Developers Fly: Principles for Platform Engineering
Make Developers Fly: Principles for Platform EngineeringMake Developers Fly: Principles for Platform Engineering
Make Developers Fly: Principles for Platform Engineering
 
Android Apps mit Xamarin entwickeln
Android Apps mit Xamarin entwickelnAndroid Apps mit Xamarin entwickeln
Android Apps mit Xamarin entwickeln
 
Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)
Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)
Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)
 

Mehr von Gregor Biswanger

MongoDB: Entwurfsmuster für das NoSQL-Schema-Design
MongoDB: Entwurfsmuster für das NoSQL-Schema-DesignMongoDB: Entwurfsmuster für das NoSQL-Schema-Design
MongoDB: Entwurfsmuster für das NoSQL-Schema-DesignGregor Biswanger
 
Yes zu NoSQL mit MongoDB für .NET-Entwickler
Yes zu NoSQL mit MongoDB für .NET-EntwicklerYes zu NoSQL mit MongoDB für .NET-Entwickler
Yes zu NoSQL mit MongoDB für .NET-EntwicklerGregor Biswanger
 
Fachmodell-First: Einstieg in das NoSQL-Schema-Design
Fachmodell-First: Einstieg in das NoSQL-Schema-DesignFachmodell-First: Einstieg in das NoSQL-Schema-Design
Fachmodell-First: Einstieg in das NoSQL-Schema-DesignGregor Biswanger
 
Clevere Tipps zum Thema Facebook Posts
Clevere Tipps zum Thema Facebook PostsClevere Tipps zum Thema Facebook Posts
Clevere Tipps zum Thema Facebook PostsGregor Biswanger
 
Responsive Webdesign mit Bootstrap
Responsive Webdesign mit BootstrapResponsive Webdesign mit Bootstrap
Responsive Webdesign mit BootstrapGregor Biswanger
 
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...Gregor Biswanger
 
Multi Touch.Prio.Conference 2009
Multi Touch.Prio.Conference 2009Multi Touch.Prio.Conference 2009
Multi Touch.Prio.Conference 2009Gregor Biswanger
 

Mehr von Gregor Biswanger (7)

MongoDB: Entwurfsmuster für das NoSQL-Schema-Design
MongoDB: Entwurfsmuster für das NoSQL-Schema-DesignMongoDB: Entwurfsmuster für das NoSQL-Schema-Design
MongoDB: Entwurfsmuster für das NoSQL-Schema-Design
 
Yes zu NoSQL mit MongoDB für .NET-Entwickler
Yes zu NoSQL mit MongoDB für .NET-EntwicklerYes zu NoSQL mit MongoDB für .NET-Entwickler
Yes zu NoSQL mit MongoDB für .NET-Entwickler
 
Fachmodell-First: Einstieg in das NoSQL-Schema-Design
Fachmodell-First: Einstieg in das NoSQL-Schema-DesignFachmodell-First: Einstieg in das NoSQL-Schema-Design
Fachmodell-First: Einstieg in das NoSQL-Schema-Design
 
Clevere Tipps zum Thema Facebook Posts
Clevere Tipps zum Thema Facebook PostsClevere Tipps zum Thema Facebook Posts
Clevere Tipps zum Thema Facebook Posts
 
Responsive Webdesign mit Bootstrap
Responsive Webdesign mit BootstrapResponsive Webdesign mit Bootstrap
Responsive Webdesign mit Bootstrap
 
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
 
Multi Touch.Prio.Conference 2009
Multi Touch.Prio.Conference 2009Multi Touch.Prio.Conference 2009
Multi Touch.Prio.Conference 2009
 

Kuck mal, Node.js! Einstieg für .NET Entwickler mit Visual Studio Code und TypeScript

  • 1. Einstieg in Node.js Für .NET-Entwickler mit Visual Studio Code und TypeScript Gregor Biswanger | Freier Dozent, Berater, Trainer und Autor about.me/gregor.biswanger
  • 2. Über mich  Freier Dozent, Berater und Trainer  Schwerpunkte Softwarearchitektur, XAML, Web und Cross-Plattform Entwicklung  Technologieberater für die Intel Developer Zone  Sprecher auf Konferenzen und User Groups  Programmverantwortlicher bei der DWX 17 für den Cross-Platform- und Web-Backend-Day  Freier Autor für heise.de, dotnetpro, WindowsDeveloper und viele weitere Fachmagazine  Video-Trainer bei video2brain und Microsoft Gregor Biswanger Microsoft MVP, Intel Black Belt & Intel Software Innovator cross-platform-blog.de about.me/gregor.biswanger
  • 3. Was ist Node.js? Wir lüften das Geheimnis
  • 4. Was ist Node.js?  Node.js ist eine serverseitige Plattform zum Betrieb von Netzwerkanwendungen. Insbesondere lassen sich Webserver damit realisieren.  JavaScript kann außerhalb vom Browser genutzt werden  Basiert auf der JavaScript-Laufzeitumgebung „V8“ (Google Chrome).  Läuft unter Windows, Linux und Mac OSX  In C, C++ und JavaScript geschrieben.  Flexibles Modulsystem (NPM).  Ideal für viele gleichzeitige I/O Verbindungen. Download Nodejs.org
  • 5. Der Papa von Node.js  Ryan Dahl  Gesponsert von der Firma Joyent  Spezialisiert für Virtualisierung und Cloud Computing
  • 6. Das Geburtsjahr von Node.js: 2009  Ryan Dahl startete am 16.02.2009 mit dem Node-Projekt  Ihm wurde dann 2011 auf der Oscon Konferenz, der O’Reilly Open Source Award verliehen  InfoWorld hat Node.js im August 2011 mit dem Bossie Award für beste Open- Source-Software in der Kategorie „Entwicklertools“ ausgezeichnet
  • 7. Top Rockstars auf GitHub  Auf Platz 2 (Stand: 2012)  831 Entwickler  Über 300 Releases  Über 1.500 Beobachter  Über 19.000 Stars  Über 2.400 Forks
  • 8. Cross-Plattform Desktop Software mit Node.js  Für den Desktop mit NW.JS oder Electron  Node.js wird auf dem Client bereitgestellt  https://github.com/nwjs/nw.js/wiki/List-of- apps-and-companies-using-nw.js
  • 9. JavaScript für Internet der Dinge (IoT)  Das Linux Derivat Yocto bietet mit Node.js die Möglichkeit auf Hardware zuzugreifen und einen Web-Server zu Hosten  Verwendet vor allem vom Intel Galileo Board und Intel Edison  Zur Entwicklung dient dann das Intel XDK IoT Edition  Das ebenfalls das Node-Webkit nutzt  Kostenloses Video auf Channel 9 meinerseits:  https://channel9.msdn.com/Blogs/TechTalk/Episode -53-IoT-Development-mit-Intel-Galieo--Edison- und-Nodejs
  • 10. Node.js nur ein Hype?  Der Technologieradar von ThoughtWorks bewertet Node.js als eine ausgereifte und bewährte Technologie, die für den Unternehmenseinsatz geeignet ist.  Quelle (Januar 2014):  http://www.thoughtworks.com/de/radar/
  • 11. Bekannte Webseiten, die auf Node.js laufen  Trello  WordPress.com  Walmart.com  LinkedIn  Yahoo  (Für einige Services)  Google  (Für einige Services)  Microsoft  (Yammer)  (Azure Mobile Services)  Mozilla  TheNewYorkTimes  GitHub (Für Downloads)  Uvm. Quellen: https://github.com/nodejs/node-v0.x-archive/wiki/Projects,-Applications,-and-Companies-Using-Node https://www.quora.com/What-are-the-biggest-websites-built-with-Node-js-on-the-server-side https://de.wikipedia.org/wiki/Node.js
  • 12. Ein Erfahrungsbericht von PayPal  5 Entwickler starteten im Januar mit Java eine Web-App zu programmieren  Verwendeten das Spring Framework  In März starteten 2 Entwickler mit Node.js eine Web-App zu programmieren  Kraken.js, express und dust.js  Im Juni hatten beide Applikationen die gleiche Funktionalität  Der Node.js Entwicklungserfolg in Zahlen:  Mit weniger Entwicklern, fast doppelt so schnell programmiert  Es wurde circa 33% weniger Code benötigt  Mit circa 40% weniger Dateien aufgebaut Quelle: https://www.paypal-engineering.com/2013/11/22/node-js-at-paypal/
  • 13. Ein Erfahrungsbericht von WordPress Quelle: https://developer.wordpress.com/2015/11/23/the-story-behind-the-new-wordpress-com
  • 14. Der erste Web-Server Platz frei für „Hallo Welt“
  • 15. Der Berühmte „Hallo Welt“ Node.js Web-Server  Starten in der Konsole mit dem Befehl node datei.js  Das Tool Nodemon kann Änderungen der Datei erkennen und Node automatisch neustarten  npm install nodemon –g  nodemon datei.js var http = require('http'); http.createServer((request, response) => { response.writeHead(200, { 'Content-Type': 'text/html' }); response.write('Hallo Welt'); response.end(); }).listen(3000);
  • 16. Wie funktioniert Node.js? Ein Blick auf die Architektur
  • 17. Basiert auf eine Ereignisgesteuerte Architektur  Auch bekannt als Event-driven Architecture  Spart somit Ressourcen, was eine besonders große Anzahl gleichzeitig bestehender Netzwerkverbindungen ermöglicht
  • 18. Node.js Architektur Node.js Node.js Core Library (JavaScript) Node.js Bindings (C++) Google V8 (C++) Libuv (C) (Früher Libev & Libeio) var fs = require('fs'); fs.readFile('Hallo.txt', 'utf8', function(err, contents) { console.log(contents); }); console.log('after calling readFile'); after calling readFile Ausgabe myFile.js Hallo Welt von Hallo.txt! 1 Thread 1 Neuer Thread zur System-APIAsynchrone Antwort von der System API
  • 19. JavaScript Architektur – Call Stack Call Stack function multiply(a, b) { return a * b; } function square(n) { return multiply(n, n); } function printSquare(n) { var squared = square(n); console.log(squared); } printSquare(4); 16 Ausgabe main() printSquare(4) square(4) multiply(4, 4) console.log(..)
  • 20. JavaScript Architektur – Call Stack Call Stack function foo() { return foo(); } foo(); main() foo() foo() foo() foo() foo() foo() foo()
  • 21. JavaScript Architektur – Event Loop Call StackJS Engine API Task Queue console.log("Hello"); setTimeout(function callback() { console.log("World"); }, 0); console.log("Ohh!"); Hello AusgabeEvent Loop main() console.log("Hello") Ohh! World setTimeout(callback)console.log("Ohh!") callback timer callback callback() console.log("World")
  • 22. Node.js Architektur – Event Loop Node.js Node.js Core Library (JavaScript) Node.js Bindings (C++) Google V8 (C++) var fs = require('fs'); fs.readFile('Hallo.txt', 'utf8', function(err, contents) { console.log(contents); }); console.log('after calling readFile'); after calling readFile Ausgabe myFile.js Hallo Welt von Hallo.txt! 1 Thread 1 Neuer Thread zur System-APIAsynchrone Antwort von der System API Call StackTask Queue callback main() require("fs")fs.readFile(..)console.log("after..") callback(err, contents) console.log("contents") Event Loop Libuv (C) Thread Pool
  • 23. Klassische Web-Server (Apache, Tomcat, IIS…) Clients Web-Server Backend DB Betriebssystem Dateien Dienste Request Request Request Request Thread 1 Thread 2 Thread 3 Thread 4 Request Request Request Response ResponseResponse ThreadPool Response Response Response Response
  • 24. Klassische Web-Server - Request/Response Model  Clients senden eine Anfrage zum Web-Server.  Web-Server stellt intern eine begrenzte Anzahl von Thread-Pools zum Verarbeiten der Client- Anfragen.  Der Web-Server läuft in einer Endlos-Schleife und wartet auf Client-Anfragen.  Wenn der Web-Server eine Anfrage entgegen nimmt:  Wird für die Anfrage ein Thread erzeugt  Die Anfrage wird dem Thread zugeordnet  Der Thread kümmert sich um die Verarbeitung der Anfrage  Der Thread sendet die verarbeitete Antwort zurück an den Web-Server  Der Web-Server sendet diese Antwort an den jeweiligen Client
  • 25. Node.js Web-Server Clients Web-Server Backend DB Betriebssystem Dateien Dienste Request Request Request Request Response Response Response Response Request Event Loop Single Threaded Event Queue Non-Blocking IO Tasks Node.js internal Thread Pool Thread 1 Thread 2 Request Request Request Request Request Response Request Thread 3 Response RequestResponeResponse
  • 26. Node.js Web-Server - Single-Threaded Event Loop Model  Clients senden eine Anfrage zum Web-Server.  Node.js Web-Server stellt intern eine begrenzte Anzahl von Thread-Pools zum Verarbeiten der Client- Anfragen.  Node.js Web-Server empfängt die Anfragen und stellt sie in eine Warteschlange (Event Queue).  Node.js Web-Server hat intern eine Komponente, die als „Event-Loop“ bekannt ist. Diese läuft in einer Schleife um Anfragen zu empfangen und zu verarbeiten.  Der Event-Loop läuft unter einem Thread und ist das Herz von Node.js.  Bei jedem Durchlauf der Schleife, wird der Event Queue auf Anfragen überprüft.  Wenn eine Anfrage im Event Queue liegt, wird diese genommen:  Der Code der Anfrage wird sofort verarbeitet  Wenn der Code keine blockierenden I/O-Operationen erfordert, wird er bis zum Ende ausgeführt und die Antwort sofort an den Client zurückgesendet  Wenn blockierende I/O-Operationen vorhanden sind, wie zum Beispiel eine Interaktion mit der Datenbank, Dateisystem oder Diensten, dann folgt ein anderer Ansatz:  Überprüfung ob interne Threads verfügbar sind.  Anfrage wird einem Thread zugewiesen  Der Thread verarbeitet die gewünschte Anfrage  Der Thread sendet die Antwort zurück zur Event-Loop  Falls die Event-Loop frei ist, wird die Antwort durch sie sofort an den Client gesendet  Andernfalls wird die Antwort zum Event Queue auf die Warteschlange gelegt und zum nächst möglichen Zeitpunkt von der Event-Loop an den Client gesendet
  • 27. Was hat diese Arbeitsweise für Vorteile in Node.js?  Ryan Dahl (der Entwickler von Node.js) hat dafür einmal folgendes Beispiel genutzt: „Man stelle sich vor, ein ausgeführtes Programm, ist eine Person, die bei sich im Büro am Schreibtisch arbeitet. Benötigt das Programm Informationen aus dem Level2-Cache, entspricht das in etwa dem Öffnen der Schreibtischschublade in dem die Informationen liegen. Für Daten aus dem RAM muss man schon von seinem Platz aufstehen, zur gegenüberliegenden Seite des Büros laufen und die Informationen dort aus einem großen Aktenschrank rausholen und sich wieder an seinen Platz begeben. Greift man hingegen auf Daten von der Festplatte zu, steht man auf, verlässt das Büro und das Gebäude, setzt sich in ein Taxi, fährt zum Flughafen, nimmt die nächste Maschine nach Tokio, holt dort die Informationen ab und fliegt wieder zurück.“
  • 28. Die Kosten von I/O Operationen I/O Quelle CPU Cycles L1-Cache* 3 L2-Cache* 14 RAM 250 Festplatte 41.000.000 Netzwerk 240.000.000 * Im Hardwarebereich weisen vor allem moderne CPUs zwei oder drei Cacheebenen auf; sonstige Geräte besitzen meist nur eine Cacheebene. Im Softwarebereich wird meist nur eine Cacheebene benutzt, eine prominente Ausnahme bilden Webbrowser, die zwei Ebenen nutzen (Arbeitsspeicher und Festplattenlaufwerk). Quelle: Wikipedia
  • 29. Node.js bei PayPal Quelle: https://www.paypal-engineering.com/2013/11/22/node-js-at-paypal/
  • 32. Vor- und Nachteile vom Node.js Web-Server Gut  Hohe Performance  Skalierbar  JSON-API per Default und leichtgewichtig  Streaming - Videofilme können schon beim Hochladen beim Server in ein anderes Format transkodiert werden  Web-Echtzeit durch Web-Sockets Unterstützung Schlecht  Rechenintensive Anwendungen die eine hohe CPU Auslastung beanspruchen
  • 33. Zusammenfassung  Node.js verwendet die Single-Threaded Event Loop Model Architektur  Node.js-Anforderungen waren von beginn an auf Performance und Skalierbarkeit ausgelegt  JavaScript für Server und Client  Nur eine Sprache muss beherrscht werden können  Namenhafte Unternehmen setzen bereits erfolgreich auf Node.js
  • 35. CommonJS Module Spezifikation  CommonJS, kurz CJS, ist eine Initiative, die es sich zum Ziel gesetzt hat Spezifikationen/API’s für JavaScript zu definieren  http://wiki.commonjs.org/wiki/CommonJS  Damit existierender Code wiederverwendet werden kann, wurde das Module-System entwickelt  Vergleichbar mit Assemblies/Namespaces unter .NET  Einfache Syntax  Entworfen für synchrones Laden von JavaScript-Dateien ohne Script-Tag (asynchron geht auch)  Kann zum Beispiel auch komplilieren (CoffeeScript)  Wird unter Node.js, CouchDB und Titanium Mobile verwendet  Für JavaScript im Browser gibt es ab ECMAscript 6 die Asynchronous Module Definition (AMD) JS-Datei JS-Datei CommonJS (Mediator) Modul A Modul B Code Code
  • 36. Ein Modul hat seinen eigenen Kontext (Scope)  Auf Objekte, Funktionen oder Variablen von anderen Modulen kann dabei nicht zugegriffen werden  Es sei denn, ein anderes Modul wird mittels "require()" geladen  Vergleichbar mit using aus .NET  Erstellt man innerhalb von einem Modul eine Variable, so ist diese innerhalb von diesem Modul privat und nicht im globalen Kontext verfügbar  Ein Modul muss dabei nicht zwingend eine Datei sein. Theoretisch könnte das Modul zum Beispiel auch aus einer Datenbank stammen. In der Praxis ist dies jedoch eine Datei.  Der String, der das Modul identifiziert, entspricht dem Pfad zur jeweiligen Datei, wobei auf die Dateiendung ".js" verzichtet wird. var foo = require('./foo'); foo.bar()
  • 37. Inhalte vom Modul öffentlich stellen  Innerhalb eines Moduls existiert eine spezielle Variable "module.exports", um innerhalb von einen Modul Variablen, Objekte oder Funktionen nach außen verfügbar zu machen  Alles was dieser Variable zugewiesen wird, ist später über das Modul erreichbar module.exports.sayHello = () => console.log(„Hello“);
  • 38. Module sind statisch  Immer wenn ein Modul eingebunden wird, wird dieses nicht neu geladen oder neu ausgeführt  Es behält daher immer seinen Status
  • 39. Node.js Core Module  Node.js besitzt bereits Basis-Module die fest in die Umgebung integriert sind  Es können auch weitere Module nachinstalliert, oder gar selbst geschrieben werden  Alle Core Module sind Funktions- Biblioteken, die grundlegende Aufgaben wie z.B. den Umgang mit dem Betriebssystem, Netzwerk-Technologien oder Verschlüsselungen abdecken  Core Module Dokumentation  https://nodejs.org/api/ var os = require('os'); var platform = os.platform(); console.log(platform);
  • 41. Konfiguration für CommonJS-Support  TypeScript unterstützt CommonJS  In der tsconfig.json-Datei muss diese Unterstützung explizit aktiviert werden  Wichtig! Das Verzeichnis node_modules sollte ignoriert werden { "compilerOptions": { "module": "commonjs", "sourceMap": true }, "exclude": [ "node_modules" ] } tsconfig.json
  • 42. Das Require mit TypeScript  Soll eine externe TS-Datei mittels require geladen werden, oder existiert für das zu ladende Modul eine Type Definitions-Datei, wird die Instanz mittels import anstatt var/let vorgenommen  Falls nichts von beiden vorhanden sein sollte, verwendet man weiterhin var/let import http = require('http');
  • 43. Einfacher Export mit TypeScript  Einfach die freigebende Klasse mit export deklarieren  Es wird keine zusätzliche module Deklaration benötigt export class Foo() { ...
  • 44. Node Package Manager Libraries auf Bestellung und noch mehr!
  • 45. Node Package Manager  Der Node Package Manager (npm) ist ein Paketmanager für die JavaScript- Laufzeitumgebung node.js  Wird bei der node.js Installation bereitgestellt  Unter .NET ist es vergleichbar mit NuGet  Ende Januar 2016 enthielt das Repositorium knapp 236.209 Pakete  Ende Januar 2016 enthielt NuGet zum Vergleich 49.781 Pakete  https://www.npmjs.com Konsolen-Anwendung npm
  • 46. Die Package.json  Diese enthält wichtige Metadaten zum eigenen Projekt/Modul  Vereinfacht die Arbeit im Team und beim Deployen  Skripte können hinterlegt werden  Für Tests und Tasks  Installierte Module können registriert werden Package.json Erstellen npm init { "name": "helloworld", "version": "1.0.0", "description": "my first package.json file", "main": "index.js", "scripts": { "test": "" }, "author": "Gregor Biswanger", "license": "ISC" } Package.json
  • 47. Ein Paket installieren  Ein Paket wird über die Konsole installiert  Beim Installieren werden deren Paket- Abhängigkeiten ebenfalls installiert  Die Pakete werden immer in ein Standardverzeichnis installiert  node_modul  Wenn bei require kein Pfad im String eingegeben wird, sucht CommonJS automatisch im node_modul nach dem gewünschten Modul Paket installieren npm install Paketname npm install [Verzeichnis mit Paket]
  • 48. Ein Paket installieren und registrieren  Die Package.json kann sich installierte Pakete merken  Es wird zwischen „Benötigt zur Produktion“ und „Benötigt zur Entwicklungszeit“ unterschieden  Das hilft beim Deployement, nur die wirklich relevanten Module zu installieren  Versionsverwaltungen können so schlanker gehalten werden und es werden Konflikte bei Updates verhindert  Die .ignoregit-Datei sollte dann folgende Zeile beinhalten: node_modules/ Paket installieren und Registrieren npm install Paketname --save npm install Paketname --save-dev { "name": "helloworld", "version": "1.0.0", "description": "my first package.json file", "main": "index.js", "scripts": { "test": "" }, "author": "Gregor Biswanger", "license": "ISC", "dependencies": { "underscore": "^1.8.3" }, "devDependencies": { "gulp": "^3.9.0" } } Package.json
  • 49. Regeln zur Paketversionierung  ^1.8.3 (1.x.x)  Hauptversion bleibt konstant, weitere Hauptrevision werden installiert, wenn verfügbar  ~1.8.3 (1.8.x)  Updatet nur eine Minor Version höher, wenn verfügbar  1.8.3  Bleibt konstant die gleiche Version  <1.8.3 oder <=1.8.3  Kleiner als die definierte Version oder kleiner bzw. gleich der definierten Version  >1.8.3 oder >=1.8.3  Größer als die definierte Version oder größer bzw. gleich der definierten Version { ... "dependencies": { "underscore": "^1.8.3" }, "devDependencies": { "gulp": "^3.9.0" } } Package.json
  • 50. Registriere Pakete installieren  Wenn innerhalb im Projekt npm install aufgerufen wird, werden alle registrieren Pakete unter dependencies der Package.json installiert  Mit einem zusätzlichen production-Attribut werden alle devDependencies installiert Paket installieren im Projektverzeichnis npm install npm install -production
  • 51. Ein Paket Global installieren  Pakete stehen für alle Projekte zur Verfügung  Hauptsächlich sind das Pakete, die zur Entwicklungszeit benötigt werden  Zum Beispiel TypeScript, Grunt oder Gulp  Pfad der globalen Pakete unter Windows:  C:UsersGregorAppDataRoamingnpmnode_modules Paket Global installieren npm install Paketname -g
  • 52. Scripte hinter Standard-Scripte festlegen NPM Unterstützt ein Script-Property innerhalb der package.json, für folgende Scripts:  prepublish Wird ausgeführt BEVOR ein Paket veröffentlicht wird  publish, postpublish Wird ausgeführt NACH dem veröffentlichen eines Pakets  preinstall Wird ausgeführt BEVOR ein Paket installiert wird  install, postinstall Wird ausgeführt NACH dem ein Paket installiert wurde  preuninstall, uninstall Wird ausgeführt BEVOR ein Paket uninstalliert wird  postuninstall Wird ausgeführt NACH dem ein Paket uninstalliert wurde  preversion, version Wird ausgeführt BEVOR ein Paket höher versioniert wird  postversion Wird ausgeführt NACH dem ein Paket höher versioniert wurde  pretest, test, posttest Wird ausgeführt bei npm test  prestop, stop, poststop Wird ausgeführt bei npm stop  prestart, start, poststart Wird ausgeführt bei npm start  prerestart, restart, postrestart Wird ausgeführt bei npm restart. Hinweis: Laufende Scripts werden dabei nicht beendet. Script starten npm Scriptname { "name": "helloworld", "version": "1.0.0", "description": "my fir..", "main": "index.js", "scripts": { "start": "node index.js" }, ... Package.json
  • 53. Eigene Scripte festlegen Script starten npm run Scriptname { "name": "helloworld", "version": "1.0.0", "description": "my fir..", "main": "index.js", "scripts": { "tsc": "tsc" }, ... Package.json  Es können auch eigene Scripte hinterlegt werden  Diese werden durch den zusätzlichen run Befehl ausgeführt  Kombinationen von unterschiedlichen Tasks mit nur einem Befehl, sind mit der Erweiterung concurrently möglich 1. npm install concurrently --save-dev 2. "start": "concurrent "npm run tsc" "npm test"
  • 54. Express.js  Ein Web Application Framework für node.js  Inspiriert vom Sinatra-Framework (Ruby)  Es erweitert Node.js um Werkzeuge, mit denen das Entwickeln moderner Webanwendungen einfacher gestaltet wird  Vergleichbar mit der Microsoft Web-API (Nur besser )  Kommunikation mit REST (HTTP) per Standard  Request/Response-Handling  Routing  View Templating  Session Support  Static Files Support  Middleware  Zum Beispiel Funktionen die sich zwischen Request und Response hängen können (Logger etc.)  Und vieles mehr… Installation npm install express --save var express = require("express"); var app = express(); app.get("/", function (request, response) { response.send("Hello World"); }); app.listen(3000);
  • 55. GET-Aktion  GET-Aktion mittels get-Funktion hinterlegen  Routing per String beschreiben  Parameter werden zusätzlich mit Doppelpunkt und Variablenamen beschrieben  state für Statuscode  Rückgabe-Funktion  render für HTML-Inhalt mit View Engine  send für Text-Inhalt  json für JSON-Inhalt  redirect zur Weiterleitung var express = require("express"); var app = express(); app.get("/api/sayHello/:name", (request, response) => { var name = request.params.name; if (!isNaN(name)) { response .status(400) .send("No string as name"); } else { response.json({ "message": name }); } }); app.listen(3000);
  • 56. Queries  Gewöhnliche Query-Parameter können ebenfalls abgefragt werden  Diese befinden sich unter request.query.PARAMETERNAME  Diese müssen nicht zusätzlich im Routing beschrieben werden var express = require("express"); var app = express(); // http:localhost:3000/api/sayHello?name=NodeJS app.get("/api/sayHello/", (request, response) => { var name = request.query.name; var result = { message: name }; if (!isNaN(name)) { response .status(400) .send("No string as name"); } else { response.json(result); } }); app.listen(3000);
  • 57. Express Pipeline  Node.js und Express.js unterstützen Middleware  Vergleichbar mit ASP.NET Pipeline oder ASP.NET MVC/Web-API Filters  Middleware wird über die use-Funktion Global für jede Anfrage bereitgestellt  Middleware kann ebenfalls als Single- Middleware einer einzelnen Anfrage mitgegeben werden (z.B. upload.array()) app.use("/", express.static("public")); app.use(bodyParser.urlencoded({ extended: true })); app.post("/api/sayHello", upload.array(), (request, response) => { ... });
  • 58. Express Pipeline Architektur app.use("/", express.static("public")); app.use(bodyParser.urlencoded({ extended: true })); app.post("/api/sayHello", upload.array(), (request, response) => { ... }); query Request http://localhost:3000/api/sayHello expressInit Static Handler Url Encoded Upload Array Anonym Function
  • 59. Eigene Middleware  Das Schreiben einer eigenen Middleware ist sehr einfach  Die Signatur der Funktion entspricht:  Request  Response  Next  Nach der Verarbeitung der eigenen Logik, muss nur die Next-Funktion aufgerufen werden, ansonsten wird die Pipeline nicht fortgesetzt var express = require("express"); var app = express(); function consoleWriter(request, response, next) { console.log("Request Path: " + request.path); next(); } app.use(consoleWriter); app.get("/", function (request, response) { response.send("Hello World"); }); app.listen(3000);
  • 60. Statische Dateien in Express bereitstellen  Wenn Sie statische Dateien wie Bilder, CSS-Dateien und JavaScript-Dateien bereitstellen wollen, verwenden Sie die in Express integrierte Middlewarefunktion express.static  Der Name dieses Verzeichnisses ist nicht Teil der URL  Alle weiteren Unterverzeichnisse werden ebenfalls automatisch bereitgestellt  Falls eine Index.html-Datei im Verzeichnis liegt, wird diese standardmäßig geladen var express = require("express"); var app = express(); app.use("/", express.static("public")); app.listen(3000);
  • 61. Der Vergleich ASP.NET ASMX  Wird bei ASP.NET Web-Forms als Standard verwendet  Kommunikation mittels SOAP  Verbirgt die Details wie der Service funktioniert Node.js/Express.js  Unterstützt kein SOAP  Ersichtlich wie der Service funktioniert  JSON Conversion per Standard verfügbar  Man muss verstehen, was man sendet (Statuscodes, Header etc.)
  • 62. Der Vergleich WCF  Konfiguration über Konventionen  Trennt die Transport Logik über Interfaces  Abhängig von der Konfiguration  Unterstützt ebenfalls REST durch zusätzliche Attribute Node.js/Express.js  Spezialisiert auf die HTTP-Kommunikation  Über die Middleware werden einfach weitere Kommunikationen ermöglicht (z.B. Web-Sockets mit Socket.io)  TCP ebenfalls möglich, benötigt dazu allerdings separate Implementationen  Kleine bis gar keine Konfiguration nötig
  • 63. Der Vergleich ASP.NET MVC / Web-API  Erstellt API je nach Rückgabetyp  Verwendet Attribute für keine-GET Funktionen  Integrierte View Engine per Standard  Route-Funktionen verstreut auf unterschiedliche Dateien, obwohl sie im gleichen Kontext liegen würden  Pushen von Daten nur mit SignalR möglich  Eigene Services dafür nötig  Web-API ist sehr ähnlich zu Express.js  Routing Regeln müssen zusätzlich über Route Location festgelegt werden  Mehr zusätzliche Konfigurationen nötig Node.js/Express.js  Verwendet für jede Funktion ein eigenes Verb  Pushen von Daten über Middleware einfach möglich (Socket.io)  Unterschiedliche View-Engines können verwendet werden  Unterschiedliche Route-Funktionen können in der gleichen Datei implementiert werden  Routing Regeln per Standard einfach vorhanden
  • 65. Jade  Ist eine View Engine und ähnlich zu ASP.NET MVC  Rendert Jade-Dateien zu HTML serverseitig  Master Templates können genutzt werden  Verfügt über Razor ähnliche Features  Aus eigener Erfahrung: Ist leider stark Fehleranfällig und Fehlermeldungen sind nicht aussagekräftig  http://jade-lang.com Installation npm install jade --save
  • 66. Jade mit Express.js  Es wird kein require für Jade benötigt  Einfach nur die View Engine registrieren  Express.js erstellt intern ein eigenes require  Jade-Datei mit Jade-Format erzeugen und referenzieren  Jade verwendet als Standardverzeichnis views var express = require("express"); var app = express(); app.set("view engine", "jade"); app.get("/", function (request, response) { response.render("jade/index“); }); app.listen(3000);
  • 67. Jade - View Template Format doctype html html(lang="en") head title= pageTitle script(type='text/javascript'). if (foo) { bar(1 + 5) } body h1 Jade - node template engine #container.col if youAreUsingJade p You are amazing else p Get on it! p. Jade is a terse and simple templating language with a strong focus on performance and powerful features. <!DOCTYPE html> <html lang="en"> <head> <title>Jade</title> <script type="text/javascript"> if (foo) { bar(1 + 5) } </script> </head> <body> <h1>Jade - node template engine</h1> <div id="container" class="col"> <p>You are amazing</p> <p> Jade is a terse and simple templating language with a strong focus on performance and powerful features. </p> </div> </body> </html> Jade-Format HTML-Format
  • 68. Jades Razor  Ein JSON-Objekt wird beim Rendern mitgegeben  Innerhalb einer Jades-Datei wird dann mittels „= JSON-Propertyname“ ein Binding erzeugt var express = require("express"); var app = express(); app.set("view engine", "jade"); app.get("/", function (request, response) { response.render("jade/index", { title: "Hello from Jade!" }); }); app.listen(3000); doctype html html(lang="en") head title= title body h1= title p This is an express app!
  • 69. Jades Layout File  Ein fixes Layout für alle Unterseiten kann festgelegt werden  Ähnlich zu ASP.NET Masterpages  In der layout.jade-Datei wird ein eigener Blockname definiert  In der Unterseite wird auf die Layout- Datei verwiesen und wie der eigene Blockname heißt doctype html html(lang="en") head title= title body block content footer This is the footer extends layout block content h1= title p This is an express app! index.jade layout.jade
  • 70. EJS  Ist eine View Engine und ähnlich zu ASP.NET Web-Forms  Steht für Embedded JavaScript  Verfügt über Razor ähnliche Features  Kann auch Masterpages nutzen  Benötigt dazu extra das Modul ejs-locals und muss bei Express.js registriert werden  http://www.embeddedjs.com Installation npm install ejs --save npm install ejs-locals --save
  • 71. EJS mit Express.js  Es wird kein require für EJS benötigt, nur für den Layout-Support (ejs-locals)  Einfach nur die View Engine registrieren  Express.js erstellt intern ein eigenes require  EJS-Datei im HTML-Format erzeugen und referenzieren  EJS verwendet als Standardverzeichnis views  Innerhalb von der Syntax <%- und %> wird JavaScript ausgeführt var express = require("express"); var app = express(); var ejsEngine = require("ejs-locals"); app.engine("ejs", ejsEngine); app.set("view engine", "ejs"); app.get("/", function (request, response) { response.render("ejs/index", { title: "Hello from EJS!" }); }); app.listen(3000); <!DOCTYPE html> <html> <head> <title> <%- title %> </title> </head> <body> <div> <%- title %> </div> </body> </html>
  • 72. EJS Layout File  Ein fixes Layout für alle Unterseiten kann festgelegt werden  Ähnlich zu ASP.NET Masterpages  In der layout.ejs-Datei wird ein eigener Blockname mit body definiert  In der Unterseite wird auf die Layout- Datei verwiesen ... <body> <div> <%- body %> </div> </body> </html> <% layout("layout.ejs") -%> <h1><%- title %></h1> <p>This is from <%- title %> </p> index.ejs layout.ejs
  • 73. Vash  Laut Webseite: „Vash, the 60 billion double-dollar template-maker.“  Ist eine View Engine und ähnlich zu ASP.NET MVC  Verwendet Razor-Syntax  Mehr als ähnlich ;)  Kann auch Masterpages nutzen  https://github.com/kirbysayshi/vash Installation npm install vash --save
  • 74. Vash mit Express.js  Es wird kein require für Vash benötigt  Einfach nur bei der View Engine registrieren  Express.js erstellt intern ein eigenes require  Vash-Datei im HTML-Format erzeugen und referenzieren  Vash verwendet als Standardverzeichnis views  Innerhalb von der @-Syntax wird JavaScript ausgeführt var express = require("express"); var app = express(); app.set("view engine", "vash"); app.get("/", function (request, response) { response.render("vash/index", { title: "Hello from Vash!" }); }); app.listen(3000); <!DOCTYPE html> <html> <head> <title> @model.title </title> </head> <body> <div> @model.title </div> </body> </html>
  • 75. Vash Layout File  Ein fixes Layout für alle Unterseiten kann festgelegt werden  Ähnlich zu ASP.NET Masterpages  In der layout.vash-Datei wird ein eigener Blockname definiert  In der Unterseite wird auf die Layout- Datei verwiesen und ein Block- Bereich festgelegt ... <body> <div> @html.block("body") </div> </body> </html> @html.extend("vash/layout", function(model){ @html.block("body", function(model){ <h1>@model.title</h1> <p>This is from the server!</p> }) }) index.vash layout.vash
  • 77. Der Vergleich ASP.NET  Internet Information Services (IIS)  Eigenständiger Dienst der Installiert und Konfiguriert werden muss  C#/VB.NET  EF/SQL Server  ASP.NET Web Forms  ASP.NET MVC/Razor  ASP.NET Web-API  SignalR  AngularJS/Ember/Backbone/KnockoutJS uvm. Node.js  Node.exe  Die Anwendung selbst stellt den Web-Server zur Verfügung. Konfiguration findet direkt im Code statt. (Leichtgewichtiger als IIS)  JavaScript  (Die gleiche Sprache wie auf dem Client)  Kann auch .NET-Code ausführen mit Edge.js  MongoDB oder andere Datenbanken  (SQL Server geht auch, nur kein EF Komfort)  Mehrere View Engines  EJS (Ählich zu Web Forms)  Jade/Razor (Ähnlich zu MVC/Razor)  Vash  Express  Socket.io  AngularJS/Ember/Backbone/KnockoutJS uvm.
  • 78. Microsofts Geheimplan: Node.js mit dem ChakraCore  Microsofts JavaScript Engine ChakraCore für Node.js  Microsoft setzt verstärkt auf Cloud-First  ASP.NET vNext setzt komplett auf Node.js-Konzepte  Cross-Plattform Support für .NET  Modular durch Paketmanager  Und vieles weitere…  Tools für die Node.js-Entwicklung  Visual Studio, VS Code
  • 79. Ein Experiment von Microsoft zeigt… Quelle: http://news.softpedia.com/news/and-so-it-begins-microsoft-asks-node-js-to-allow-chakracore-edge-alongside-google-s-v8-engine-499183.shtml
  • 80. Kann bereits selbst getestet werden  Läuft neben einer bereits installierten Node.js-Version  https://github.com/Microsoft/node/releas es/tag/node-chakracore-6.0.0-pre2
  • 81. FRAGEN? Kostenlose Artikel zum Thema Node.js auf http://www.cross-platform-blog.de