1. Was ist eine Template Engine? 🛠️

Eine Template Engine ist ein Werkzeug, das HTML oder andere Markup-Sprachen mit dynamischen Daten verbindet. Sie erlaubt es Entwicklern, statische Vorlagen mit Platzhaltern zu verwenden, die später durch echte Daten ersetzt werden.

Beispiel für eine einfache Vorlage:

<h1>Hello, {{ name }}</h1>

In dieser Vorlage wird {{ name }} später durch den tatsächlichen Wert der Variable name ersetzt, z. B. Omar.

Typische Einsatzbereiche:

• Erstellung dynamischer Webseiten.
• Serverseitiges Rendering (z. B. in Node.js, PHP).
• E-Mail-Templates.

2. Wie funktioniert eine Template Engine? 🔍

🧩 Die drei Hauptphasen:

1. Parsing (Analysieren):
   • Die Vorlage wird analysiert und in eine Zwischenstruktur umgewandelt (oft ein AST - Abstract Syntax Tree).
2. Kompilierung:
   • Der AST wird in ausführbaren Code übersetzt. Dies ermöglicht dynamische Datenverarbeitung.
3. Rendering:
   • Der Code wird ausgeführt, und die Platzhalter ({{ ... }}) werden durch die entsprechenden Daten ersetzt.

Ein vereinfachtes Beispiel:

function parseTemplate(template, context) {
  return template.replace(/\\{\\{(.+?)\\}\\}/g, (_, key) => context[key.trim()]);
}

const template = "<h1>Hello, {{ name }}</h1>";
const context = { name: "Omar" };
console.log(parseTemplate(template, context));
// Ausgabe: <h1>Hello, Omar</h1>

3. Vorteile von Template Engines ✅

• 🖋️ Klarheit: Ermöglicht eine saubere Trennung zwischen HTML und Logik.