Maybyte Pro (Reborn)

Maybyte Pro adalah dashboard monitoring sistem real-time yang ringan, dibangun dengan arsitektur MVC (Model-View-Controller). Proyek ini didesain untuk memantau performa hardware (CPU, Core, Threads) dengan tampilan modern berbasis Grid Layout.

Fitur unggulan proyek ini adalah Hybrid Data System, yang memungkinkan aplikasi berjalan mulus baik di lingkungan lokal (akses hardware penuh) maupun di lingkungan Cloud/Edge (terisolasi).

🌟 Key Features

• Real-time Monitoring: Menggunakan Fetch API untuk polling data CPU setiap 2 detik tanpa reload halaman.
• Hybrid Mode (Smart Fallback):
  • Mode REAL: Menggunakan library psutil untuk mengambil data asli hardware saat dijalankan di Localhost/VPS.
  • Mode DUMMY: Otomatis beralih ke simulasi data (Randomizer) jika mendeteksi library psutil tidak tersedia atau diblokir (cocok untuk deployment di Vercel/EdgeOne).
• Mobile-First Design: Layout responsif menggunakan Tailwind CSS Grid System.
• No Node_Modules: Menggunakan Tailwind Standalone CLI, menjaga proyek tetap ringan tanpa ribuan dependensi Node.js.

📂 Project Structure

maybyte-pro/
├── app.py                  # Flask Server & API Endpoints
├── monitor.py              # Data Logic
├── tailwind.config.js      # Konfigurasi Tailwind
├── tailwindcss             # Binary Executable (Standalone CLI)
├── requirements.txt        # Dependensi Python
├── src/
│   └── input.css           # Tailwind Directives
├── static/
│   ├── dist/
│   │   └── output.css      # Hasil compile CSS
│   └── js/
│       └── index.js        # Frontend Logic
└── templates/
    └── index.html          # Halaman Utama Dashboard

Installation & Local Development

1. Clone the repository

   git clone https://github.com/aadnanmt/Maybyte-pro.git
   cd Maybyte-pro

2. Create a Virtual Environment on Windows

   python -m venv venv
   venv\Scripts\activate

3. Create a Virtual Environment on macOS/Linux

   python -m venv venv
   source venv/bin/activate

4. Install Dependencies

   pip install -r requirements.txt

5. Setup TailwindCSS (Pilih OS Kamu)

   Silakan ikuti langkah-langkah di bawah ini satu per satu sesuai sistem operasi yang kamu gunakan.

   Linux (x64)

   1. Unduh file binary:

      curl -sLO https://github.com/tailwindlabs/tailwindcss/releases/download/v3.4.17/tailwindcss-linux-x64

   2. Ganti nama file menjadi tailwindcss:

      mv tailwindcss-linux-x64 tailwindcss

   3. Berikan izin eksekusi:

      chmod +x tailwindcss

   4. Buat file konfigurasi:

      ./tailwindcss init

   ---

   macOS (Apple Silicon)

   1. Unduh file binary:

      curl -sLO https://github.com/tailwindlabs/tailwindcss/releases/download/v3.4.17/tailwindcss-macos-arm64

   2. Ganti nama file menjadi tailwindcss:

      mv tailwindcss-macos-arm64 tailwindcss

   3. Berikan izin eksekusi:

      chmod +x tailwindcss

   4. Buat file konfigurasi:

      ./tailwindcss init

   ---

   macOS (Intel Chip)

   1. Unduh file binary:

      curl -sLO https://github.com/tailwindlabs/tailwindcss/releases/download/v3.4.17/tailwindcss-macos-x64

   2. Ganti nama file menjadi tailwindcss:

      mv tailwindcss-macos-x64 tailwindcss

   3. Berikan izin eksekusi:

      chmod +x tailwindcss

   4. Buat file konfigurasi:

      ./tailwindcss init

   ---

   Windows (PowerShell)

   1. Unduh file dan simpan sebagai tailwindcss.exe:

      Invoke-WebRequest -Uri 'https://github.com/tailwindlabs/tailwindcss/releases/download/v3.4.17/tailwindcss-windows-x64.exe' -OutFile 'tailwindcss.exe'

   2. Buat file konfigurasi:

      .\tailwindcss.exe init

6. Run the Application

   • Linux/macOS/Windows:

     honcho start

7. Access the site Open your browser and go to http://127.0.0.1:5000

License

This project is licensed under the MIT License. See the LICENSE file for details.

Contact

• Name: Adnan Slamet Wibowo
• Role: Web Developer & Prompt Designer
• Email: aadnanmtcontact@gmail.com
• LinkedIn: Adnan Slamet Wibowo

---

Made with ☕ in Indonesia