Schulung · Bolt · JavaScript & TypeScript

Bolt für JavaScript- und TypeScript-Entwickler:innen

Full-Stack-Prototypen direkt im Browser: mit Bolt per Prompt Web-Apps erzeugen, in WebContainers ausführen und veröffentlichen.

Dauer
1 Tag (7 Std.)
Format
Online oder vor Ort
Sprache
Deutsch oder Englisch
Teilnehmende
offene Termine oder exklusiv für Ihr Team
Abschluss
Teilnahmebescheinigung

Überblick

Das Training „Bolt für JavaScript- und TypeScript-Entwickler:innen“ richtet sich an Rollen wie Frontend- und Fullstack-Entwickler:innen mit JavaScript oder TypeScript, Teams, die eine bestehende JavaScript-Codebasis nach TypeScript migrieren und Library- und SDK-Maintainer im npm-Ökosystem und zeigt Schritt für Schritt, wie Bolt im Bereich JavaScript & TypeScript produktiv, sicher und nachvollziehbar eingesetzt wird – von den Grundlagen bis zu fortgeschrittenen Workflows.

Bolt von StackBlitz erzeugt aus Prompts lauffähige Full-Stack-Anwendungen und führt sie unmittelbar im Browser aus. Möglich machen das WebContainers: Eine Node.js-Laufzeitumgebung läuft vollständig im Browser-Tab, inklusive Paketinstallation, Dev-Server und Terminal. In dieser eintägigen Schulung lernen Sie, wie Sie mit Bolt in kurzer Zeit Prototypen mit React, Vue, Svelte, Next.js, Astro oder Node.js-Backends bauen, wie Sie Prompts und Projektanweisungen strukturieren und wie Sie den Agenten gezielt steuern, statt ihn unkontrolliert großflächig umbauen zu lassen.

Der Kurs verbindet schnelle Ergebnisse mit professionellem Handwerk. Sie lesen und bearbeiten den generierten Code direkt im integrierten Editor, beheben Fehler über Terminal und Konsole, binden Datenbanken und Authentifizierung an und exportieren Projekte nach GitHub oder als Archiv. Anschließend veröffentlichen Sie Ihre Anwendung und lernen, wie Sie Token-Verbrauch, Kontextgröße und Projektumfang im Griff behalten. So wissen Sie am Ende genau, für welche Vorhaben Bolt der schnellste Weg zum klickbaren Ergebnis ist und ab wann ein Wechsel in die lokale Entwicklungsumgebung sinnvoll wird.

JavaScript und TypeScript laufen heute im Browser, auf dem Server, in Build-Pipelines und auf Edge-Plattformen. Diese Vielfalt bringt komplexe Toolchains mit sich: Bundler, Transpiler, Linter, Paketmanager und ein sich ständig bewegendes npm-Ökosystem. KI-Coding-Assistenten und Agenten nehmen hier viel Reibung heraus. Sie migrieren JavaScript-Module schrittweise nach TypeScript, leiten präzise Typen aus API-Antworten ab, beheben ESLint-Befunde, schreiben Vitest- oder Jest-Tests und erklären verschachtelte Generics verständlich. Damit die Ergebnisse zum Projekt passen, brauchen die Werkzeuge klare Leitplanken: tsconfig-Strenge, Modulsystem, Coding-Guidelines und Testbefehle. Im Kurs lernen Sie, diesen Kontext gezielt bereitzustellen und generierten Code kritisch zu prüfen.

Das Training findet live statt – wahlweise online im virtuellen Klassenraum oder vor Ort in unseren Trainingsräumen in München, Salzburg, Berlin, Augsburg, Hannover, Bremen, Stuttgart und Kaiserslautern. Auf Wunsch kommen wir auch exklusiv für Ihr Team zusammen.

Für wen ist das Training?

  • Frontend- und Fullstack-Entwickler:innen mit JavaScript oder TypeScript
  • Teams, die eine bestehende JavaScript-Codebasis nach TypeScript migrieren
  • Library- und SDK-Maintainer im npm-Ökosystem
  • Tech Leads, die Tooling, Linting und Build-Prozesse verantworten

