chatty gpt

Chatty GPT adalah alternatif sederhana untuk ChatGPT

Ia bekerja dengan menggunakan API penyelesaian obrolan OpenAI (misalnya gpt-3.5-turbo, gpt-4, dll.). Anda harus memiliki akses (berbayar) ke API ini.

Menggunakan gpt-4 melalui API, jauh lebih cepat dibandingkan menggunakan ChatGPT plus dan tidak memiliki batasan pesan.

Semua obrolan disimpan di Penyimpanan lokal, jadi Anda tidak akan dapat mengaksesnya dari browser atau perangkat lain, kecuali Anda menggunakan fungsi ekspor/impor.

Mengapa?

Hal ini dimaksudkan sebagai percobaan pembelajaran.
Saya ingin mencoba OpenAI API dan pada saat yang sama, saya ingin melihat betapa mudahnya menulis antarmuka dalam Komponen Web biasa dengan Tailwind CSS.
Saya ingin pengembangannya sesederhana mungkin, sebaiknya tanpa langkah pembuatan apa pun dan pastinya TANPA paket npm.
Jadi, cukup muat file ke browser Anda dan mulailah membuat kode.
Strukturnya saat ini agak berantakan, karena saya telah mencoba berbagai hal.

Inilah hasilnya!
Ini sepenuhnya berjalan dari halaman GitHub, dalam browser, tanpa panggilan eksternal, kecuali ke OpenAI API.

Sayangnya, TailwindCSS memerlukan langkah pembuatan, kecuali Anda ingin memuat seluruh lib CSS ke browser Anda.
Jadi saya menerima bahwa saya harus menjalankan CLI tailwindcss kecil, yang mengamati kode dan membangun kembali file CSS jika ada perubahan.

Dan untuk menggunakan impor, semuanya harus dilayani sebagai situs web yang tepat - Yaitu: http://, bukan file:/// .
Jadi saya harus menjalankan server web kecil (npx http-server) di direktori ini, saat mengembangkan.

Setidaknya ini CEPAT dibandingkan menggunakan apa pun seperti Webpack, Vite, dll.
Dan tidak ada langkah pembangunan - ini hanya beberapa layanan pengembangan kecil.

Kesimpulan (sejauh ini)

Meskipun dimungkinkan untuk menghindari kerangka kerja, hanya dengan menggunakan Komponen Web, Anda tidak memerlukan banyak ketergantungan eksternal, sebelum hidup Anda menjadi lebih mudah. Misalnya dengan menggunakan sesuatu seperti Vite.
Vite akan membantu Anda menjaga semua dependensi eksternal tetap lokal (dilayani oleh Anda) dan terkini serta mengaktifkan hot reload.

Menggunakan Komponen Web saja, hanya akan berfungsi untuk browser modern, jadi sebaiknya Anda pergi berbelanja Framework, jika Anda perlu mendukung browser apa pun yang tidak lagi didukung oleh pembuatnya (misalnya Internet Explorer, Chrome lama, Safari, dll.).

TODO

• Obrolan seharusnya bisa dihapus
• Tandai obrolan aktif di menu sebelah kiri
• Saat membuat obrolan baru, sarankan pesan sistem, berdasarkan pesan sistem yang digunakan sebelumnya
• Jadikan daftar obrolan dapat dicari (konten header sederhana, perbandingan kata?)
• Terapkan API moderasi
• Tambahkan pengontrol batalkan ke panggilan OpenAI
• Pengaturan untuk obrolan (termasuk nama)
• Pastikan perubahan pada pengaturan obrolan segera digunakan setelahnya
• Tambahkan pemberitahuan untuk tindakan sukses dan kesalahan
• (Re-) menghasilkan respons streaming
• Ikon atau tombol, untuk menghasilkan kembali respons terakhir
• Munculkan indikator kapan streaming selesai (atau berfungsi - seperti ... indikator yang digunakan openai)
• Tambahkan header pada contoh kode, harus berisi bahasa dan tombol/tautan salin (:has tidak berfungsi di firefox...)
• Tambahkan cara untuk memasukkan perintah bermanfaat ke dalam pesan dan pesan sistem. Mulailah dengan nasihat dalam Kursus Teknik Prompt

TODO nanti / mungkin

• Pertimbangkan untuk menggunakan penghitung token resmi (sumber Rust?)
• Tambahkan beberapa pesan sistem template (misalnya pengembang frontend, pengembang Go, pakar pemasaran, ...)
• Jadikan itu ramah seluler

UI/UX TODO

• Tutup modal dengan [ESC]
• Pengaturan: Mencerminkan bahwa data telah dihapus, tepat setelah pembersihan