Tujuan Pembelajaran
Setelah mengikuti pertemuan ini, mahasiswa mampu menggunakan AI sebagai asisten koding melalui teknik prompt engineering untuk mempercepat pembuatan dan perbaikan kode web secara etis.
AI sebagai Asisten Koding
Asisten AI generatif dapat menjadi partner belajar yang ampuh: ia membantu menulis kerangka kode, menjelaskan konsep yang sulit, menyarankan perbaikan, dan mencari bug. Namun kemampuan itu hanya baik sejauh perintah yang diberikan. Kemampuan merancang perintah yang tepat disebut prompt engineering.
AI tidak menggantikan pemahaman. Kode yang dihasilkan AI harus selalu dibaca, dipahami, dan diuji. Mengerti dasar HTML, CSS, dan JavaScript dari pertemuan sebelumnya membuat Anda bisa menilai dan memperbaiki hasil AI dengan benar.
Elemen Prompt yang Baik
Sebuah prompt yang baik biasanya memuat beberapa elemen: peran atau konteks, tugas yang jelas, batasan teknologi, contoh konkret, dan format keluaran yang diinginkan. Semakin spesifik, semakin relevan hasilnya. Prompt pendek seperti buatkan website jarang menghasilkan kode siap pakai.
Cara ampuh meningkatkan kualitas adalah memberi contoh dan menegaskan batasan, misalnya sebutkan bahasa yang dipakai, kerangka file, dan gaya desain. Tambahkan permintaan untuk memakai nama kelas yang deskriptif agar kode mudah dibaca.
<code class="language-text">"Kamu adalah pengembang web. Buat halaman galeri responsif " "menggunakan HTML, CSS Grid, dan JavaScript untuk membuka " "gambar pada layar penuh saat diklik. Pisahkan ke tiga " "file dan gunakan nama kelas berbahasa Inggris yang jelas."</code>
Teknik Iterasi dan Instruksi Bertahap
Hasil pertama jarang sempurna, jadi perlakukan AI sebagai alur kerja yang iteratif. Mulai dengan permintaan kecil, minta AI menjelaskan kodenya, lalu minta perbaikan spesifik seperti membuat tombol lebih besar atau menambah validasi formulir. Setiap putaran harus menguji hasilnya di browser.
Teknik instruksi bertahap bekerja baik untuk proyek besar: minta kerangka dulu, lalu isi tiap bagian satu per satu, bukan meminta seluruh aplikasi secara sekaligus. Ini menghasilkan kode yang lebih terkontrol dan mudah dipahami.
<code class="language-text">"Jelaskan baris ini: e.preventDefault(); " "lalu ubah fungsi penambahan tugas agar " "item baru muncul di paling atas daftar."</code>
Minta Penjelasan dan Refactoring
Selain menulis kode, AI berguna untuk menjelaskan. Jika menemukan kode yang tidak dipahami, minta penjelasan baris demi baris dalam bahasa Indonesia. Teknik ini memperkuat pemahaman lebih dalam daripada sekadar menyalin kode.
AI juga membantu merapikan kode. Minta refactoring agar fungsi dipisah, nama variabel lebih jelas, dan kode tidak mengulang. Minta AI menunjukkan bagian yang bermasalah dan alasan perubahannya.
<code class="language-text">"Refactor kode ini: pisahkan logika menjadi " "fungsi-fungsi kecil, ganti nama variabel agar " "deskriptif, dan hilangkan pengulangan kode."</code>
Penggunaan Etis dan Batasan
AI harus dipakai sebagai alat bantu belajar, bukan untuk menyalin mentah atau menyerahkan pekerjaan orang lain. Untuk konteks akademik, pahami dan mampu menjelaskan setiap kode yang Anda gunakan, serta tulis laporan sumber belajar Anda. Kecurangan tetap kecurangan meski pakai AI.
Ingat bahwa model AI bisa salah atau memakai versi pelajaran yang usang, terutama untuk teknologi cepat berubah. Selalu uji hasil dan cari sumber resmi untuk memastikan kebenaran. Perlakukan AI sebagai asisten yang kadang keliru.
Langkah Praktik
Pilih satu fitur kecil di proyek Anda, misalnya galeri. Susun prompt yang memuat peran, tugas, teknologi, dan format. Uji hasilnya di browser, lalu beri perintah iterasi untuk menyempurnakan tampilan dan perilaku.
Terakhir minta penjelasan singkat tentang bagian kode yang paling asing lalu tulis kesimpulan pemahaman Anda dengan kata sendiri. Simpan perbandingan prompt awal dan hasil akhir untuk bahan review.
Konsep Kunci
- Asisten AI generatif dapat menjadi partner belajar yang ampuh: ia membantu menulis kerangka kode, menjelaskan konsep yang sulit, menyarankan perbaikan, dan mencari bug.
- Namun kemampuan itu hanya baik sejauh perintah yang diberikan.
- Kemampuan merancang perintah yang tepat disebut prompt engineering.
- Kode yang dihasilkan AI harus selalu dibaca, dipahami, dan diuji.
- Mengerti dasar HTML, CSS, dan JavaScript dari pertemuan sebelumnya membuat Anda bisa menilai dan memperbaiki hasil AI dengan benar.
Contoh Kode
<code class="language-text">"Explain this line of code to me in simple words."</code>
<code class="language-text">"Refactor this function and make the variable names clearer."</code>
Asisten AI generatif dapat menjadi partner belajar yang ampuh: ia membantu menulis kerangka kode, menjelaskan konsep yang sulit, menyarankan perbaikan, dan mencari bug. Namun kemampuan itu hanya baik sejauh perintah yang diberikan. Kemampuan merancang perintah yang tepat disebut prompt engineering.
Latihan
Berlatih menghasilkan tiga varian prompt untuk fitur yang sama: prompt pendek, prompt detail dengan konteks dan batasan, lalu prompt iterasi yang meminta perbaikan. Bandingkan kualitas hasil dan tulis catatan mengapa prompt detail memberi hasil lebih baik.