Typische Herausforderungen, die wir adressieren

  • Schleichende Typ-Erosion durch any, Type Assertions und lockere tsconfig-Einstellungen
  • Komplexe Toolchains aus Bundler, Transpiler, ESM und CommonJS, die schwer zu debuggen sind
  • Riesige Abhängigkeitsbäume mit Sicherheits- und Wartungsrisiken
  • Asynchroner Code mit schwer reproduzierbaren Race Conditions und Fehlerbehandlungslücken

Das können Sie nach dem Training

  • Sie erklären, wie WebContainers funktionieren, und schätzen ein, welche Projekte in Bolt gut laufen.
  • Sie erzeugen mit strukturierten Prompts einen Full-Stack-Prototyp mit Frontend, Backend und Datenbank.
  • Sie debuggen Fehler gezielt über Terminal, Konsole und präzise Rückmeldungen an den Agenten.
  • Sie veröffentlichen Ihre Anwendung und exportieren den Code nach GitHub zur Weiterentwicklung.
  • Sie setzen KI-Agenten gezielt für TypeScript-Migrationen, Typisierung und Testgenerierung ein.
  • Sie versorgen Assistenten mit tsconfig, Lint-Regeln und Projektkonventionen, damit generierter Code zum bestehenden Stack passt.
  • Sie bewerten vorgeschlagene npm-Abhängigkeiten und generierten Code kritisch hinsichtlich Typsicherheit und Sicherheit.

Inhalte & Ablauf

Modul 1 Bolt und WebContainers verstehen
  • Architektur: Node.js, npm und Dev-Server vollständig im Browser
  • Unterstützte Frameworks und Starter-Vorlagen im Überblick
  • Möglichkeiten und Einschränkungen der Browser-Laufzeit, etwa bei nativen Binärpaketen
  • Editor, Vorschau, Terminal und Dateibaum effizient nutzen
Modul 2 Prompting und Projektsteuerung
  • Den ersten Prompt präzise formulieren: Stack, Seiten, Datenmodell, Stil
  • Projekt- und Systemanweisungen für wiederkehrende Konventionen
  • Diskussionsmodus zum Planen, Build-Modus zum Umsetzen
  • Kleinschrittig iterieren, Dateien gezielt sperren und Versionen zurückspielen
Modul 3 Full-Stack: Daten, Auth und APIs
  • Datenbank und Authentifizierung über die integrierte Backend-Anbindung oder Supabase
  • API-Routen und serverseitige Logik mit Node.js bauen
  • Externe APIs anbinden und Schlüssel über Umgebungsvariablen verwalten
  • Mobile Prototypen mit Expo erstellen und auf dem Gerät testen
Modul 4 Debugging und Codequalität
  • Fehlermeldungen aus Terminal und Browser-Konsole gezielt an den Agenten zurückgeben
  • Generierten Code lesen, verstehen und manuell korrigieren
  • Struktur, Komponenten-Zuschnitt und TypeScript-Typen sauber halten
  • Token-Verbrauch und Kontextgröße bei wachsenden Projekten steuern
Modul 5 Deployment und Übergabe
  • Anwendung mit einem Klick veröffentlichen und eigene Domain verbinden
  • Export nach GitHub und Weiterarbeit lokal in VS Code, Cursor oder Claude Code
  • Sicherheitscheck: Secrets, Zugriffsrechte, Eingabevalidierung
  • Entscheidungskriterien: Prototyp weiterführen oder neu aufsetzen
Modul 6 Praxislabor: JavaScript & TypeScript
  • Schrittweise TypeScript-Migration
  • Typen aus APIs und Schemas ableiten
  • Vitest- und Jest-Tests schreiben
  • ESLint-Befunde und Code-Smells beheben
  • Build- und Bundler-Probleme debuggen
  • Abhängigkeiten aktualisieren
