Sesi 4.1: VS Code sebagai Workspace

Kursus → Modul 4: Workspace

Sesi 1 dari 7

Kenapa VS Code

VS Code itu text editor gratis buatan Microsoft. Jalan di Windows, macOS, dan Linux. Lebih dari 15 juta developer pake tiap bulan, yang artinya setiap masalah yang kamu temui udah pernah dipecahkan orang di internet. Ini penting banget kalo kamu bukan programmer dan butuh jawaban cepat.

Buat produksi konten AI, VS Code punya empat hal yang ga bisa ditandingin word processor manapun: terminal terintegrasi buat jalanin script, file explorer buat ngatur folder proyek, marketplace extension buat nambah kemampuan, dan integrasi AI assistant bawaan. Kamu ga perlu semua ini di hari pertama. Tapi kamu perlu tau mereka ada, karena masing-masing menghilangkan satu bottleneck dari content pipeline kamu.

VS Code itu bukan IDE buat programmer. Ini workbench. Sama kaya meja kerja tukang kayu yang jadi tempat alat, klem, dan bahan di satu tempat, VS Code menampung script, prompt, output, dan terminal kamu dalam satu jendela. Kamu ga belajar coding. Kamu belajar mengoperasikan workspace.

Empat Panel

Waktu kamu buka VS Code, kamu lihat sidebar di kiri, area editor di tengah, dan panel di bawah. Sidebar berisi file explorer, search, source control, dan extensions. Area editor tempat kamu baca dan tulis file. Panel bawah tempat terminal hidup.

graph TB subgraph VS["Workspace VS Code"] direction LR subgraph SB["Sidebar"] FE["File Explorer"] SC["Pencarian"] GIT["Source Control"] EXT["Extensions"] end subgraph ED["Area Editor"] P["prompts/system-prompt.md"] O["outputs/draft-001.md"] S["scripts/generate.py"] end subgraph BP["Panel Bawah"] T["Terminal"] PRB["Problems"] OUT["Output"] end end style VS fill:#222221,stroke:#c8a882,color:#ede9e3 style SB fill:#191918,stroke:#8a8478,color:#ede9e3 style ED fill:#191918,stroke:#6b8f71,color:#ede9e3 style BP fill:#191918,stroke:#c47a5a,color:#ede9e3

File explorer itu navigator proyek kamu. Setiap folder dan file di proyek kamu muncul di sini. Kamu bisa bikin, rename, pindahin, dan hapus file tanpa ninggalin editor. Buat produksi konten, ini artinya prompt, script, raw output, dan draft yang udah direview semuanya keliatan sekaligus.

Terminal itu command line kamu. Daripada buka aplikasi terpisah, kamu jalanin Python script, Git command, dan operasi file langsung di dalam VS Code. Ini menghilangkan gesekan pindah-pindah jendela, yang kedengarannya sepele sampai kamu jalanin script ke-lima belas hari itu.

Extension Penting buat Produksi Konten

Extension menambah kemampuan VS Code. Kamu install dari marketplace (ikon kotak di sidebar). Buat produksi konten AI, kamu butuh empat kategori extension.

Kategori	Extension	Fungsi
AI Assistant	Claude Code, GitHub Copilot, atau Continue	Terjemahkan bahasa natural ke kode, saran inline
Markdown	Markdown All in One	Preview, shortcut, daftar isi buat file prompt dan output
Python	Python (Microsoft)	Syntax highlighting, linting, dukungan virtual environment
Formatting	Prettier	Format konsisten buat file JSON, markdown, dan kode

Kamu ga perlu semua ini langsung. Mulai dari AI assistant dan extension Python. Tambah yang lain sesuai kebutuhan workflow kamu.

Folder Proyek Pertama Kamu

Buka VS Code. Tekan Ctrl+O (atau Cmd+O di Mac) dan bikin folder baru bernama ai-production-course. Di dalamnya, bikin tiga subfolder: prompts, outputs, dan scripts. Bikin file bernama notes.md di root folder.

Ini bukan organisasi sembarangan. Setiap folder mewakili satu tahap di production pipeline kamu. Prompt masuk ke prompts/. Raw AI generation masuk ke outputs/. Script yang menghubungkan keduanya masuk ke scripts/. Waktu kamu punya 50 file prompt dan 200 file output, kamu bakal bersyukur sama struktur ini.

graph LR R["ai-production-course/"] --> P["prompts/"] R --> O["outputs/"] R --> S["scripts/"] R --> N["notes.md"] P --> SP["system-prompt.md"] P --> FP["few-shot-examples.md"] O --> D1["draft-001.md"] O --> D2["draft-002.md"] S --> G["generate.py"] S --> B["batch.py"] style R fill:#222221,stroke:#c8a882,color:#ede9e3 style P fill:#191918,stroke:#6b8f71,color:#ede9e3 style O fill:#191918,stroke:#c47a5a,color:#ede9e3 style S fill:#191918,stroke:#c8a882,color:#ede9e3

Keyboard Shortcut yang Hemat Waktu Berjam-jam

VS Code paling cepat kalo pake keyboard. Kamu ga perlu hafal semuanya. Mulai dari lima shortcut dan tambah lagi sesuai kebutuhan.

Shortcut (Windows/Linux)	Mac	Aksi
Ctrl+`	Cmd+`	Buka/tutup terminal
`Ctrl+P`	`Cmd+P`	Buka file cepat (ketik nama file apapun)
`Ctrl+Shift+P`	`Cmd+Shift+P`	Command palette (cari aksi apapun)
`Ctrl+B`	`Cmd+B`	Buka/tutup sidebar
`Ctrl+Shift+E`	`Cmd+Shift+E`	Fokus ke file explorer

Command palette (Ctrl+Shift+P) perlu perhatian khusus. Ini pencarian universal VS Code. Ketik apa yang mau kamu lakukan ("install extension," "change theme," "format document") dan VS Code nemuin perintahnya. Kalo kamu ga tau sesuatu ada di mana, command palette tau.

Bacaan Lanjutan

VS Code Introductory Videos oleh Microsoft
AI Toolkit for Visual Studio Code, dokumentasi resmi
How To Use Git to Manage Your Writing Project oleh DigitalOcean

Tugas

Install VS Code kalo belum. Buka. Bikin folder baru bernama ai-production-course. Di dalamnya, bikin tiga subfolder: prompts, outputs, scripts. Bikin file bernama notes.md di root. Tulis tanggal hari ini dan "Hari 1 setup workspace." Screenshot file explorer kamu yang nunjukin strukturnya. Kamu baru aja bikin sebuah proyek.