Cara memakai tutorial ini

Setiap proyek berdiri sendiri. Kamu bisa mulai dari nomor berapa pun, asal sudah menyelesaikan bagian Persiapan di bawah sekali saja.

Urutan isi tiap proyek selalu sama:

1. Komponen: tabel barang beserta harga di store.ichibot.id saat tutorial ditulis. Harga bisa berubah, cek lagi di toko.
2. Order via WhatsApp: tombol hijau mengirim daftar komponen proyek itu ke WhatsApp Ichibot. Hapus dulu barang yang sudah kamu punya (board, kabel USB) sebelum dikirim.
3. Rangkaian: gambar kabel dan tabel pin. Kalau gambar dan tabel terlihat beda, ikuti tabel.
4. Dashboard Klenik: widget yang perlu dibuat, atau file JSON siap import.
5. Kode dengan nomor bulat kuning yang dijelaskan di bawahnya.
6. Coba ubah dan Kalau gagal.

Kode tiap proyek bisa disalin dengan tombol Salin kode atau diunduh sebagai file .ino. Semua kode dan file dashboard Klenik juga tersedia sekaligus di paket kode (.zip).

Board: ESP32 atau NodeMCU

Ada dua board yang dipakai. Proyek yang cukup memakai satu atau dua pin digital memakai NodeMCU ESP8266 V3 karena lebih murah. Proyek yang butuh pembacaan analog lebih dari satu, layar, atau banyak pin memakai ESP32 DOIT DevKit V1 30 pin. Board yang dipakai tertulis di bawah judul setiap proyek.

Di gambar rangkaian, board digambar tidur: antena di kiri, colokan USB di kanan. Baris pin atas adalah sisi kanan board kalau antenanya menghadap ke atas. Tulisan pin di gambar mengikuti tulisan di board, misalnya D1 di NodeMCU atau D26 di ESP32.

Persiapan

1. Arduino IDE dan board

1. Pasang Arduino IDE 2 dari arduino.cc.
2. Buka File → Preferences. Di kolom Additional boards manager URLs isi dua baris ini:
   https://espressif.github.io/arduino-esp32/package_esp32_index.json
https://arduino.esp8266.com/stable/package_esp8266com_index.json
3. Buka Tools → Board → Boards Manager, cari dan pasang esp32 (Espressif) dan esp8266 (ESP8266 Community).
4. Pilih board: ESP32 Dev Module untuk ESP32, NodeMCU 1.0 (ESP-12E Module) untuk NodeMCU.
5. Colok board pakai kabel micro USB data. Kabel bawaan charger sering hanya untuk mengisi daya dan board tidak akan muncul di Tools → Port. Kalau port tetap tidak muncul, pasang driver sesuai chip USB di board: CH340 atau CP210x (tulisannya ada di chip kecil dekat colokan USB).

2. Library

Buka Sketch → Include Library → Manage Libraries. Semua proyek memakai PubSubClient buatan Nick O'Leary untuk MQTT. Library tambahan per proyek tertulis di atas kodenya.

3. Akun dan dashboard Klenik

Klenik (klenik.ichibot.id) adalah dashboard IoT buatan Ichibot. Daftar gratis. Langkah membuat dashboard dan widget ada di bagian Panduan singkat Klenik di bawah.

Semua proyek memakai broker mqtt.ichibot.id port 1883 tanpa username dan password. Di setiap widget, isi bagian Koneksi MQTT dengan server itu.

4. KODE unikmu

Broker mqtt.ichibot.id dipakai banyak pembaca tutorial ini sekaligus. Kalau dua orang sama-sama memakai topic lampu, lampu mereka akan saling menyalakan. Karena itu semua topic di tutorial ini berawalan ichibot/KODE/, misalnya:

ichibot/budi1234/p001/led

Ganti budi1234 dengan kode buatanmu sendiri: nama + 4 angka acak, huruf kecil, tanpa spasi. Pakai kode yang sama di baris topic kode Arduino dan di semua widget Klenik. Tulis di sini supaya tidak lupa:

5. Isi WiFi dan topic

Di bagian atas setiap kode ada bagian ISI DULU: nama WiFi, password, lalu daftar topic yang dipakai proyek itu, ditulis utuh satu per baris:

const char* WIFI_NAMA = "nama-wifi-kamu";
const char* WIFI_PASS = "password-wifi-kamu";

// topic MQTT: ganti budi1234 dengan KODE-mu (sama dengan di dashboard Klenik)
const char* TOPIK_LED    = "ichibot/budi1234/p001/led";
const char* TOPIK_STATUS = "ichibot/budi1234/p001/status";

Ganti budi1234 dengan KODE-mu memakai Edit → Find/Replace di Arduino IDE (Ctrl+F). Nama konstanta seperti TOPIK_LED itulah yang dipakai di subscribe() dan publish(), dan di pesanMasuk() topic yang masuk dibandingkan langsung dengannya, misalnya if (topik == TOPIK_LED).

