Clavox 💬

Clavox adalah aplikasi chat real-time berbasis React + Vite + Tailwind untuk frontend, serta Node.js + Express + Socket.IO untuk backend.
Aplikasi ini terintegrasi dengan Ionic + Capacitor sehingga bisa dijalankan sebagai aplikasi mobile (Android/iOS).

---

✨ Fitur Utama

• 🔐 Autentikasi OTP & Nomor Telepon
• 💬 Chat Realtime (Socket.IO)
• 🎨 UI Modern menggunakan Tailwind CSS
• 📱 Build ke Mobile App dengan Capacitor + Ionic
• ⚡ Performa cepat berkat Vite + React
• 🔧 Backend API dengan Node.js + Express

---

📂 Struktur Proyek

Clavox/
├── backend/              # Server Node.js + Express
│   ├── src/              # Kode utama backend
│   ├── package.json
│   └── ...
├── frontend/             # Aplikasi React + Vite + Tailwind
│   ├── src/              # Kode utama frontend
│   ├── public/
│   ├── package.json
│   └── ...
├── capacitor.config.ts   # Konfigurasi Capacitor
├── README.md
└── ...

---

🚀 Quick Start

1. Clone Repository

git clone https://github.com/Peter-sour/Clavox.git
cd Clavox

2. Setup Backend

cd backend
npm install express socket.io cors dotenv
npm run dev   # server berjalan di http://localhost:5000

3. Setup Frontend

cd ../frontend
npm install
npm install react-router-dom
npm install react-phone-number-input libphonenumber-js --legacy-peer-deps
npm install react-otp-input

4. Tambahan Ionic & Capacitor

npm install --save-dev @capacitor/cli
npm install @capacitor/core
npm install @ionic/react @ionic/react-router ionicons

5. Jalankan Frontend

npm run dev   # berjalan di http://localhost:5173

6. Build & Integrasi Mobile

cd frontend
npm run build
npx cap sync
npx cap add android
npx cap add ios
npx cap open android   # buka di Android Studio
npx cap open ios       # buka di Xcode

---

🧑‍💻 Scripts

Backend (/backend)

npm run dev       # mode development
npm start         # mode production

Frontend (/frontend)

npm run dev       # jalankan frontend
npm run build     # build production
npm run preview   # preview build

---

🛠️ Tech Stack

• Frontend: React, Vite, Tailwind, Ionic, Capacitor
• Backend: Node.js, Express, Socket.IO

---

📌 Roadmap

• Push Notification
• Enkripsi End-to-End
• Dark Mode
• Deploy Backend ke Cloud

---

📜 Lisensi

Proyek ini dirilis di bawah MIT License.

---

💡 Support

Jika project ini membantu, jangan lupa beri ⭐ di repo ini!