Pengekodan Vibe · Pelajaran

Memberikan Konteks kepada Kecerdasan Buatan

Kongsikan fail, matlamat dan teknologi supaya kecerdasan buatan sesuai dengan projek anda.

Pelajaran 3 daripada 413 langkah

Memberikan Konteks kepada Kecerdasan Buatan ialah pelajaran Pengekodan Vibe percuma di CoddyKit. Ini ialah pelajaran 3 daripada 4. Sebanyak 3 pelajaran dalam laluan pembelajaran ini boleh dibaca sepenuhnya secara percuma — selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan praktikal dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran Pengekodan Vibe, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus Pengekodan Vibe merangkumi sejumlah 4 pelajaran.

Mengapa Konteks Mengubah Segalanya

Arahan yang sama boleh menghasilkan kod yang sangat berbeza bergantung pada perkara yang diketahui AI tentang projek anda. Arahan tanpa konteks menyebabkan AI meneka kerangka kerja, gaya, malah nama fail anda.

Berikan konteks kepadanya, lalu kod itu terus boleh dimasukkan ke dalam projek anda — konvensi yang sama, gaya yang sama, tanpa perlu menulis semula. Pelajaran ini menerangkan cara memberikan latar belakang yang tepat kepada AI.

Tiga Jenis Konteks

Konteks yang berguna hadir dalam tiga bentuk:

  • Konteks projek — susunan teknologi, kerangka kerja dan konvensi anda
  • Konteks kod — fail sebenar dan petikan yang sedang anda gunakan
  • Konteks matlamat — sebab yang lebih besar di sebalik tugasan itu

Arahan terbaik menggabungkan ketiga-tiganya supaya AI membina sesuatu yang benar-benar sesuai.

Konteks Projek: Susunan Teknologi Anda

Sentiasa beritahu AI teknologi yang anda gunakan untuk membina projek. “React dengan Tailwind” menghasilkan kod yang sangat berbeza daripada “HTML dan CSS biasa”. Menyatakan susunan teknologi anda menghalang AI daripada mengimport pustaka yang tidak anda miliki.

"This project uses React, TypeScript and Tailwind CSS.
 We use functional components and hooks only — no class
 components. Build a reusable <Avatar /> component that
 shows a circular user image with a fallback initial."

Konteks Kod: Tunjukkan Fail Anda

Peningkatan terbesar untuk mana-mana arahan ialah menampal kod sebenar yang sedang anda gunakan. Kini AI dapat memadankan nama pemboleh ubah, gaya dan struktur sedia ada anda, bukannya mereka-reka yang baharu.

"Here's my current cart code:

  let cart = [];
  function addItem(name, price) {
    cart.push({ name, price });
  }

Add a function removeItem(name) that removes the first
matching item, and a total() function that sums the prices."

Penyunting Berkongsi Konteks Secara Automatik

Alat seperti Cursor dan Claude Code boleh membaca fail yang terbuka serta struktur projek anda. Dalam Cursor, anda boleh menandai fail dengan @filename untuk memasukkannya ke dalam arahan.

Inilah sebabnya penyunting berasaskan AI terasa lebih pintar daripada chatbot biasa — penyunting itu sudah mengetahui pangkalan kod anda.

In Cursor's chat:

"Look at @cart.js and @checkout.js.
 The total in checkout doesn't match the cart.
 Find why and fix it."

Konteks Matlamat: “Sebabnya”

Memberitahu AI sebab anda melakukan sesuatu membantu AI membuat pilihan yang lebih bijak. Jika AI tahu aplikasi itu untuk kanak-kanak, mesti berfungsi tanpa talian atau perlu sangat pantas, AI akan menyesuaikan kod dengan sewajarnya.

"This is a flashcard app for young children, so the UI must
 be large, colorful, and tappable with no small targets.
 Build the answer-reveal button with that in mind."

Konteks Membantu AI Meniru Gaya Anda

Apabila anda menunjukkan kod sedia ada, AI akan meniru konvensi anda. Inilah gaya yang akan disalin oleh AI jika anda menampalnya — perhatikan fungsi anak panah dan penamaannya. Meminta “satu lagi yang seperti ini” memastikan pangkalan kod kekal konsisten.

Petikan ini berjalan sendiri supaya anda dapat melihat coraknya dalam tindakan.

const formatPrice = (n) => '$' + n.toFixed(2);
const formatPercent = (n) => n.toFixed(0) + '%';

// Ask AI: "Add formatDate in this same arrow-function style."
console.log(formatPrice(12.5));
console.log(formatPercent(0.42 * 100));

Fail Konteks Projek

