hibranwar
Course → Module 4: The Workspace
Session 1 of 7

VS Code as Your AI Production Workspace

Session 4.1 · ~5 min read

Why VS Code

VS Code is a free text editor built by Microsoft. It runs on Windows, macOS, and Linux. More than 15 million developers use it monthly, which means every problem you encounter has already been solved by someone on the internet. That matters when you are not a programmer and need answers fast.

For AI content production, VS Code offers four things that no word processor can match: an integrated terminal for running scripts, a file explorer for managing project folders, an extension marketplace for adding capabilities, and native AI assistant integration. You do not need all of these on day one. But you need to know they exist, because each one removes a bottleneck from your production pipeline.

VS Code is not an IDE for programmers. It is a workbench. The same way a woodworker's bench holds tools, clamps, and materials in one place, VS Code holds your scripts, prompts, outputs, and terminal in one window. You are not learning to code. You are learning to operate a workspace.

The Four Panels

When you open VS Code, you see a sidebar on the left, an editor area in the center, and a panel at the bottom. The sidebar holds your file explorer, search, source control, and extensions. The editor area is where you read and write files. The bottom panel is where the terminal lives.

graph TB subgraph VS["VS Code Workspace"] direction LR subgraph SB["Sidebar"] FE["File Explorer"] SC["Search"] GIT["Source Control"] EXT["Extensions"] end subgraph ED["Editor Area"] P["prompts/system-prompt.md"] O["outputs/draft-001.md"] S["scripts/generate.py"] end subgraph BP["Bottom Panel"] 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

The file explorer is your project navigator. Every folder and file in your project appears here. You can create, rename, move, and delete files without leaving the editor. For content production, this means your prompts, scripts, raw outputs, and reviewed drafts are all visible at once.

The terminal is your command line. Instead of opening a separate application, you run Python scripts, Git commands, and file operations directly inside VS Code. This eliminates the friction of switching between windows, which sounds trivial until you are running your fifteenth script of the day.

Essential Extensions for Content Production

Extensions add capabilities to VS Code. You install them from the marketplace (the square icon in the sidebar). For AI content production, you need four categories of extensions.

Category Extension Purpose
AI Assistant Claude Code, GitHub Copilot, or Continue Natural language to code translation, inline suggestions
Markdown Markdown All in One Preview, shortcuts, table of contents for prompt and output files
Python Python (Microsoft) Syntax highlighting, linting, virtual environment support
Formatting Prettier Consistent formatting for JSON, markdown, and code files

You do not need all of these immediately. Start with the AI assistant and the Python extension. Add the others as your workflow demands them.

Your First Project Folder

Open VS Code. Press Ctrl+O (or Cmd+O on Mac) and create a new folder called ai-production-course. Inside it, create three subfolders: prompts, outputs, and scripts. Create a file called notes.md in the root folder.

This is not arbitrary organization. Each folder maps to a stage in your production pipeline. Prompts go in prompts/. Raw AI generations go in outputs/. The scripts that connect the two go in scripts/. When you have 50 prompt files and 200 output files, you will be grateful for the structure.

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 Shortcuts That Save Hours

VS Code is fastest when you use the keyboard. You do not need to memorize everything. Start with five shortcuts and add more as they become useful.

Shortcut (Windows/Linux) Mac Action
Ctrl+` Cmd+` Toggle terminal
Ctrl+P Cmd+P Quick file open (type any filename)
Ctrl+Shift+P Cmd+Shift+P Command palette (search any action)
Ctrl+B Cmd+B Toggle sidebar
Ctrl+Shift+E Cmd+Shift+E Focus file explorer

The command palette (Ctrl+Shift+P) deserves special attention. It is VS Code's universal search. Type what you want to do ("install extension," "change theme," "format document") and VS Code finds the command. When you do not know where something is, the command palette knows.

Further Reading

Assignment

Install VS Code if you have not already. Open it. Create a new folder called ai-production-course. Inside it, create three subfolders: prompts, outputs, scripts. Create a file called notes.md in the root. Write today's date and "Day 1 of workspace setup." Take a screenshot of your file explorer showing the structure. You have just created a project.