Fragments : versions libres d'applications telles que Claude Artifacts d'Anthropic, Vercel v0 ou GPT Engineer.

Introduction générale

Fragments by E2B est un projet open source qui fournit un modèle basé sur Next.js pour construire des applications entièrement générées par l'IA. Le projet a été développé par E2B Développé pour simplifier et accélérer le processus de développement des applications d'IA. Il intègre une variété de technologies et d'outils modernes, tels que Next.js 14, TailwindCSS, Vercel AI SDK, etc., et prend en charge un large éventail de langages de programmation et de cadres, notamment Python, Vue.js, Streamlit, etc.

La construction de projets frontaux à fichier unique est agréable et peut être affectée par des mots-clés et des méthodes de contexte de stockage qui rendent difficile la construction et l'exécution réussie du code de projets complexes.

Liste des fonctions

• Routage d'applications et opérations de serveur basées sur Next.js 14
• Intégration de shadcn/ui et de TailwindCSS pour la conception de l'interface utilisateur
• Intégration des fonctionnalités d'IA avec le Vercel AI SDK
• Prise en charge de plusieurs langages de programmation et frameworks (Python, Vue.js, Streamlit, Gradio, etc.)
• Prise en charge de plusieurs fournisseurs de LLM (OpenAI, Anthropic, Google AI, etc.)
• Fournir un environnement d'exécution de code sécurisé
• Prise en charge de la gestion des paquets npm et pip
• Mises à jour de l'interface utilisateur en temps réel

Utiliser l'aide

Processus d'installation

1. entrepôt de clones Exécutez la commande suivante dans un terminal pour cloner le dépôt :

   git clone https://github.com/e2b-dev/fragments.git

2. Installation des dépendances Allez dans le répertoire du référentiel et installez les dépendances nécessaires :

   cd fragments
npm install

3. Définition des variables d'environnement Créer un.env.localet définir les variables d'environnement suivantes :

   E2B_API_KEY=你的E2B API密钥
OPENAI_API_KEY=你的OpenAI API密钥
# 其他提供商的API密钥
ANTHROPIC_API_KEY=
GROQ_API_KEY=
FIREWORKS_API_KEY=
TOGETHER_API_KEY=
GOOGLE_AI_API_KEY=
GOOGLE_VERTEX_CREDENTIALS=
MISTRAL_API_KEY=
XAI_API_KEY=

4. Démarrer le serveur de développement Exécutez la commande suivante pour démarrer le serveur de développement :

   npm run dev

5. Construire des applications web Exécutez la commande suivante pour créer l'application web :

   npm run build

Lignes directrices pour l'utilisation

1. Ajouter un modèle personnalisé Assurez-vous que le CLI E2B est installé et que vous êtes connecté. Créez un nouveau dossier et initialisez le nouveau modèle :

   e2b template init

Ajuster la valeur généréee2b.DockerfileDocumentation.

2. Modèles de déploiement Utilisez la CLI E2B pour déployer le modèle :

   e2b template build --name <template-name>

Une fois le déploiement terminé, ajoutez le nouveau modèle au fichierlib/templates.jsonAu milieu.

3. Ajouter des modèles LLM personnalisés spectacle (un billet)lib/models.jsonpour ajouter une nouvelle entrée de modèle :

   {
"id": "mistral-large",
"name": "Mistral Large",
"provider": "Ollama",
"providerId": "ollama"
}

4. Ajout d'un fournisseur LLM personnalisé spectacle (un billet)lib/models.tspour ajouter la nouvelle configuration du fournisseur :

   fireworks: () => createOpenAI({
apiKey: apiKey || process.env.FIREWORKS_API_KEY,
baseURL: baseURL || 'https://api.fireworks.ai/inference/v1'
})(modelNameString),