Langsung ke konten
Berita & Update
August 6, 2026 45

Tutorial: File Manager - Browse Kode Project & Tambahkan sebagai Context Chat

Mau AI paham struktur project kamu tanpa jelasin panjang lebar? Buka File Manager di builder, cari file yang relevan, dan tambahkan langsung sebagai context ke chat.

Tutorial: File Manager - Browse Kode Project & Tambahkan sebagai Context Chat

Kadang kamu tahu persis file mana yang perlu diubah AI — model produk tertentu, satu route, satu komponen — tapi males jelasin lokasinya panjang lebar di chat. Fitur File Manager di builder biar kamu bisa browse langsung struktur kode project (mirip file explorer VS Code) dan tambahkan file yang relevan sebagai context buat chat berikutnya, tanpa AI perlu nebak-nebak.

Belum familiar sama toolbar preview panel? Baca dulu Tutorial: Cek Data Production Langsung dari Builder (Database Viewer) — File Manager pakai toggle DEV/PROD yang sama seperti Database Viewer, cuma buat browse file, bukan tabel.

1. Klik Tombol FILE MANAGER di Toolbar Preview

Di toolbar preview panel, klik tombol FILE MANAGER di samping DATABASE dan GO TO. Panel berubah jadi file explorer read-only yang menampilkan seluruh struktur folder project Laravel kamu — lengkap dengan toggle DEV/PROD kalau mau bandingkan versi kode yang sedang dikembangkan vs yang sudah live.

Tombol FILE MANAGER di toolbar preview builder

2. Browse Struktur Folder & Cari File

Klik folder mana pun (misalnya app lalu Models) buat expand isinya. Semua file model, controller, route, sampai file config bisa di-browse dari sini — persis kayak file tree di code editor. Klik file yang mau dicek, misalnya Product.php.

Browse struktur folder app/Models di file tree

3. Lihat Isi Kode di Editor Read-Only

Isi file langsung tampil di panel kanan pakai syntax highlighting (Monaco editor, sama yang dipakai VS Code) — read-only, jadi aman buat inspeksi tanpa resiko kesenggol edit. Berguna banget buat ngecek struktur `$fillable`, relasi model, atau logic tertentu sebelum minta AI ubah sesuatu.

Isi kode Product.php ditampilkan di editor read-only

4. Tambahkan File sebagai Context Chat

Kalau file itu relevan buat permintaan berikutnya, klik tombol TAMBAH KE CONTEXT di pojok kanan atas. File langsung muncul sebagai badge/chip di atas composer chat (kiri bawah) — begitu kamu kirim prompt, AI otomatis tahu persis file mana yang kamu maksud tanpa perlu disebut manual di teks.

File app/Models/Product.php ditambahkan sebagai badge context di chat

Bisa tambahkan lebih dari satu file sekaligus kalau butuh AI paham beberapa bagian kode terkait bersamaan — badge-nya bakal numpuk rapi di atas composer, dan bisa dihapus satu-satu sebelum kirim kalau ternyata gak jadi dipakai.

Artikel Terkait

Mau bikin aplikasi seperti ini?

Ceritakan kebutuhanmu satu prompt — AI TanpaNgoding membangun aplikasi web lengkap dengan admin panel, database, dan siap publish.