๐ก Side Project Alert! Ini adalah project sampingan sederhana yang saya buat untuk belajar dan bereksperimen dengan AI chatbot. Ternyata cukup berguna untuk membantu aktivitas sehari-hari - dari schedule management, hitung-hitungan, sampai translate 16+ bahasa!
Kai adalah AI chatbot berbahasa Indonesia yang saya buat sebagai project coba-coba untuk mengeksplorasi:
- ๐ค Integrasi dengan AI API (Groq AI + Llama 3.3)
- โ๏ธ React untuk UI interaktif
- ๐ Manajemen jadwal sederhana
- ๐ Multi-language translation (16+ bahasa)
- ๐งฎ Kalkulator AI yang bisa menjelaskan rumus
Awalnya cuma iseng bikin chatbot, eh ternyata malah sering saya pakai sendiri buat:
- Track jadwal harian
- Translate dokumen & komunikasi
- Hitung-hitungan cepat (persentase, matematika, dll)
- Tanya-tanya hal random ke AI
- ๐ค 16+ bahasa tersedia (Indonesia, English, ไธญๆ, ๆฅๆฌ่ช, ํ๊ตญ์ด, ุงูุนุฑุจูุฉ, dan lainnya)
- ๐ Auto detect bahasa sumber
- ๐ Swap language dengan cepat
- ๐ Copy hasil terjemahan dengan 1 klik
- ๐ฏ Powered by Llama 3.3 70B untuk akurasi tinggi
- ๐ผ Perfect untuk business, travel, atau belajar bahasa
- โ Tambah/hapus jadwal dengan form yang mudah
- ๐ด Status real-time: Sedang Berlangsung / Akan Datang / Selesai
โ ๏ธ Deteksi otomatis jadwal yang bentrok- ๐ Lihat jadwal hari ini dan yang akan datang
- ๐งฎ Perhitungan matematika (persentase, aljabar, kalkulus, dll)
- ๐ Penjelasan rumus dengan step-by-step
- ๐ก Contoh soal dan cara pengerjaannya
- ๐ฌ Bahasa Indonesia yang natural dan friendly
- โฐ Info waktu dan tanggal real-time
- ๐ Personality yang calm dan supportive
- โก Response super cepat (thanks to Groq AI!)
- Browser modern (Chrome, Firefox, Edge, Safari)
- API Key dari Groq (gratis!)
- Clone repository ini
git clone https://github.com/yourusername/kai-chatbot.git
cd kai-chatbot- Edit API Key
Buka file
Kai.htmldan ganti dengan API key Groq Anda:const GROQ_API_KEY = 'your-groq-api-key-here';
- Buka di browser
Cukup double-click file
Kai.htmlatau buka via browser!# Atau pakai simple HTTP server python -m http.server 8000 # Buka http://localhost:8000
| Technology | Purpose |
|---|---|
| React 18.2 | UI Components & State Management |
| Groq AI (Llama 3.3 70B) | AI Brain - Super fast inference! |
| TailwindCSS | Styling & Responsive Design |
| Vanilla JS | Schedule logic & commands |
| localStorage | Session data persistence |
โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ
โ ๐ Kai - Your Daily AI Companion โ
โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโค
โ โ
โ [Bot] Halo! Saya Kai ๐ โ
โ Ada yang bisa saya bantu? โ
โ โ
โ [User] Hitung 15% dari โ
โ 250.000 โ
โ โ
โ [Bot] ๐งฎ PERHITUNGAN โ
โ 15% dari 250.000 = 37.500 โ
โ โ
โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ
- ๐ด Sedang Berlangsung : Meeting Tim (10:00 - 11:30)
- ๐ข Akan Datang : Presentation (14:00 - 15:00)
- โช Selesai : Daily Standup (09:00 - 09:15) โ
โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ
โ ๐ TRANSLATOR โ
โโโโโโโโโโโโโโโโฌโโโโโโโโโโโโโโโโโโโโโโโค
โ ๐ Auto โ ๐ฌ๐ง English โ
โโโโโโโโโโโโโโโโดโโโโโโโโโโโโโโโโโโโโโโโค
โ Source Text โ Translation โ
โ โ โ
โ Selamat pagi, โ Good morning, โ
โ apa kabar? โ how are you? โ
โ โ โ
โโโโโโโโโโโโโโโโโโโโโโดโโโโโโโโโโโโโโโโโ
[๐ Translate]
| Region | Languages |
|---|---|
| Asia | ๐ฎ๐ฉ Indonesian, ๐จ๐ณ Chinese, ๐ฏ๐ต Japanese, ๐ฐ๐ท Korean, ๐ฎ๐ณ Hindi, ๐น๐ญ Thai, ๐ป๐ณ Vietnamese |
| Europe | ๐ฌ๐ง English, ๐ช๐ธ Spanish, ๐ซ๐ท French, ๐ฉ๐ช German, ๐ท๐บ Russian, ๐ต๐น Portuguese, ๐ฎ๐น Italian, ๐ณ๐ฑ Dutch |
| Middle East | ๐ธ๐ฆ Arabic |
- ๐ง Business Communication - Translate emails, documents, proposals
โ๏ธ Travel - Understand local language, menus, signs- ๐ Learning - Study foreign languages with instant translation
- ๐ International Work - Collaborate with global teams
- ๐ฑ Social Media - Understand posts in different languages
- ๐ Reading - Translate articles, books, news
๐ฌ Percakapan:
"Halo" / "Hi" โ Sapaan ramah dari Kai
"Siapa kamu?" โ Info tentang Kai
"Bantuan" โ Panduan lengkap
โฐ Waktu & Tanggal:
"Jam berapa?" โ Waktu saat ini
"Tanggal berapa?" โ Tanggal hari ini
๐
Jadwal:
Klik "โ Jadwal" โ Form tambah jadwal
"Lihat jadwal" โ Tampilkan semua jadwal
"Hapus jadwal [ID]" โ Hapus jadwal tertentu
๐ Translator:
Klik "๐ Translator" โ Buka modal translator (RECOMMENDED)
"Translate..." โ Terjemah via chat
"Terjemahkan..." โ Terjemah via chat
Bahasa tersedia:
โข ๐ฎ๐ฉ Indonesia โข ๐ฌ๐ง English โข ๐จ๐ณ Chinese
โข ๐ฏ๐ต Japanese โข ๐ฐ๐ท Korean โข ๐ธ๐ฆ Arabic
โข ๐ช๐ธ Spanish โข ๐ซ๐ท French โข ๐ฉ๐ช German
โข ๐ท๐บ Russian โข ๐ต๐น Portuguese โข ๐ฎ๐ณ Hindi
โข ๐น๐ญ Thai โข ๐ป๐ณ Vietnamese โข ๐ฎ๐น Italian
โข ๐ณ๐ฑ Dutch + Auto Detect ๐
๐งฎ Matematika:
"Hitung 20% dari 500.000" โ Kalkulator persentase
"Jelaskan rumus pythagoras" โ Penjelasan rumus
"Solve: 2x + 5 = 15" โ Selesaikan persamaan
kai-chatbot/
โ
โโโ index.html # Main file (All-in-one!)
โ
โโโ README.md # You are here ๐
Yep, cuma 1 file HTML! Simple kan? ๐
Ini adalah learning project yang saya buat untuk:
- Belajar AI Integration - Gimana caranya panggil AI API dengan efisien
- Eksperimen React - State management tanpa framework berat
- Explore UI/UX - Bikin chatbot yang enak dipakai
- Multi-language Processing - Implementasi translator dengan AI
- Solve Real Problems - Ternyata berguna buat daily task management!
Bonus : Fitur translator yang tadinya cuma eksperimen, sekarang jadi salah satu fitur favorit saya! ๐
- ๐ง Ini adalah project sampingan yang dibuat untuk belajar dan fun
- ๐ Mungkin ada bugs atau hal-hal yang bisa diimprove
- ๐ Not production-ready, tapi cukup untuk daily use!
- ๐ก Feel free to fork, modify, atau improve!
Completed โ
- Multi-language translator (16+ languages)
- Smart schedule management
- AI math helper
- Conflict detection for schedules
Maybe in the Future? ๐ค
Kalau sempat dan ada ide, mungkin akan ditambah:
- Export jadwal ke Google Calendar
- Dark mode toggle
- Voice input untuk chat dan translator
- Reminder notifications
- Text-to-speech untuk hasil translate
- Mobile app version
- Cloud sync untuk jadwal
- Translation history
- Batch translation untuk multiple texts
Tapi ya... ini side project, jadi no promises ๐
Mau contribute? Silakan banget!
- Fork this repo
- Create your feature branch (
git checkout -b feature/AmazingFeature) - Commit changes (
git commit -m 'Add some AmazingFeature') - Push to branch (
git push origin feature/AmazingFeature) - Open a Pull Request
Any improvements welcome! ๐
- Jadwal tidak persist setelah refresh (pakai localStorage untuk session only)
- AI parsing kadang tidak konsisten (makanya ditambah form manual)
- Translation via chat kurang optimal (gunakan modal translator untuk hasil terbaik)
- Belum ada unit tests (it's a side project ๐ฌ)
MIT License - Feel free to use this project for anything!
Your Name
- GitHub: @DavidMarioYS
- Project Link: https://github.com/DavidMarioYS/kai-chatbot
- Groq - Amazing fast AI inference!
- Meta's Llama 3.3 - Powerful language model with excellent multilingual support
- React - UI library
- TailwindCSS - Styling framework
- Kopi โ - Fuel for coding sessions
- All the language communities worldwide ๐ - For inspiring the translator feature
**โญ Star this repo if you find it helpful!**
Made with โค๏ธ and lots of โ for learning purposes
๐ Stay calm like ocean waves ๐
NEW : Now with 16+ languages translation! ๐โจ