TDP013 Node.js, JSCoverage, Mocha. Marcus Bendtsen Institutionen för Datavetenskap

Transkript

1 TDP013 Node.js, JSCoverage, Mocha Marcus Bendtsen Institutionen för Datavetenskap

2 Återblick - Progressive Enhancement

3 HTML, CSS, JavaScript - Klienten

4 Den statiska webben... Vi känner till HTML, CSS och JavaScript. Dokument som skickas till och tolkas av webbläsaren. Informationen är dock statisk, dessa dokument förändras aldrig. Vad innebär en dynamisk webb? Är det ett problem?

5 Klient 1 begär statiska dokument (html, css, js)" Klient 1 och Klient 2 känner inte till varandra." Klient 2 begär statiska dokument (html, css, js)"

6 Användare fyller i formulär." " Annons visas på hemsidan." " Vem skapar HTML, CSS och Javascript för annonssidan?

7 Söker på ordet bike, så listas bilder och text." " Hur skapades den här listan? Vem skrev HTML, CSS och Javascript?" " Hur visste de att jag skulle söka på bike?" " Finns det färdiga HTML sidor för alla tänkbara nyckelord?

8

9 Det saknas något... Det räcker alltså inte med att kunna HTML, CSS och Javascript för att uppnå det dynamiska som ofta visas på webbplatser idag." " Men webbläsaren förstår inget annat än HTML, CSS och Javascript."?

10 Vi behöver något som kan dynamiskt skapa innehåll som vi kan presentera för användaren

11 Statisk filserver Vi vill kunna skicka information till servern via HTTP som vi senare kan hämta igen och uppdatera vår sida med."?

12 En miljö för att köra JavaScript på servern, dvs man kan köra JavaScript utanför webbläsaren. Node.js Bygger vidare på V8 - Googles opensource JavaScript motor. Node.js är inte en HTTP server, men det är väldigt lätt att skriva en sådan i Node.js. JavaScript har en event-struktur med callbacks som används kraftigt i Node.js, därför kan det vara lite ovant i början för programmerare som inte arbetat så förut. Man hittar Node.js på GitHub

13 Med Node.js skapar vi en HTTP server med hjälp av JavaScript Node.js Denna server kan ta emot data skickat via HTTP GET och POST (och andra HTTP metoder), och skicka tillbaka data i t ex JSON format Förutom att ta emot och skicka tillbaka data så kan Node.js kommunicera med en databas Detta gör det möjligt att ha persistent data som vi kan skriva och hämta ifrån

14 Node.js Hello World! var http = require( http ); Require används för att använda funktioner från andra moduler (filer). Detta modulsystem tillhör Node.js och kan inte användas när man skriver JavaScript i Webbläsaren. http.createserver( function(request, response) { }).listen(8888); Vi använder http (den modul vi inkluderade) och anropar funktionen createserver. Som argument till funktionen skickar vi en callback funktion. Denna funktion kommer exekveras för varje HTTP request.

15 Node.js Hello World! var http = require( http ); http.createserver( function(request, response) { }).listen(8888); response.writehead(200, { Content-Type : text/plain }); response.write( Hello World ); response.end(); Returnera HTTP status 200 och Hello World för alla anrop till servern.

16 HTTP GET Såhär kan vi skicka parametrar till vår server för att testa att det fungerar som tänkt. Namnet på parametern är "name" och värdet är "marcus".

17 var http = require('http'); var url = require('url'); Node.js GET Parameters http.createserver(function(request,response) { var urlparts = url.parse(request.url, true); }).listen(8888); response.writehead(200, {'Content-Type':'text/plain'}); response.write('hello, ' + urlparts.query['name']); response.end();

18 Node.js GET Parameters var http = require('http'); var url = require('url'); http.createserver(function(request,response) { var urlparts = url.parse(request.url, true); }).listen(8888); response.writehead(200, {'Content-Type':'text/plain'}); response.write('hello, ' + urlparts.query['name']); response.end(); Anropa detta: Output: Hello, Marcus

