Instalar y configurar VS Code

Hasta ahora has estado trabajando exclusivamente en la terminal. Es poderosa, sí, pero para escribir código de verdad necesitas algo más: un editor de código. No un procesador de texto como Word — un editor diseñado específicamente para programar. Y el rey indiscutible de los editores en 2024 es Visual Studio Code (VS Code para los amigos).

VS Code es como un taller de trabajo. La terminal es tu destornillador, pero VS Code es tu banco de trabajo completo: tiene un sitio para cada herramienta, buena iluminación, y está organizado para que trabajes cómodamente durante horas. Lo mejor: es gratuito, es el más usado del mundo (más del 70% de los desarrolladores lo usan), y tiene miles de extensiones que lo adaptan a cualquier lenguaje o tecnología.

### ¿Por qué VS Code y no otro editor?

Existen muchos editores: Vim (legendario pero con curva de aprendizaje brutal), Sublime Text (rápido pero menos extensible), PyCharm (excelente para Python pero pesado y de pago), Notepad++ (solo Windows). VS Code ganó la batalla por una combinación única: es rápido, gratuito, extensible y funciona en todos los sistemas operativos. Además, tiene terminal integrada — así que puedes escribir código y ejecutar comandos sin cambiar de ventana.

### Instalación paso a paso

La instalación es sencilla. Ve a https://code.visualstudio.com y descarga la versión para tu sistema operativo. La web detecta automáticamente si estás en Windows o Mac y te ofrece el botón correcto.

1. 01.🟦 Windows: descarga el instalador .exe. Ejecútalo y acepta los valores por defecto. IMPORTANTE: marca la casilla "Add to PATH" cuando aparezca — esto te permite abrir VS Code desde PowerShell.
2. 02.🍎 Mac: descarga el archivo .zip. Descomprímelo y arrastra "Visual Studio Code.app" a tu carpeta Aplicaciones. Luego abre VS Code, pulsa Cmd+Shift+P, escribe "shell command" y selecciona "Install code command in PATH".

Una vez instalado, verifica que funciona desde la terminal. Esto es crucial porque durante todo el curso abriremos proyectos con un solo comando:

1# Funciona igual en ambos sistemas después de la instalación:
2code --version
3# Debería mostrar algo como: 1.85.0
4
5# Abrir VS Code en la carpeta actual:
6code .
7
8# Abrir un archivo específico:
9code mi-archivo.txt

### Tour por la interfaz de VS Code

Cuando abres VS Code por primera vez, puede parecer abrumador. Pero la interfaz tiene una lógica clara. Vamos a identificar las zonas principales:

• ▹Barra de actividades (izquierda): iconos para cambiar de vista — Explorador, Buscar, Git, Extensiones.
• ▹Explorador: muestra los archivos y carpetas de tu proyecto. Es como "ls" pero visual.
• ▹Editor: la zona central donde escribes código. Puedes tener varios archivos abiertos en pestañas.
• ▹Terminal integrada: una terminal DENTRO de VS Code. Ctrl+` (backtick) para abrirla/cerrarla. No necesitas salir del editor para ejecutar comandos.
• ▹Barra de estado: información útil — en qué rama de Git estás, si hay errores, qué lenguaje estás usando.

### La terminal integrada: tu nuevo superpoder

VS Code tiene una terminal integrada. Esto significa que puedes escribir código arriba y ejecutarlo abajo SIN cambiar de ventana. Es un cambio enorme en productividad. Para abrirla:

• ▹🟦 Windows: Ctrl + ` (backtick, la tecla al lado del 1) — abre PowerShell dentro de VS Code
• ▹🍎 Mac: Cmd + ` (o Ctrl + `) — abre zsh dentro de VS Code
• ▹También puedes ir al menú: Ver → Terminal

La terminal integrada es EXACTAMENTE igual que la terminal que ya conoces — los mismos comandos, el mismo comportamiento. La diferencia es que está ahí, dentro de tu editor, lista para usarse sin alternar ventanas. A partir de ahora, trabajaremos casi siempre con la terminal integrada de VS Code.

### Atajos de teclado esenciales

VS Code se diseñó para usarse con el teclado. Los atajos más importantes que debes memorizar:

1# Atajos universales (funcionan en ambos sistemas):
2# Ctrl+S (Win) / Cmd+S (Mac)     → Guardar archivo
3# Ctrl+Z (Win) / Cmd+Z (Mac)     → Deshacer
4# Ctrl+Shift+P / Cmd+Shift+P     → Paleta de comandos (buscar cualquier acción)
5# Ctrl+P (Win) / Cmd+P (Mac)     → Buscar archivo por nombre
6# Ctrl+` (Win) / Cmd+` (Mac)     → Abrir/cerrar terminal integrada
7# Ctrl+B (Win) / Cmd+B (Mac)     → Mostrar/ocultar explorador lateral

### Extensiones recomendadas para empezar

Las extensiones son como apps para tu editor. Le añaden funcionalidades. Para este curso, instala estas (Ctrl+Shift+X abre el panel de extensiones, luego busca por nombre):

1. 01.Spanish Language Pack — VS Code en español (si lo prefieres)
2. 02.Python — soporte para Python (la usarás mucho pronto)
3. 03.Prettier — formatea tu código automáticamente para que sea legible
4. 04.Material Icon Theme — iconos bonitos para los archivos (opcional pero agradable)

### Configuración básica recomendada

Abre la configuración con Ctrl+, (coma) en Windows o Cmd+, en Mac. Busca y ajusta estos valores:

1// Abre Settings (JSON) con Ctrl+Shift+P → "Open User Settings (JSON)"
2{
3  "editor.fontSize": 14,
4  "editor.tabSize": 2,
5  "editor.wordWrap": "on",
6  "editor.minimap.enabled": false,
7  "files.autoSave": "afterDelay",
8  "terminal.integrated.fontSize": 13
9}

### Flujo de trabajo: terminal + VS Code

El flujo de trabajo profesional combina terminal y VS Code constantemente. El patrón típico es: creas la estructura del proyecto desde la terminal, abres el proyecto en VS Code, escribes código en el editor, y ejecutas comandos en la terminal integrada. Veamos un ejemplo completo:

1# En tu terminal (o en la terminal integrada de VS Code):
2mkdir mi-primer-proyecto
3cd mi-primer-proyecto
4code .                    # Abre VS Code en esta carpeta
5
6# Ahora en la terminal integrada de VS Code (Ctrl+`):
7mkdir data scripts
8echo "# Mi Primer Proyecto" > README.md