claude ui

Claude UI

Antarmuka obrolan modern untuk model Claude AI Anthropic yang dibuat dengan Nuxt.js. Rasakan percakapan yang lancar dengan Claude dalam antarmuka pengguna yang bersih.

Prasyarat

• Node.js (v18 atau lebih tinggi)
• npm atau benang
• Kunci API antropik

? Fitur

• ? Manajemen riwayat percakapan
• ? Dukungan beberapa model Claude
• Penurunan harga dan penyorotan sintaks kode
• ? Pengalih mode Gelap/Terang
• ? Personalisasikan perilaku menggunakan perintah sistem untuk setiap obrolan
• Batasi token keluaran untuk setiap obrolan
• Suhu khusus (Keacakan) untuk setiap obrolan
• ?? Caching Cepat untuk lampiran
• ? Ekstraksi dan penguraian teks

Tumpukan Teknologi

• Dibangun dengan Nuxt 3
• ? Integrasi basis data dengan Drizzle ORM
• ? Komponen UI dari @nuxt/ui
• ? Integrasi AI dengan @anthropic-ai/sdk
• Kemampuan ekstraksi teks dengan @nosferatu500/textract
• Dukungan penurunan harga dengan penurunan harga-itu
• Penyorotan kode dengan highlight.js

Pengaturan

Pastikan untuk menginstal dependensi:

 # npm
npm install

# pnpm
pnpm install

# yarn
yarn install

ENV

Buat file .env di direktori root dan tambahkan kunci API ANTHROPIC_KEY Anda.

Server Pengembangan

Mulai server pengembangan di http://localhost:3000:

 # npm
npm run dev

# pnpm
pnpm dev

# yarn
yarn dev

Produksi

Bangun aplikasi untuk produksi:

 # npm
npm run build

# pnpm
pnpm build

# yarn
yarn build

Basis data

Aplikasi ini menggunakan database SQLite untuk menyimpan data thread dan pesan.

Manajemen Basis Data

Proyek ini menggunakan Drizzle ORM untuk manajemen database. Perintah yang tersedia:

 # Generate database schema
npm run db:generate

# Migrate database schema
npm run db:migrate

Semua yang harus dilakukan

• Tambahkan dukungan streaming untuk obrolan jangka panjang
• Tambahkan validasi sisi server untuk input formulir
• Tambahkan otentikasi pengguna