Kategorie: Lernreihe

  • Vom Problem zum Tool in 6 Stunden: Mein AEVO-Simulator mit Lovable & ChatGPT

    Vom Problem zum Tool in 6 Stunden: Mein AEVO-Simulator mit Lovable & ChatGPT

    Ich hatte keine Lust, Geld für eine Lern-App auszugeben oder mir Bücher zu kaufen. Also habe ich mir in 6 Stunden meine eigene gebaut – mit ChatGPT, Lovable.

    Wer nicht lesen und direkt zur Lösung will: aevo-trainer.davidsblog.eu

    Aber kurz Zum Anfang. Die Ausbildereignugsprüfung besteht aus zwei Teilen. Einen praktischen Teil und einem schriftlichen. Der schriftliche Teil ist einfach aufgebaut:

    • 180 Minuten Zeit
    • 80 (mittelschwere) Fragen
    • Multiple Choice oder Single Choice – also nur Ankreuzaufgaben

    Auf den praktischen Teil gehe ich in diesem Artikel nicht ein. Mir ging es erstmal nur um die Theorieprüfung und die Frage: Wie bereitet man sich darauf am besten vor? Im Grunde gibt es zwei klassische Wege. Entweder man holt sich ein Übungsbuch mit Testprüfungen oder man bezahlt für irgendwelche Lernapps. Oder man macht es wie ich und nutzt die übrigen Tokens aus einem Hackathon, kombiniert Lovable, ChatGPT und GitHub und baut sich einfach seine eigene Software. Genau darum soll es hier gehen: wie ich mir eine Prüfungs-Simulation gebaut, deployed und am Ende auch wirklich zum Lernen genutzt habe.

    Zusammenfassung

    EigenschaftTechnologie / Tool
    FrameworkNext.js (React)
    StylingTailwind CSS
    AI-BuilderLovable.dev
    LLMsChatGPT, Gemini
    DatenstrukturStatisches JSON-Array
    VersionsverwaltungGitHub
    DeploymentGitHub Pages & Actions
    DomainNetcup (Subdomain)
    Budget0 € (Free-Tiers / Tokens)

    Schritt 1: Die Idee

    Am Anfang war ich in der Stadtbibliothek und habe geschaut, ob es die passenden Bücher für Übungsaufgaben gibt. Gab es auch, aber eben aus dem Jahr 2009. Inzwischen hat sich so viel weiterentwickelt und geändert, dass mir die Fragen und Antworten aus dem Buch heutzutage nicht weiterhelfen würden.

    Was ist Plan B? Eigenes Geld in die Hand nehmen! Aber ganz ehrlich: die Prüfungsanmeldung selbst hat so viel gekostet. Jetzt noch ein Buch zu kaufen war nicht so meins. Also mach ich es einfach und nutze KI. Die KI (ChatGPT) stellt fragen, ich antworte und die KI sagt mir schließlich, ob meine Antworten richtig waren.

    An sich ganz cool, aber es fehlen zwei Aspekte: eine richtige Prüfungssimulation mit mehreren Fragen hintereinander und eben ein Timer, damit man sich schonmal an die Zeitbegrenzungen gewöhnen kann. Was macht man? Man baut eine eigene Lösung!

    Schritt 2: Der Plan und Umsetzung auf Lovable

    Ich hatte von einem Hackathon noch Tokens übrig. Tokens für die Nutzung verschiedener KI-Modelle auf Tensorix und ein Probemonat für Lovable. Und GitHub ist sowieso für die meisten Funktionen kostenlos. Schließlich lege ich los.

    Ich habe mir davor Gedanken gemacht und zusammen mit ChatGPT den besten Prompt für Lovable ausgearbeitet. Eines war mir wichtig: die Software sollte in next.js geschrieben sein und eine minimalistische UI haben. Schon das erste Ergebnis war erstaunlich. Nicht nur, dass Lovable die UI-Anforderungen komplett erfüllte, nein, auch im Code wurde alles so gemacht wie gewünscht. So gibt es ein zum Beispiel File, wo ich alle Fragen und Antworten als JSON in einem Array speichere, so wie in meinem Prompt angegeben.

    Warum aber genau als JSON im Frontend und nicht in der Datenbank oder live Fragen von der KI generieren lassen? mehr dazu später. Im folgenden ein Beispiel JSON-Eintrag im Array:

    {
        handlungsfeld: "3",
        schwierigkeit: 3,
        question: "Beim 'Blended Learning' werden verschiedene Lernformen kombiniert. Welche Kombination ist hier typisch?",
        answers: {
          A: "Präsenzunterricht im Betrieb und E-Learning-Phasen.",
          B: "Lernen während der Arbeit und Lernen in der Freizeit.",
          C: "Vortrag des Ausbilders und anschließendes Gruppengespräch.",
          D: "Verbindung von Theorie in der Berufsschule und Praxis im Betrieb."
        },
        correct_answer: ["A"],
        explanation: "Blended Learning (integriertes Lernen) bezeichnet die didaktisch sinnvolle Verknüpfung von traditionellen Präsenzveranstaltungen und modernen Formen von E-Learning.",
        question_type: "normal"
      }

    Meine zwei Tipps: bevor ihr mit dem Prompt beginnt, macht euch zumindest auf dem DIN A4 Papier grob eine Skizze oder generelle Planung der Software, also der Vision, die ihr im Kopf habt. So könnt ihr detailiertere Prompts geben. Der zweite Tipp betrifft Prompts: wenn ihr bei euren Tokens begrenzt seid, gebt eure Eingabe einem kostenlosen Modell wie ChatGPT oder Gemini und fragt nach Verbesserungen und Tipps. Es passiert schnell, dass man was offensichtliches übersieht.

    Schritt 3: Anpassungen

    Ich habe auf Lovable mehrere Anpassungen vorgenommen. Klar, das Ergebnis war bereits echt gut, aber man merkt eben nachträglich, dass man im Prompt doch das ein oder andere vergessen hat. So habe ich auf der Landingpage einen Absatz über mich hinzufügen lassen, also wer ich bin und warum ich das Projekt mache und einen Bereich für Sponsoren und Spender. Ich habe aber den Sponsoren-Bereich vorerst auskommentiert, weil der Bereich optional für die Zukunft ist, falls die Nachfrage nach der Lösung größer sein sollte als erwartet.

    Schritt 4: Umzug auf GitHub und kleine Anpassungen

    Nachdem alles auf Lovable gepasst hat, habe ich den Code in ein eigenes GitHub-Repo übertragen und direkt gecloned, damit ich lokal weiterarbeiten kann. Hinzu kamen noch kleine Veränderungen, wie zum Beispiel Anpassung der Inhalte im Impressum. In dem Stadium war die Software schon fertig. Doch es fehlte eins: die Fragen.

    Schritt 5: Die Fragen

    Wie bereits davor erwähnt habe ich die Fragen in einem statischen Array hinzugefügt. Deswegen ging es nun ans generieren. ChatGPT und Gemini sind heißgelaufen. Die Fragen wurden generiert und direkt von mir kopiert und in das Array hinzugefügt. Problem: natürlich sind jetzt viele Fragen doppelt oder sogar dreifach im Array drin (weil klar, woher sollen die Modelle wissen, wer welche Frage schon erstellt hat?), aber das war in diesem Moment nicht für mich relevant. Und jetzt zu den drei wichtigsten Fragen:

    • Warum in einem Array und nicht in einer Datenbank? Ganz einfach: ich wollte so schnell wie möglich anfangen zu lernen und nicht erst mich damit beschäftigen, eine Datenbank aufzusetzen. Klar, designtechnisch ist es nicht schön gelöst, da alle Fragen vom user vor der Nutzung heruntergeladen werden müssen. Aber bei einer Größe unter 200kb noch vertretbar. Also: bei einem Privatprojekt ja, bei einem Kundenprojekt bitte niemals machen.
    • Warum eine Liste an Fragen erstellen und nicht von der KI live generieren lassen? Es wäre praktisch, wenn Fragen live von LLMs generiert werden und die KI gezielt die Schwächen der User erkennt und diese trainiert. Hierbei gibt es aber ein Problem: LLMs kosten Tokens und ich will kein Open Source Projekt machen, wo ich monatlich bezahlen muss. Und dazu gibt es auch eine klare Eingrenzung der Fragen in der AEVO Prüfung auf die vier Hauptbereiche. Wenn im Array jetzt 500 Fragen und Antworten drin sind, dann hat man eigentlich alle Themen abgedeckt. Also warum dann immer neu generieren lassen, wenn jeder user sowieso die gleichen oder zumindest ähnliche Fragen bekommt?
    • Wie gehe ich sicher, ob die Antworten richtig sind, wenn ich sie blind von der KI übernehme? Ehrlich gesagt: Ich hab’s beim Lernen gecheckt. Für einen kompletten Anfänger wäre das riskant, aber da ich schon 150 Seiten Buch hinter mir hatte, war mein Bullshit-Detektor scharf genug. Wenn mir eine Antwort komisch vorkam, hab ich kurz gegoogelt. So hab ich die App während des Nutzens quasi „live“ korrigiert. Ein cooler Nebeneffekt: Durch das Fehlersuchen lernt man fast noch mehr.

    Schritt 6: letzte Anpassungen und mehr Fragen

    Nun, die Software war fertig und hatte über 300 (generierte) Fragen inkludiert. Nun ging es an die letzten Anpassungen:

    • Erstellung eines Cookie-Banner (nur um hinzuweisen, dass es keine Cookies gibt)
    • Entfernung von Google Fonts die von Lovable automatisch hinzugefügt wurden.
    • Veröffentlichung auf GitHub Pages mithilfe von GitHub Actions, hierfür habe ich ein Workflow für GitHub Actions geschrieben
    • Und zu guter letzt: eine neue Subdomain auf netcup erstellen und mit GitHub Pages verbinden!

    Wie ist es eigentlich mit dem Urheberrecht?

    Bei der Theorieprüfung zum Führerschein ist es so, dass es eine feste Liste an Fragen gibt und diese natürlich urheberrechtlich geschützt sind (Fragenkatalog). Die darf man also nicht einfach übernehmen oder veröffentlichen. Bei der AEVO Prüfung ist das anders. Es gibt keine feste Fragenliste, sondern die Fragen variieren bei jeder Prüfung und decken die vier Handlungsfelder ab. Solange die Fragen selbst generiert sind und nicht einfach 1 zu 1 aus Büchern, Apps oder alten Prüfungen kopiert werden, bewegt man sich hier auf der sicheren Seite.

    Und klar, Logos von IHK oder HWK zu verwenden ist natürlich nicht erlaubt, aber das versteht sich von selbst.

    Open Source & GitHub

    Wer jetzt Lust bekommen hat, selbst mal reinzuschauen oder das Ding für seine eigene Prüfung (oder ein ganz anderes Thema) zu erweitern: Nur zu! Ich habe den kompletten Code auf GitHub veröffentlicht. Ihr könnt das Repository gerne forken, kopieren oder nach euren Wünschen anpassen.

    Hier geht’s zum Projekt: https://github.com/RischDav/aevo-trainer-hub

    Vielleicht hat ja jemand Lust, das oben erwähnte Python-Skript zur Dubletten-Prüfung einzubauen: ich freue mich über jeden Pull-Request!

    Learnings

    Von der ersten Idee bis zur fertigen Software inklusive der Fragen hat es am Ende nur etwa 6 Stunden gedauert und ich habe dabei echt viel gelernt. Es war das erste Mal, dass ich richtig mit Lovable gearbeitet habe und gerade in Kombination mit meinen Programmiererfahrungen hat das super funktioniert, weil ich Dinge im Code direkt selbst anpassen konnte.

    Ein Beispiel: Durch das Hin-und-Her-Generieren mit ChatGPT und Gemini hatte ich am Ende einige Fragen doppelt im JSON. Klar, ich hätte mir kurz ein Python-Skript schreiben können, das die Texte vergleicht und Dubletten (z.B. per Levenshtein-Distanz) rauskickt. Das wäre die „saubere“ Entwickler-Lösung gewesen. Aber ganz ehrlich? Für meinen privaten Lern-Sprint war mir das egal. Ich wollte lernen, nicht die perfekte Datenbank-Struktur gewinnen.

    Genau das hat für mich den Unterschied gemacht. Was ich dabei am spannendsten fand: wie schnell man heute von einem Problem zu einer funktionierenden Lösung kommt. Vor ein paar Jahren hätte ich dafür deutlich länger gebraucht, jetzt sind es ein paar Stunden. Und genau das macht es irgendwie auch so cool.

  • Ich lerne PyTorch – Tag 1

    Ich lerne PyTorch – Tag 1

    Person sitzt nachts am Computer und schreibt PyTorch code. KI-generiertes Bild.

    Heute geht es los, ich will PyTorch lernen. Warum? Naja, KI ist heutzutage nicht mehr wegzudenken und KI nicht nur nutzen, sondern auch eigene Modelle entwickeln zu können, ist eigentlich ein richtig guter Skill heutzutage, der sich gut im Lebenslauf macht. Deswegen mein Ziel: jeden Tag ein bisschen PyTorch lernen und euch auf die Reise mitnehmen.

    Schritt 1 – PyTorch oder Tensorflow

    Also bevor wir überhaupt loslegen können (und bevor ich die Serie gestartet habe) kam die erste große Frage: Tensorflow oder PyTorch. Beide sind gute Frameworks und weit verbreitet. Doch nach kurzer Recherche war für mich klar: es wird PyTorch. Warum? Ganz einfach:

    1. Es ist einfach erlernbar und sehr intuitiv, als würde man Python-Code schreiben
    2. PyTorch hat deswegen derzeit die Nase vorne. Vor allem bei Startups und bei Forschungsprojekten.

    Und klar: Tensorflow hat die Nase vorne, wenn es um große Projekte in der Industrie geht, aber das ist jetzt nicht mein Ziel. Ich will erstmal klein anfangen und eigene Projekte realisieren

    Schritt 2 – Installation

    Jetzt benötigen wir alle Tools. Unter anderem Jupyter Notebook, weil sich damit das Arbeiten besonders angenehm gestaltet und man auch Zeile für Zeile die Ausgaben sieht…gut fürs Debugging.

    Mein Vorteil: Ich hatte bereits Python installiert und konnte deswegen einfach mit den Befehlen

    pip install torch torchvision
    pip install notebook

    bereits PyTorch und Jupyter Notebook installieren. Dann kann man bereits loslegen, oder?

    Schritt 3 – Das venv-Problem

    Ich sage so wie es ist: ich lerne teilweise mithilfe von Google Gemini. Besonders die ersten Schritte und auch Bugs lösen. So hat mit Gemini vorgeschlagen ein virtuelles Environment mit Venv zu erstellen. Warum? Wenn ich in Zukunft weitere Packages mit pip installiere, gehe ich sicher, dass keine Konflikte entstehen. Also, ich gehe in das Verzeichnis und erstelle ein eigenes Venv environment. Dafür gehe ich in den Ordner und gebe ein:

    python -m venv venv
    source venv/bin/activate

    Mit den Befehlen erstelle ich eine neue Umgebung und aktiviere sie bereits.

    Schritt 4 – Alles installiert?

    Ab jetzt bin ich im Terminal in der neuen Umgebung drin. Danach nochmal PyTorch und Jupyter Notebook über Pip installieren und es geht los:

    jupyter notebook

    Und es öffnet sich ein neues Browserfenster auf localhost:8888 und es kann losgehen. Ich erstelle eine neue Notebook-Datei und wie es sich gehört starte ich erstmal mit print(„Hallo Welt“) – siehe da, es klappt. Dann noch kurz testen, ob PyTorch installiert wurde:

    import torch
    x = torch.rand(5, 3)
    print(x)

    Und siehe da, die Ausführung klappt! Der Beweis, dass Pytorch installiert wurde!

    Danke, dass du bis hier hin gelesen hast, morgen geht es weiter!

    Hier noch die Installationsanleitung, die ich für PyTorch benutzt habe:

    https://pytorch.org/get-started/locally/?_gl=11rcv0rg_upMQ.._gaODYwNjA1OTkxLjE3NzUyNTQ3NTM._ga_469Y0W5V62*czE3NzUyNTQ3NTMkbzEkZzAkdDE3NzUyNTQ3NTMkajYwJGwwJGgw