Modul 7 Datenschutz, Qualität & Transfer in den Alltag
  • Das npm-Ökosystem ist ein häufiges Ziel von Supply-Chain-Angriffen; prüfen Sie jede von der KI vorgeschlagene Abhängigkeit auf Herkunft, Wartung und Lizenz (etwa Copyleft-Lizenzen). Halten Sie API-Keys und Tokens aus Prompts heraus und klären Sie vertraglich, ob Quellcode zum Training der Modelle verwendet werden darf.
  • Spielregeln für den sicheren KI-Einsatz im Team
  • Ergebnisse prüfen: Fakten, Quellen, Tests und Vier-Augen-Prinzip
  • Persönlicher Umsetzungsplan für die nächsten 30 Tage
  • Offene Fragen, Ausblick und Ressourcen zum Weiterlernen

Praxisszenarien aus Ihrem Bereich

Schrittweise TypeScript-Migration

Der Agent konvertiert JavaScript-Dateien modulweise nach TypeScript, leitet Typen aus der Verwendung ab, ersetzt any durch präzise Typen und erhöht die tsconfig-Strenge kontrolliert, bis der Compiler ohne Fehler durchläuft.

Typen aus APIs und Schemas ableiten

Aus JSON-Beispielen, OpenAPI-Spezifikationen oder Datenbankschemas entstehen TypeScript-Interfaces und Zod-Schemas für die Laufzeitvalidierung, sodass Frontend und Backend auf einem konsistenten Vertrag arbeiten. Änderungen am Schema werden so sofort als Typfehler sichtbar.

Vitest- und Jest-Tests schreiben

Für Utility-Funktionen, Hooks und Services generiert die KI Unit-Tests mit sinnvollen Mocks, Fake-Timern und Snapshot-Strategien, führt sie aus und korrigiert fehlschlagende Fälle eigenständig. Bestehende Testkonventionen werden dabei übernommen.

ESLint-Befunde und Code-Smells beheben

Der Assistent arbeitet Lint-Warnungen systematisch ab, ersetzt veraltete Muster wie Callback-Ketten durch async/await und erklärt bei jeder Regel, warum die Änderung sinnvoll ist. So lernt das Team die Regeln gleich mit.

Build- und Bundler-Probleme debuggen

Fehlermeldungen aus Vite, webpack oder esbuild werden analysiert, ESM-CommonJS-Konflikte aufgelöst und Konfigurationen für Path-Aliases, Tree Shaking oder Source Maps korrigiert. Der Agent prüft jede Korrektur durch einen erneuten Build.

Abhängigkeiten aktualisieren

Die KI prüft Changelogs bei Major-Updates von npm-Paketen, passt Breaking Changes im Code an, aktualisiert Lockfiles und verifiziert die Änderungen über Typecheck und Testlauf. Riskante Updates werden einzeln und nachvollziehbar umgesetzt.

Mögliche Praxisprojekte im Kurs

Typsicherer API-Client

Ein kleines TypeScript-Paket, das aus einer OpenAPI-Spezifikation einen typsicheren Fetch-Client mit Zod-Validierung erzeugt und als npm-Paket mit Tests veröffentlicht werden kann.

Browser-Erweiterung

Eine Browser-Extension in TypeScript, die Seiteninhalte analysiert und strukturiert in die Zwischenablage kopiert – inklusive Manifest, Content-Script und automatisiertem Build.

Monorepo-Health-Check

Ein Node-Skript, das Workspaces in einem Monorepo analysiert, doppelte oder inkonsistente Abhängigkeitsversionen findet und einen Bereinigungsplan vorschlägt. Die Änderungen setzt der Agent auf Wunsch direkt um.

Voraussetzungen

Grundkenntnisse in JavaScript oder TypeScript und ein Verständnis gängiger Webkonzepte wie Komponenten, APIs und Datenbanken. Fachanwender mit technischer Affinität können ebenfalls gut folgen. Gute Kenntnisse in modernem JavaScript, Grundlagen in TypeScript sowie Erfahrung mit npm, pnpm oder yarn und Git.

Technische Voraussetzungen

Laptop mit aktuellem Chromium-basiertem Browser oder Firefox, ein Bolt-Account (für intensives Arbeiten ein kostenpflichtiger Plan) sowie ein kostenloser GitHub-Account.

Datenschutz & Compliance

