Node - en första serverapplikation
Nu ska vi skapa vår första riktiga serverapplikation med Node. För att göra det ska vi ta Express till hjälp. Det är ett minimalistiskt ramverk som används för att bygga serverapplikationer. Med det i grunden så slipper man skriva massvis med onödig kod samtidigt som man vet att den grundkod som finns med är vältestad och förhoppningsvis buggfri. Det gör att man snabbare kan komma igång med sin applikation och koncentrera sig på den viktiga delen av koden.
Om du inte följde med i exemplen i npm-delen. Måste du först av allt installera ”Express Generator” för att kunna följa med i exemplen i denna aktivitet. Detta kan du göra genom att gå till en kommandorad och skriva följande:
npm -g install express-generator
Om allt gick bra, så har du nu allt som behövs för att hänga med i exemplen.
Vi ska först av allt skapa en tom katalog som ska tjäna som hemvist för vår applikation. Skapa en tom katalog, gå in i en kommandorad och ställ dig i den tomma katalogen. Nu ska vi skapa grunden för vår applikation. Det gör du genom att köra detta kommando:
express
Detta lägger till massvis med kataloger och filer. Dessa kommer att tjäna som grunden för din webbapplikation. Vi kan redan nu provköra vår applikation. Enklast gör du det genom att köra följande i kommandoraden:
npm start
npm kommer nu att kolla så att alla paket som vår applikation beror på är tillgängliga. Vilket de bör vara när vi precis initierat vår applikation. Sen kör den igång Node och startar vår kod.
För att testa att allt fungerar som det ska kan du gå in i en webbläsare på samma dator som du kör applikationen och som URL skriver du localhost:3000. Då ansluter sig webbläsaren till port 3000 på vår lokala maskin, vilket är defaultporten i applikations-ramverket. Du bör nu få ett litet välkomstmeddelande som visar att express är igång. Hitintills har vi en riktigt tråkig applikation!
Nu ska vi titta närmare på vad som egentligen installerades när vi körde Express. Du bör ha fått en filstruktur som ser ut ungefär så här:
.
├── app.js
├── bin
│ └── www
├── package.json
├── public
│ ├── images
│ ├── javascripts
│ └── stylesheets
│ └── style.css
├── routes
│ ├── index.js
│ └── users.js
└── views
├── error.jade
├── index.jade
└── layout.jade
7 directories, 9 files
Vi går igenom vad sakerna är ifrån toppen på filstrukturen.
app.js
Detta är grunden till vår applikation. Här kommer vi att ändra på vissa saker allteftersom vi bygger ut vår applikation.
bin
Här återfinner vi filen www. Detta är filen som kommer att öppna portar och skapa grundservern för oss. I de flesta fall vill vi inte in och ändra här.
package.json
Projektets package.json är ifylld med minimal information. Du vill antagligen lägga till mer metadata om projektet i den. Läs på i tidigare aktiviteter för att se mer om vad du kan göra här.
Under dependencies-biten återfinns de paket som Express automatiskt lade till. Om du vill använda flera paket, kan du lägga till dem med npm och se till att ha flaggan ”--save”.
public
Här lägger du material som inte ska vara statiskt. Det vill säga det kommer inte att ändra sig utifrån vad applikationen gör. Det kan vara saker som bilder, CSS-stylesheets och rena statiska webbsidor.
routes
Här ligger det som kommer att bli huvuddelen i din kod. När användaren går till olika URL:er som matchar filerna i denna katalog, så kommer kod som är kopplad till dessa filer att exekveras. Detta är ett kraftfullt koncept kring vilket många webbapplikationer är uppbyggda. Vi återkommer till detta.
views
Här finns mallar som kommer att köras när applikationen ska generera dynamiska webbsidor. Default använder sig Express av mallsystemet som heter Jade. Det är inte helt nödvändigt att använda sig av detta och det kan kännas lite krångligt i början. Så till att börja med kommer vi att generera vår HTML-kod själva.
Nästa aktivitet
Det är nu dags att börja titta på hur applikationskoden fungerar.