19 Det klassiska sättet servern tar hand om requests att skapa en ny tråd för varje inkommande anrop, dessa trådar delar CPU tid. Ett problem med detta är att det tar tid att skapa trådar (och minne), och har man många små requests blir det krävande.

20 I Node.js har vi bara en tråd. Alla requests hamnar i en event-loop. Detta gör att vi slipper de restriktioner och overhead som det innebär med trådade servrar. Läs mer på node.js/about

21 Node.js Event-loop Node.js använder bara en tråd, alla requests kör i denna. Detta innebär att man måste tänka sig för på vissa punkter. Om Node.js väntade på varje rad kod att exekvera innan den fortsatte skulle detta innebära att alla som gjorde anrop till servern fick vänta. var data = module.longrunningprocess(); Om vi är oförsiktiga och använder kod som denna på fel ställe kan det resultera i att alla anrop får vänta väldigt länge på varandra.

22 Node.js Event-loop http.createserver( function(request, response) { var data = module.longrunningprocess(); }).listen(8888); Servern kan inte ens börja ta hand om inkommande requests tills den första är klar.

23 Node.js Asynchronous callback module.longrunningprocess(function(data) { //Do something }); Istället för att vänta på svar från en funktion som tar lång tid så skickar vi med en callback. När funktionen är klar exekveras vår callback. På så vis kan vi fortsätta hantera andra requests i väntan på longrunningprocess() Asynchronous callbacks är ett centralt begrepp i Node.js och används väldigt mycket

24 Node.js Vi har tittat på callbacks som en del av Node.js Innan vi tittar på ett större exempel ska vi titta på: Egna moduler Organisation av filer i projekt NPM (plugin system till Node.js) JSCoverage (code-coverage) Mocha (unit tests)

25 var http = require("http"); Node.js - Modules function start() { function onrequest(request, response) { console.log("request received."); response.writehead(200, {"Content-Type": "text/plain"}); response.write("hello World"); response.end(); Vi använde tidigare http } modulen, hur skapar vi egna? http.createserver(onrequest).listen(8888); console.log("server has started."); } exports.start = start; Spara koden i en fil som kallas server.js Lite annorlunda upplägg på server koden här

26 Node.js - Modules var server = require("./server"); server.start(); I en annan fil kan vi nu inkludera vår modul server

27 Node.js - Organisation & NPM Skapa en mapp för projektet (projektmappen) I projektmappen skapar man mapparna lib och test NPM är ett paket system som laddar ner moduler, lite som apt i Debian baserade Linux system När man använder NPM skall man stå i roten av projektet (dvs projektmappen) Första gången man använder NPM skapas mappen node_modules i projektmappen. 13

28 Mocha Code Coverage Installera JSCoverage (inte en NPM modul) finns på GitHub Stå i projektmappen och exekvera jscoverage lib lib-coverage då skapas mappen lib-coverage och placerar instrumented versioner av lib filerna i mappen lib-coverage. De testfall man skriver skall testa de "instrumenterade" versionerna av servern, dvs de som finns i lib-coverage 16

29 Mocha Testning av Node.js Stå i roten av projektet och exekvera npm install mocha npm install should npm install superagent Skriv testfall och placera de i mappen test Observera: Testverktyget Mocha tillåter många olika sätt att skriva testfall på, ta notis på hur källkoden från föreläsningen gör för att undvika friktion i arbetet../node_modules/.bin/mocha -R html-cov > coverage.html Öppna coverage.html för att se code-coverage 15

30 Node.js Live Demo /lib requesthandlers.js route.js server.js main.js /lib-coverage "instrumented" versioner /npm_modules Installerade moduler /test test.js Läs på 14

31 Laboration 2 Kom ihåg att en del av kravlistan är att installera Node.js, NPM, Mocha, JSCoverage och MongoDB. Men hjälp gärna varandra, detta räknas inte som fusk. Oftast måste man ladda ner källkoden för Node.js, NPM och JSCoverage och bygga själv. Kom ihåg att köra JScoverage varje gång ni ändrat er node.js kod innan ni kör Mocha 17

32