Das npm-Ökosystem ist ein häufiges Ziel von Supply-Chain-Angriffen; prüfen Sie jede von der KI vorgeschlagene Abhängigkeit auf Herkunft, Wartung und Lizenz (etwa Copyleft-Lizenzen). Halten Sie API-Keys und Tokens aus Prompts heraus und klären Sie vertraglich, ob Quellcode zum Training der Modelle verwendet werden darf.

Terminvorschläge

Alle Termine sind Vorschläge – Ihr Wunschtermin ist jederzeit möglich.

Häufige Fragen

Brauche ich für Bolt eine lokale Entwicklungsumgebung?

Nein. Dank WebContainers laufen Paketinstallation, Dev-Server und Terminal komplett im Browser, Sie müssen nichts lokal installieren. Erst wenn Sie ein Projekt langfristig weiterentwickeln oder in eine bestehende Toolchain integrieren möchten, lohnt sich der Export nach GitHub und die Arbeit in einem lokalen Editor. Beides üben wir im Kurs.

Was unterscheidet Bolt von Lovable?

Beide erzeugen Web-Apps per Prompt. Bolt bietet mehr Freiheit bei der Wahl des Frameworks, zeigt Code, Terminal und Dateibaum sehr direkt und eignet sich gut für Entwickler, die nah am Code bleiben wollen. Lovable setzt auf einen festen React-Stack mit stärkerem Fokus auf Design-Iteration und Supabase. Die Wahl hängt vom Projekt und Team ab.

Kann ich mit Bolt auch Mobile-Apps bauen?

Ja, über die Expo-Integration lassen sich React-Native-Prototypen erzeugen und per Expo Go direkt auf dem Smartphone testen. Für einfache Apps und Klickprototypen funktioniert das gut. Für native Gerätefunktionen, Store-Veröffentlichung und komplexe Offline-Logik ist meist eine lokale Weiterentwicklung erforderlich, die wir im Kurs einordnen.

Wie gut kommen KI-Assistenten mit komplexen TypeScript-Typen zurecht?

Moderne Modelle verstehen Generics, Conditional Types und Mapped Types sehr gut und können sie verständlich erklären. Bei sehr komplexen Typkonstruktionen ist der Compiler die entscheidende Kontrollinstanz. Im Kurs lernen Sie, den Agenten tsc iterativ ausführen zu lassen, damit Vorschläge nicht nur plausibel aussehen, sondern tatsächlich typkorrekt sind.

Ist der Kurs auch für reine Frontend-Entwickler:innen geeignet?

Ja. Der Fokus liegt auf der Sprache und ihrem Tooling, also Typisierung, Tests, Linting, Builds und Abhängigkeiten – Themen, die Frontend wie Backend gleichermaßen betreffen. Wer tiefer in React oder Node.js einsteigen möchte, findet dafür eigene spezialisierte Kursvarianten in unserem Katalog.

Was kostet die Schulung „Bolt für JavaScript- und TypeScript-Entwickler:innen“?

Die Schulung kostet pauschal 949 € zzgl. gesetzl. MwSt. pro Teilnehmer:in – unabhängig davon, ob sie online oder vor Ort stattfindet. Enthalten sind 1 Trainingstag(e) mit Live-Trainer:in, Kursunterlagen, Übungsumgebung und Teilnahmebescheinigung.

Kann ich einen eigenen Wunschtermin angeben?

Ja. Unsere Terminvorschläge sind eine Orientierung. Im Anfrageformular können Sie jederzeit einen Wunschtermin oder Zeitraum im Freitext angeben – wir prüfen die Verfügbarkeit und bestätigen innerhalb eines Werktags.

Findet der Kurs online oder vor Ort statt?

Beides ist möglich: live online im virtuellen Klassenraum oder vor Ort in München, Salzburg, Berlin, Augsburg, Hannover, Bremen, Stuttgart oder Kaiserslautern. Auf Wunsch führen wir das Training auch exklusiv für Ihr Team durch.

Weitere Kurse für JavaScript- und TypeScript-Entwickler:innen

Weitere Kurse zu Bolt

Alle 10 Kurse zu Bolt

Bolt · MünchenBolt · SalzburgBolt · BerlinBolt · AugsburgBolt · HannoverBolt · BremenBolt · StuttgartBolt · KaiserslauternBolt · Online