Allgemeine Einführung
multi-model-bolt.new ist eine Anwendung, die auf dem SchraubeEine modifizierte Version von .new, die die Verwendung von TogetherAI-Modellen ermöglicht und Funktionen wie Deployment, Mobile Response und Spracheingabe unterstützt. Benutzer können Full-Stack-Anwendungen direkt im Browser aufrufen, ausführen, bearbeiten und bereitstellen, ohne dass eine lokale Einrichtung erforderlich ist. Das Tool ist mit den neuesten KI-Modellen und den WebContainern von StackBlitz integriert, um eine vollständige Kontrolle über die Entwicklungsumgebung zu ermöglichen.
Open-Source-Ausgabe:Schraube Original multi-model-bolt.new: Open-Source-Modifikation auf der Grundlage von Bolt.new, KI-gesteuerten Full-Stack-Entwicklungswerkzeugen
Was ist der Unterschied zwischen Bolt (dieser Codebasis) und Bolt.new?
- Bolzen.neuDies ist von StackBlitz.Kommerzielle ProdukteAI ist ein gehostetes, browserbasiertes AI-Entwicklungstool, mit dem Benutzer komplette Webanwendungen direkt im Browser erstellen, ausführen, bearbeiten und bereitstellen können. Es basiert auf Bolt Open Source Bibliothek gebaut mit StackBlitz's WebContainer-API Unterstützung gewähren.
- Bolzen (diese Codebasis)Dies ist eine Open-Source-Bibliothek, die die Mittel zur Erstellung des Bolzen.neu Die erforderlichen Kernkomponenten. Die Codebasis enthält sowohl die Benutzeroberfläche von Bolt als auch die Serverkomponenten, die die Remix-Lauf Erstellen. Durch die Nutzung dieser Codebasis und der StackBlitz WebContainer-APISie können Ihre eigenen KI-gesteuerten Entwicklungstools und vollständige Anwendungen erstellen, die vollständig im Browser laufen.
Funktionsliste
- Installieren und Ausführen von npm-Werkzeugen und -BibliothekenUnterstützung für beliebte Frameworks wie Vite, Next.js, etc.
- Ausführen des Node.js-ServersBack-End-Dienst direkt im Browser ausführen
- Interaktion mit APIs von DrittanbieternEinfache Integration von externen Diensten
- Übergang vom Chat zur ProduktionsumgebungRationalisierung des Bereitstellungsprozesses
- Teilen Sie Ihre Arbeit per URLErleichterung der Teamarbeit
- UmweltkontrolleKI-Modelle haben volle Kontrolle über Dateisysteme, Node-Server, Paketmanager, Terminals und Browser-Konsolen.
- Mobile AntwortResponsive Design zur Unterstützung mobiler Geräte
- SpracheingabeZusätzliche Spracheingabefunktion zur Verbesserung der Benutzerfreundlichkeit
Hilfe verwenden
Bolt kombiniert die Leistungsfähigkeit von KI mit einer Sandbox-Entwicklungsumgebung, um eine kollaborative Erfahrung zu schaffen, bei der Assistenten und Programmierer gemeinsam an der Entwicklung von Code arbeiten können.Bolt nutzt die WebContainer-API, undClaude Sonett 3.5, undRemix im Gesang antworten AI SDK.
WebContainer-API
Bolzen Verwendung WebContainer Führen Sie den generierten Code im Browser aus.WebContainers bieten eine vollständige Sandbox-Umgebung, die die WebContainer-API WebContainer ermöglichen es, vollständige Anwendungen direkt im Browser auszuführen und so die Kosten und Sicherheitsbedenken zu vermeiden, die mit dem Hosten eines KI-Agenten in der Cloud verbunden sind. webContainer sind interaktiv und editierbar, so dass die KI von Bolt den Code ausführen und alle vom Benutzer vorgenommenen Änderungen verstehen kann.
WebContainer-API Kostenlos für den persönlichen Gebrauch und Open-Source-Projekte. Wenn Sie eine Anwendung für die kommerzielle Nutzung entwickeln, erfahren Sie mehr über unsere Preisangaben für die kommerzielle Nutzung der WebContainer-API.
Remix-Anwendung
Bolzen Verwendung Remix konstruiert mit dem CloudFlare-Seiten im Gesang antworten CloudFlare-Arbeiter Einsatz.
AI SDK-Integration
Bolzen Verwendung AI SDK Integration von AI-Modellen. Derzeit unterstützt Bolt die Verwendung von Anthropic's Claude Sonnet 3.5. können Sie die Informationen aus dem Anthropische API-Konsole Holen Sie sich einen API-Schlüssel zur Verwendung mit Bolt. Sehen Sie sich die Wie Bolt das AI SDK verwendet.
Voraussetzungen
Bevor Sie beginnen, vergewissern Sie sich, dass Sie die folgenden Komponenten installiert haben:
- Node.js (v20.15.1)
- pnpm (v9.4.0)
Setup-Schritte
- Klonen Sie das Code-Repository (falls noch nicht geschehen):
git clone https://github.com/stackblitz/bolt.new.git
- Installieren Sie die Abhängigkeit:
pnpm-Installation
- Richten Sie Supabase Auth und Provider ein:
- Erstellen Sie ein neues Projekt auf Supabase und erzeugen Sie einen neuen anonymen Schlüssel (anon key).
- Fügen Sie den anonymen Schlüssel zum
.env.local
Dokumentation. - Fügen Sie die Supabase-URL zu
.env.local
Dokumentation. - Konfigurieren Sie die Supabase-Anbieter (Google, GitHub usw.).
- Erstellen des Stammverzeichnisses
.env.local
Datei und fügen Sie Ihren Anthropic-API-Schlüssel hinzu:
ANTHROPIC_API_KEY=Ihr_api_key
TOGETHER_API_KEY=Ihr_api_key
# SUPABASE
SUPABASE_URL=Ihre_supabase_url
SUPABASE_ANON_KEY=Ihr_anon_key
# Client-Supabase
VITE_SUPABASE_URL=Ihre_Supabase_url
VITE_SUPABASE_ANON_KEY=Ihr_anon_key
# NETLIFY
NETLIFY_AUTH_TOKEN=Ihr_auth_token
NETLIFY_CLIENT_SECRET=Ihr_Client_secret
VITE_NETLIFY_CLIENT_ID=Ihre_Client_id
Optional: Legen Sie den Debug-Level fest:
VITE_LOG_LEVEL=debug
Wichtige HinweiseBitte nicht platzieren .env.local
Datei in die Versionskontrolle übertragen wird. Diese Datei ist in der Datei .gitignore
Mitte.
Hinzufügen benutzerdefinierter Modelle für Together AI
Zum Hinzufügen Gemeinsam AIs benutzerdefinierte Modelle, die in die app/components/chat/ProviderSelector.tsx
Dokumentation.
const togetherModels = [
'meta-llama/Meta-Llama-3.1-405B-Instruct-Turbo',
'meta-llama/Meta-Llama-3.1-70B-Instruct-Turbo',
'mistralai/Mixtral-8x7B-Instruct-v0.1',
'... füge hier weitere Modelle hinzu ...'
];
Verfügbare Skripte
pnpm ausführen dev
Starten Sie den Entwicklungsserver (Chrome Canary wird für lokale Tests empfohlen).pnpm run build
Erstellen Sie das Projekt.pnpm run start
Startet eine lokal erstellte Anwendung mit Wrangler Pages. Dieses Skript verwendet diebindungen.sh
Legen Sie die erforderlichen Bindungen fest, um die doppelte Konfiguration von Umgebungsvariablen zu vermeiden.pnpm-Laufvorschau
Starten Sie lokal, nachdem Sie das Projekt zum Testen von Produktionsumgebungs-Builds erstellt haben. Beachten Sie, dass HTTP-Streaming nicht auf demwrangler seiten entwicklung
möglicherweise nicht richtig funktionieren.pnpm-Test
: Führen Sie die Testsuite mit Vitest aus.pnpm run typecheck
TypeScript-Typenprüfung ausführen.pnpm ausführen typegen
Wrangler verwenden, um TypeScript-Typen zu erzeugen.pnpm run deploy
Erstellen Sie das Projekt und stellen Sie es auf Cloudflare Pages bereit.
ausbeuten (eine Ressource)
So starten Sie den Entwicklungsserver:
pnpm ausführen dev
Dadurch wird der Remix Vite Development Server gestartet.
Prüfung (Maschinen usw.)
Führen Sie die Testsuite aus:
pnpm-Test
Einsätze
Stellen Sie die Anwendung auf Cloudflare Pages bereit:
pnpm run deploy
Vergewissern Sie sich, dass Sie über die erforderlichen Berechtigungen verfügen und dass Wrangler Ihr Cloudflare-Konto richtig konfiguriert hat.
Detaillierte Funktionsabläufe
- Installieren und Ausführen von npm-Werkzeugen und -Bibliotheken
- Wählen Sie bei der Projekterstellung die erforderlichen npm-Tools und -Bibliotheken aus, z. B. Vite, Next.js und so weiter.
- Verwenden Sie den integrierten Paketmanager, um Abhängigkeiten zu installieren und sicherzustellen, dass die Projektumgebung korrekt konfiguriert ist.
- Ausführen des Node.js-Servers
- Schreiben Sie Backend-Code in einem Code-Editor, der die von Node.js bereitgestellten Funktionen nutzt.
- Starten Sie den Server und sehen Sie, wie der Back-End-Dienst in Echtzeit funktioniert.
- Interaktion mit APIs von Drittanbietern
- Integrieren Sie APIs von Drittanbietern wie Zahlungsschnittstellen, Kartendienste usw. in Ihr Projekt.
- Vereinfachen Sie die Interaktion mit externen Diensten mithilfe der integrierten API-Verwaltungstools.
- Übergang vom Chat zur Produktionsumgebung
- Geben Sie den Deploy-Befehl in der Chat-Schnittstelle ein, und das System wird die Anwendung automatisch in der angegebenen Produktionsumgebung bereitstellen.
- Nachdem die Bereitstellung abgeschlossen ist, wird die Zugriffs-URL für die Anwendung generiert, um den Zugriff und das Testen zu erleichtern.
- Teilen Sie Ihre Arbeit per URL
- Erzeugt eine Zugriffs-URL für das Projekt, nachdem das Projekt abgeschlossen ist.
- Teilen Sie URLs mit Teammitgliedern für die Projektzusammenarbeit und für Feedback.
- Umweltkontrolle
- Das KI-Modell hat volle Kontrolle über die Entwicklungsumgebung, einschließlich Dateisystem, Node-Server, Paketmanager, Terminal und Browserkonsole.
- Benutzer können komplexe Umgebungskonfigurationen und -verwaltung mit einfachen Befehlen durchführen.
- Mobile Antwort
- Das Projekt unterstützt standardmäßig responsives Design für mobile Geräte und gewährleistet so eine einheitliche Darstellung auf allen Geräten.
- Die Benutzer können das mobile responsive Layout und den Stil nach Bedarf anpassen.
- Spracheingabe
- Integrieren Sie die Spracheingabefunktion in das Projekt, um die Benutzerinteraktion zu verbessern.
- Verwenden Sie die integrierte Spracherkennung, um Sprache in Text umzuwandeln und weiterzuverarbeiten.