الصفحة الرئيسية>المتعلقة بالبرمجة>شفرة المصدر الأخرى
تنزيل

كلود واجهة المستخدم

واجهة دردشة حديثة لنماذج Anthropic’s Claude AI المبنية باستخدام Nuxt.js. استمتع بإجراء محادثات سلسة مع Claude في واجهة مستخدم نظيفة.

المتطلبات الأساسية

  • Node.js (الإصدار 18 أو أعلى)
  • npm أو الغزل
  • مفتاح API الأنثروبي

لقطة شاشة لواجهة مستخدم كلود

؟ سمات

  • ؟ إدارة سجل المحادثات
  • ؟ دعم نموذج كلود المتعدد
  • تسليط الضوء على تخفيض السعر وبناء جملة التعليمات البرمجية
  • ؟ تبديل وضع الظلام / الضوء
  • ؟ إضفاء الطابع الشخصي على السلوك باستخدام مطالبات النظام لكل محادثة
  • الحد من الرموز المميزة لكل دردشة
  • درجة الحرارة المخصصة (العشوائية) لكل دردشة
  • ؟؟ التخزين المؤقت الفوري للمرفقات
  • ؟ استخراج النص وتحليله

مكدس التكنولوجيا

  • بنيت مع Nuxt 3
  • ؟ تكامل قاعدة البيانات مع Drizzle ORM
  • ؟ مكونات واجهة المستخدم من @nuxt/ui
  • ؟ تكامل الذكاء الاصطناعي مع @anthropic-ai/sdk
  • إمكانية استخراج النص باستخدام @nosferatu500/text
  • دعم تخفيض السعر مع تخفيض السعر
  • تسليط الضوء على التعليمات البرمجية مع Highlight.js

يثبت

تأكد من تثبيت التبعيات: 

 # npm
npm install

# pnpm
pnpm install

# yarn
yarn install

بيئى

قم بإنشاء ملف .env في الدليل الجذر وأضف مفتاح ANTHROPIC_KEY API الخاص بك.

خادم التطوير

ابدأ تشغيل خادم التطوير على http://localhost:3000: 

 # npm
npm run dev

# pnpm
pnpm dev

# yarn
yarn dev

إنتاج

بناء التطبيق للإنتاج: 

 # npm
npm run build

# pnpm
pnpm build

# yarn
yarn build

قاعدة البيانات

يستخدم التطبيق قاعدة بيانات SQLite لتخزين بيانات الرسائل والرسائل.

إدارة قواعد البيانات

يستخدم هذا المشروع Drizzle ORM لإدارة قاعدة البيانات. الأوامر المتاحة: 

 # Generate database schema
npm run db:generate

# Migrate database schema
npm run db:migrate

ما يجب القيام به

  • أضف دعمًا متدفقًا للدردشات طويلة الأمد
  • إضافة التحقق من جانب الخادم لمدخلات النموذج
  • إضافة مصادقة المستخدم
يوسع
معلومات إضافية
تطبيقات ذات صلة
نوصي لك
أخبار ذات صلة الكل