# 👁️‍🗨️ Om detta avsnitt

Hur vi kan använda mustasch och att läsa in filer samt de ett svar om någon frågar efter index filen. Du behöver läsa in webbfiler samt installerat.

• 🦉 Skapa webb mapp för statiskt innehåll
• 🦉 Ge ett svar på ett http get-anrop
• 🦉 Skapa en webbsida

❓ Vad är "mustasch.js"?

Ett bibliotek som gör att vi kan substituera in värden i mallar.

1 Skapa en funktion som anropas när servern anropas

Vill vill svara på ett anrop till rotten av sökvägen med ett get anrop, det som motsvara inde.html. Denna kod ska vara för anra anrop inklusive midelware som skapar webbmappar.

app.get("/", async function(req, res) {
// CODE
});
  

2 Skapa webbsida som vi kan använda

Skapa en webbsida som beskrivit i tidigare guider.

3 Läs index.html filen

I funktionen ovan lägg till följande kod som läser in en fil.

const template = await fs.readFile("./template/index.html", "utf-8");
  

4 Installera paketet “mustache” och typerna till “mustache”.

Kör dessakommandon i terminalen.

npm install mustache
npm install @types/mustache
  

5 Importera Mustache i servern

Skriv denna kod högst upp i programmet.

import mustache from "mustache";
  

6 Vi vill först skapa data som vi kan använda i vår mall

Lägg till denna kod "callback" funktionen ovan.

const data = {"name": "my site"};
  

7 Vi vill nu rendera template med data

Vi ska använda datan ovan till rendering av mallen med hjälp av "mustache".

const document = mustache.render(template, data);
  

8 Skicka ett svar på frågan

I vår funktion ovan lägg till ett svar till servern.

res.send(document);
  

9 I index.html ändra rubriken så data kan vissa istället.

Anpassa koden nedan utifrån vilka egenskaper du lägger i data objectet och lägg den i index filen.

<h1> Welcome to {{name}}! </h1>
  

10 ✔️ Starta om servern och testa anropet

Starta om server och gå in på sidan: