Archetype Quiz Vorlage

Mit ArchetypeQuiz bauen Sie Quizzes, bei denen Antworten auf Archetypen mappen. Das Ergebnis ist der Archetyp mit den meisten Stimmen.

Nutzung

Legen Sie eine neue Markdown-Datei an (z.B. docs/de/quizzes/mein-quiz.md) und nutzen Sie:

<ArchetypeQuiz 
  :questions="questions" 
  :archetypes="archetypes" 
  emailEndpoint="/.netlify/functions/record-quiz"
  quizName="Mein Quiz"
>
  <template #intro>
    <div class="intro-content">
      <h1>Finde Deinen Typ</h1>
      <p>Mach das Quiz und erfahre deinen Archetyp.</p>
    </div>
  </template>
</ArchetypeQuiz>

<script setup>
const questions = [
  {
    id: 'q1',
    prompt: 'Was ist deine Lieblingsfarbe?',
    options: [
      { value: 'red', label: 'Rot' },
      { value: 'blue', label: 'Blau' }
    ]
  }
];

const archetypes = {
  red: {
    title: 'Roter Archetyp',
    description: 'Leidenschaftlich und energiegeladen.',
    action: 'Nutze deine Energie für Umsetzung.'
  },
  blue: {
    title: 'Blauer Archetyp',
    description: 'Ruhig und analytisch.',
    action: 'Setze deine Analyse für Problemlösung ein.'
  }
};
</script>

Props

Prop	Typ	Pflicht	Beschreibung
questions	Array	Ja	Fragenobjekte
archetypes	Object	Ja	Archetyp-Definitionen
emailEndpoint	String	Nein	POST-URL für Quiz-Ergebnisse
quizName	String	Nein	Name für Tracking

Datenstrukturen

Question

{
  id: 'unique_id',
  prompt: 'Fragetext',
  options: [
    { value: 'archetype_key', label: 'Antworttext' }
  ]
}

Archetype

{
  title: 'Titel',
  description: 'Beschreibung',
  action: 'Nächster Schritt'
}