KDBM Lite · 05 / 10

Workspace Builder Anda

Fahami project folder, IDE, terminal, browser preview, localhost, Git, dan GitHub dalam bahasa beginner.

Goal

Understand the workspace before downloading the starter.

Do now

Identify the editor, files, terminal, preview, and AI helper roles.

Output

You know where to look when the build, preview, or agent gets stuck.

Stop when

You can point to the part of the workspace that runs, edits, previews, and explains the app.

Peta cockpit

Di mana setiap bahagian berada

Kenali setiap bahagian sebelum download apa-apa. Setup tidak lagi terasa macam skrin hitam.

Project folder

Semuanya ada di sini

Files panel

Cari dan buka file

Editor

Ubah satu file

Terminal

Run command project

Browser preview

localhost peribadi untuk anda

AI helper

Terangkan dan edit dengan kebenaran

Peraturan sepanjang session: jangan run command yang anda tidak boleh terangkan.

Workspace Builder Anda

Apa ini

Ini lawatan ke cockpit tempat anda akan build nanti. Anda belum download apa-apa. Matlamatnya cuma satu: kenal setiap bahagian bila anda nampak nanti.

Copy

Project folder → IDE → Files panel → Editor → Terminal → Browser preview → AI helper

Satu baris itu ialah keseluruhan petanya. Semua di bawah ini menerangkan satu bahagian daripadanya.

Kenapa penting

Kebanyakan panik beginner dalam session build bukan tentang code. Ia tentang tidak tahu window mana yang mana, dan tiba-tiba disuruh taip sesuatu ke dalam skrin hitam.

Terminal bukan magic dan ia bukan bahaya secara automatik. Ia kaunter arahan. Daripada klik menu satu per satu, anda taip arahan pendek seperti npm run dev untuk mula preview, atau git status untuk tanya apa yang berubah.

Localhost juga elok difahami awal. Preview di localhost berjalan pada mesin anda sahaja. Orang lain tidak boleh buka. Publish ialah langkah berasingan kemudian.

Satu peraturan keselamatan

Jangan run command yang anda tidak faham. Minta coach terangkan dahulu: apa fungsinya, adakah ia selamat, dan apa yang anda patut nampak selepas itu.

Apa nak buat

Do this now

Buka coding workspace anda dan cari setiap bahagian ini pada skrin anda. Anda bukan sedang build apa-apa, cuma menunjuk.

Check yourself

Tanda hanya selepas anda betul-betul jumpa:

Saya boleh tunjuk files panel saya: senarai file project.
Saya boleh buka atau cari terminal saya: window arahan bertaip.
Saya tahu di mana browser preview akan muncul.
Saya tahu localhost hanya pada mesin saya dan bukan awam.
Saya tahu di mana AI helper saya berada dalam workspace ini.

You are ready when

Anda boleh kenal pasti files panel, terminal, AI helper, dan tempat browser preview akan muncul, tanpa bertanya sesiapa.

Istilahnya, kalau anda mahu

Istilah	Maksudnya	Kategori
Project folder	Rumah kepada build. File di dalamnya ialah project itu sendiri.	Build
IDE	Integrated Development Environment: app tempat anda buka, edit, cari, dan run satu coding project.	Build
Editor	Ruang tempat file yang dibuka diubah.	Build
Files panel	Senarai file dan folder dalam project.	Build
Terminal	Window arahan bertaip yang bercakap terus dengan komputer atau project anda.	Command
Command	Arahan bertaip, contohnya “start app” atau “tunjuk version”.	Command
Browser preview	Tempat anda lihat hasil seperti user melihatnya.	Preview
Localhost	Preview peribadi yang berjalan pada mesin anda sendiri, bukan di internet awam.	Preview
Git	Sistem simpan sejarah untuk code.	Publish
GitHub	Servis untuk simpan dan kongsi project Git secara online.	Publish
Repository	Project yang disimpan bersama sejarah Git. Selalu dipendekkan sebagai “repo”.	Publish

Tiga tabiat untuk dibawa ke dalam build:

Bila anda sampai ke Start, buka seluruh project folder, bukan satu file sahaja.
Semasa build, pastikan tiga benda kelihatan jika skrin anda mengizinkan: files panel, AI chat, dan browser preview.
Bila AI minta run satu command, tanya: Apa fungsinya? Adakah ia selamat? Apa yang saya patut nampak selepas itu?

Common mistakes

Buka satu file dan bukan project folder.
Anggap output terminal sebagai bunyi bising tanpa makna. Selalunya ia menyebut masalahnya.
Run command install atau delete tanpa memahaminya.
Fikir preview localhost sudah pun awam.
Fikir Git dan GitHub adalah benda yang sama. Git simpan sejarah; GitHub simpan dan kongsi.

Next step

Sekarang pelajari jenis AI helper yang boleh duduk dalam workspace ini dalam Tool, Agent & Model AI Coding.