Langkah profesional: simpan fail konteks ringkas yang dibaca oleh AI setiap kali. Cursor menggunakan .cursorrules dan Claude Code menggunakan CLAUDE.md. Letakkan susunan teknologi, konvensi serta peraturan perkara yang perlu dan tidak boleh dilakukan di situ sekali sahaja.

Kini anda tidak perlu mengulanginya dalam setiap arahan.

Example CLAUDE.md:

# Project Conventions
- Stack: Next.js + Tailwind
- Use TypeScript, no 'any'
- Components in /components, one per file
- Prefer small, pure functions
- Never add a dependency without asking

Terlalu Banyak Konteks Juga Menjadi Masalah

Konteks memang berkuasa, tetapi bukan tanpa kos. Menyertakan sepuluh fail yang tidak berkaitan akan mengelirukan AI dan menenggelamkan bahagian yang penting. Kongsikan perkara yang relevan dengan tugasan ini, bukan keseluruhan projek anda.

Sasarkan: fail yang anda ubah, fail yang berhubung dengannya dan penerangan satu baris tentang susunan teknologi.

Konteks Menghalang Halusinasi

Apabila AI kekurangan konteks, kadangkala AI mereka-reka nama fungsi, fail atau API yang tidak wujud — keadaan ini dipanggil halusinasi. Memberikan kod sebenar membantu AI berpijak pada realiti.

Jika AI terus merujuk perkara yang tidak pernah anda tulis, itu petandanya: AI memerlukan lebih banyak konteks, bukannya model yang lebih baik.

Symptom of missing context:

  AI: "Just call your existing saveUser() helper."
  You: "...I don't have a saveUser() helper."

Fix: paste the real file so the AI sees what exists.

Arahan dengan Konteks Lengkap

Inilah semuanya yang digabungkan: susunan teknologi, kod sebenar dan matlamat. Arahan seperti inilah yang menghasilkan kod sedia produksi yang sesuai sejak percubaan pertama.

"Stack: plain HTML/CSS/JS, single index.html. (PROJECT)

Here's my current toggle code:
  const btn = document.querySelector('#theme');
  btn.onclick = () => document.body.classList.toggle('dark'); (CODE)

Goal: I want the theme choice to persist after refresh, since
 users hate re-toggling every visit. Add localStorage. (GOAL)"

Semakan Pantas

AI terus mencadangkan supaya anda memanggil fungsi dan fail yang tidak wujud dalam projek anda. Apakah punca dan pembaikan yang paling mungkin?

Ulang Kaji: Pautkan AI pada Dunia Anda

Konteks mengubah kod umum menjadi kod yang sesuai. Sentiasa pertimbangkan untuk berkongsi:

  • Konteks projek — susunan teknologi dan konvensi anda
  • Konteks kod — fail sebenar (tandainya dalam Cursor/Claude Code)
  • Konteks matlamat — “sebab” di sebalik tugasan

Simpan CLAUDE.md atau .cursorrules supaya anda tidak perlu mengulanginya, dan kongsikan hanya perkara yang relevan. Seterusnya: cara melakukan iterasi — memperkemas arahan langkah demi langkah, bukannya bermula semula.

Percuma untuk bermula

Pelajari JavaScript dengan tutor kecerdasan buatan — percuma

Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.

Kursus
25
Pelajaran
100

Soalan Lazim

Adakah pelajaran “Memberikan Konteks kepada Kecerdasan Buatan” percuma?

Ya — sebanyak 3 pelajaran dalam laluan pembelajaran Pengekodan Vibe, termasuk “Memberikan Konteks kepada Kecerdasan Buatan”, boleh dibaca sepenuhnya secara percuma di web ini. Selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan interaktif dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Kursus Pengekodan Vibe merangkumi sejumlah 4 pelajaran.

Apakah yang akan saya pelajari dalam “Memberikan Konteks kepada Kecerdasan Buatan”?

Kongsikan fail, matlamat dan teknologi supaya kecerdasan buatan sesuai dengan projek anda. Anda berlatih Pengekodan Vibe menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.

Adakah saya memerlukan pengalaman untuk memulakan Pengekodan Vibe?

Tiada pengalaman terdahulu diperlukan. Pembelajaran Pengekodan Vibe di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 3 daripada 4.

Berapa lamakah pelajaran “Memberikan Konteks kepada Kecerdasan Buatan” diambil?

Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.

Bolehkah saya menulis dan menjalankan kod dalam pelajaran Pengekodan Vibe ini?

Ya. Setiap pelajaran Pengekodan Vibe menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.

Semua pelajaran dalam kursus ini

  1. Anatomi Arahan Binaan yang Baik
  2. Bersikap Khusus
  3. Memberikan Konteks kepada Kecerdasan Buatan
  4. Mengulang Baik Arahan
← Kembali ke Pengekodan Vibe