# Använda "mustasch.js" via mimer-render
```
author: krm
created: 2025-05-07
status: alpha
```
# 👁️🗨️ Om detta avsnitt
mimer-render är ett enkelt middelware för Hono skapat för att göra det väldigt
enkelt att anävända mustasch.
- 🦉 [Skapa ett projekt för en webbserver](./create-a-project-for-webserver.sv.html)
# ❓ Vad är "mustasch.js"?
Ett bibliotek som gör att vi kan substituera in värden i mallar.
# 1. Hämta koden
Ladda ned koden som du hittar i
[https://htsit.se/f/mimer-render.ts](https://htsit.se/f/mimer-render.ts).
```sh
curl -LOk https://htsit.se/f/mimer-render.ts
```
Du kan också hitta senaste versionen av koden i projektet [ada](git@gitlab.com:krmit/ada.git).
# 2. Lägg den på rätt ställe
Och lägg det i din "src" map där du har all annan kod till ditt
projekt.
```sh
cp mimer-render.ts MITT_PROJEKT/src
```
# 3. Skapa en mapp för din mallar.
Du behöver skap en mapp för att ha din amllar. Förslagsviss på samma
nivå som src.
```sh
mkdir template
```
# 4. Skapa en fil som du kallar "head.txt"
Du behöver skap en mapp för att ha din amllar. Förslagsviss på samma
nivå som src.
```html
{{title}}
```
Innehållet i dennakommer alltid placeras över i mallarna.
# 5. Skapa en fil som du kallar "foot.txt"
Du behöver skap en mapp för att ha din amllar. Förslagsviss på samma
nivå som src.
```html
```
Innehållet i denna fil kommer alltid placeras under i mallarna.
# 6. Lägg till en fil som innehåller en mall
Lägg till en i mappen för att testa om det fungerar. Vi kallar den här
"test.html"
```html
{{title}}
```
# 7. Importera den i din kod
Gå till filen där du har din Hono app.
```js
import { mimerRender } from "./mimer-render.ts";
```
# 8. Updatera typen beskrivningen av Hono
Hono'måste ha en intern variabel template av typen string.
```js
type Variables = {
template: string;
};
const app = new Hono<{ Variables: Variables }>();
```
# 9. Lägg till mimer-render som midelware
Gör detta föra andra anrop med "app", men efter eventuell anrop för
logging.
```js
app.use("/*", await mimerRender("template"));
```
# 10. Gör ett anrop som ska bli renderat.
Ett vanligt HTTP get anrop.
```js
app.get("/test", (c) => {
// CODE
});
```
# 11. Välj vilken mall som ska användas
Sätt en variabel template
```js
c.set("template", "index");
});
```
# 12. Avsluta anropet genom att skicka vidare json.
```js
return c.json({ title: names.welcome });
```
# 13. ✔️ Starta om servern och testa anropet
Starta om server och gå in på sidan:
- [http://localhost:8000](http://localhost:8000)