claude ui

Claude UI

Une interface de discussion moderne pour les modèles Claude AI d'Anthropic construits avec Nuxt.js. Vivez des conversations transparentes avec Claude dans une interface utilisateur claire.

Conditions préalables

• Node.js (v18 ou supérieur)
• npm ou fil
• Clé API anthropique

? Caractéristiques

• ? Gestion de l'historique des conversations
• ? Prise en charge de plusieurs modèles Claude
• Markdown et coloration syntaxique du code
• ? Basculement du mode sombre/clair
• ? Personnalisez le comportement à l'aide des invites du système pour chaque chat
• Limiter les jetons de sortie pour chaque chat
• Température personnalisée (aléatoire) pour chaque chat
• ?? Mise en cache rapide des pièces jointes
• ? Extraction et analyse de texte

Pile technologique

• Construit avec Nuxt 3
• ? Intégration de base de données avec Drizzle ORM
• ? Composants d'interface utilisateur de @nuxt/ui
• ? Intégration de l'IA avec @anthropic-ai/sdk
• Capacités d'extraction de texte avec @nosferatu500/texttract
• Prise en charge du démarque avec markdown-it
• Mise en évidence du code avec highlight.js

Installation

Assurez-vous d'installer les dépendances :

 # npm
npm install

# pnpm
pnpm install

# yarn
yarn install

ENV

Créez un fichier .env dans le répertoire racine et ajoutez votre clé API ANTHROPIC_KEY .

Serveur de développement

Démarrez le serveur de développement sur http://localhost:3000 :

 # npm
npm run dev

# pnpm
pnpm dev

# yarn
yarn dev

Production

Créez l'application pour la production :

 # npm
npm run build

# pnpm
pnpm build

# yarn
yarn build

Base de données

L'application utilise une base de données SQLite pour stocker les données des threads et des messages.

Gestion de base de données

Ce projet utilise Drizzle ORM pour la gestion de base de données. Commandes disponibles :

 # Generate database schema
npm run db:generate

# Migrate database schema
npm run db:migrate

Faire

• Ajouter la prise en charge du streaming pour les discussions de longue durée
• Ajouter une validation côté serveur pour les entrées de formulaire
• Ajouter une authentification utilisateur