ESP32 dan ESP8266 hanya bisa tersambung ke WiFi 2,4 GHz. Hotspot HP bisa dipakai.

6. Kode koneksi yang sama di semua proyek

Setiap sketch punya dua fungsi yang isinya selalu sama. Di halaman proyek, keduanya diringkas jadi satu baris komentar supaya buku tidak tebal. Kode lengkapnya tetap ada di file .ino pada paket unduhan.

void sambungWiFi() {
  WiFi.begin(WIFI_NAMA, WIFI_PASS);
  Serial.print("WiFi");
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print(".");
  }
  Serial.println(" OK, IP " + WiFi.localIP().toString());
}

void sambungMQTT() {
  while (!mqtt.connected()) {
    if (mqtt.connect(WiFi.macAddress().c_str())) {
      Serial.println("Terhubung ke Klenik");
      langganan();
    } else {
      Serial.println("Broker gagal, coba lagi 3 detik");
      delay(3000);
    }
  }
}

• sambungWiFi() menunggu sampai WiFi tersambung dan mencetak alamat IP di Serial Monitor. Kalau titik-titiknya tidak berhenti, nama atau password WiFi salah, atau WiFi-nya 5 GHz.
• sambungMQTT() dipanggil dari loop() setiap koneksi ke broker putus. ID klien memakai alamat MAC board (misalnya A4:CF:12:9B:3E:01). Setiap board punya MAC berbeda, jadi tidak bentrok dengan perangkat pembaca lain walaupun satu kelas memakai broker yang sama. Setelah tersambung, fungsi ini memanggil langganan(), yang ditulis berbeda di tiap proyek dan berisi daftar topic yang didengarkan.

Panduan singkat Klenik

Klenik dibuka lewat browser, di HP maupun laptop, tanpa install aplikasi. Semua proyek di tutorial ini cukup memakai paket Free: 1 dashboard dengan maksimal 10 widget.

1. Daftar dan masuk

Buka klenik.ichibot.id, tekan Daftar, lalu masuk dengan akunmu. Halaman pertama setelah masuk adalah Home, berisi daftar dashboard dan status koneksi broker.

2. Buat dashboard

Di Home, tekan tombol hijau Tambah dashboard. Isi nama (misalnya "Proyek IoT Saya"), deskripsi kalau perlu, pilih warna dan ikon, lalu tekan Buat Dashboard.

Dashboard baru langsung berisi 4 widget contoh: Kirim Pesan, Log Pesan, Atur Nilai, dan Penunjuk Nilai. Widget contoh ini tidak perlu dihapus satu per satu, karena import dengan mode Ganti total (langkah 3) akan menggantinya.

Paket Free hanya punya satu dashboard. Pakai dashboard yang sama untuk setiap proyek, lalu import ulang setiap pindah proyek.

3. Cara cepat: import file JSON proyek

Setiap proyek punya file pNNN.json yang bisa diunduh di setiap halaman proyek. Isinya semua widget proyek itu, lengkap dengan topic, payload, dan posisinya.

1. Buka file JSON dengan Notepad atau TextEdit. Pakai Find & Replace untuk mengganti semua budi1234 dengan KODE-mu.
2. Di dashboard, tekan menu titik tiga di kanan atas, lalu pilih Export / Import.
3. Pilih tab Import, tempel seluruh isi file, pilih Ganti total, lalu tekan Import ke dashboard ini. Klenik meminta konfirmasi sekali lagi, tekan Ganti total.

4. Cara manual: tambah widget sendiri

1. Tekan Edit di kanan atas dashboard, lalu tekan tombol + hijau di kanan bawah.
2. Pilih tipe widget sesuai tabel "Dashboard Klenik" di proyek. Contoh: Switch untuk tombol nyala/mati, Gauge untuk angka sensor, Slider Output untuk mengirim angka.
3. Di jendela Setting, isi bagian Koneksi MQTT: Server mqtt.ichibot.id, Port 1883, Username dan Password dikosongkan. Di tab Topic, isi topic persis seperti di tabel proyek, misalnya ichibot/KODE/p001/led.
4. Isi bagian khusus widget di bawahnya (payload, min/max, satuan), lalu tekan Save. Setelah semua widget dibuat, tekan Selesai.

5. Membaca widget

• Titik hijau di pojok kanan atas kartu berarti widget tersambung ke broker. Titik ini menunjukkan koneksi Klenik ke broker, bukan status board-mu.
• "3 detik lalu" di bawah kartu menunjukkan kapan data terakhir masuk. Kalau angkanya terus bertambah padahal board menyala, board belum mengirim data.
• "Belum ada data" atau tanda — biasanya karena topic di widget dan di kode berbeda satu huruf, atau KODE-nya belum sama.