¿Qué Es Visual Studio Code? Guía para Principiantes en Programación

Cuando empiezas a aprender a programar, una de las primeras preguntas es: ¿dónde escribo el código? Podrías usar un editor de texto simple como el Bloc de notas, pero muy pronto extrañarías cosas como el código con colores, los avisos de errores y una forma de ejecutar tu programa con un clic.

Por eso tantos principiantes, y también desarrolladores profesionales, usan Visual Studio Code, al que casi todos llaman simplemente VS Code. Es gratis, funciona en los principales sistemas operativos y sirve para casi cualquier lenguaje de programación. En esta guía vas a aprender qué es VS Code, cómo instalarlo, cómo moverte por su interfaz y cómo escribir y ejecutar tu primer programa.

¿Qué Es Visual Studio Code?

Visual Studio Code es un editor de código gratuito creado por Microsoft. Funciona en Windows, macOS y Linux, y es una de las herramientas de desarrollo más populares del mundo.

Desde que lo instalas, VS Code es un editor rápido y ligero con funciones pensadas para el código:

• Resaltado de sintaxis: las palabras clave, los textos y los números aparecen en colores distintos, así el código es más fácil de leer.
• IntelliSense: sugerencias inteligentes que completan nombres y te muestran qué espera una función mientras escribes.
• Resaltado de errores: líneas onduladas rojas y amarillas debajo de los problemas, incluso antes de ejecutar tu código.
• Una terminal integrada, integración con Git y un depurador.

Lo que lo hace tan flexible son sus extensiones: complementos gratuitos de su tienda que agregan soporte para lenguajes y herramientas específicas. Con las extensiones adecuadas, el mismo editor sirve para Python, HTML y CSS, JavaScript, SQL, Docker y mucho más.

El núcleo de VS Code es de código abierto (el proyecto se llama Code - OSS y está publicado en GitHub con la licencia MIT), mientras que la versión que descargas de Microsoft agrega la marca de Microsoft y algunos extras bajo su propia licencia. En cualquier caso, es gratis para uso personal y comercial.

VS Code vs. Visual Studio vs. Otros Editores

Los nombres confunden a mucha gente, así que aquí tienes una comparación rápida:

Un IDE incluye todo lo necesario para un tipo de desarrollo en un solo paquete grande. VS Code empieza pequeño y te deja agregar solo lo que necesitas, lo que lo hace rápido y fácil para principiantes. Son productos distintos: si un tutorial dice “Visual Studio”, revisa si se refiere a VS Code antes de descargar el equivocado.

Cómo Instalar VS Code

1. Ve al sitio oficial, code.visualstudio.com, y descarga la versión para tu sistema operativo. Descárgalo solo de ahí, no de sitios de descargas de terceros.
2. Instálalo:
   • Windows: ejecuta el instalador. Cuando te pregunte por tareas adicionales, deja marcada la opción Agregar a PATH y considera marcar “Abrir con Code” para archivos y carpetas. Así tendrás una opción útil en el menú del clic derecho del Explorador de archivos.
   • macOS: abre el archivo descargado y arrastra Visual Studio Code a tu carpeta Aplicaciones.
   • Linux: instala el paquete .deb (Ubuntu, Debian) o el paquete .rpm (Fedora, Red Hat), o usa la tienda de software de tu distribución.
3. Abre VS Code. Una página de Bienvenida te guía para elegir un tema y algunos ajustes básicos.

Abre VS Code desde la Terminal

El comando code te permite abrir cualquier carpeta en VS Code desde la terminal:

code .

El . significa “la carpeta actual”. En Windows y Linux, el instalador lo configura por ti. En una Mac, abre VS Code, presiona Cmd + Shift + P, escribe shell command y ejecuta el comando que instala code en el PATH (en las versiones recientes se llama Shell Command: Install ‘code’ and optionally ‘copilot’ commands in PATH). Después reinicia tu terminal.

Un Recorrido por la Interfaz de VS Code

Cuando abres una carpeta, VS Code se divide en cinco áreas principales:

1. Barra de actividades (la franja angosta de íconos a la izquierda): cambia entre vistas como el Explorador, Buscar, Control de código fuente, Ejecutar y depurar, y Extensiones.
2. Barra lateral: muestra la vista seleccionada. Casi siempre es el Explorador, con los archivos y carpetas de tu proyecto.
3. Editor: el área grande donde escribes código. Puedes abrir archivos en pestañas y dividir el editor para ver dos archivos lado a lado.
4. Panel (abajo): contiene la Terminal, Problemas (una lista de errores y advertencias), Salida y la Consola de depuración.
5. Barra de estado (la barra delgada de hasta abajo): muestra información como la línea actual, el lenguaje del archivo y, en Python, qué versión de Python está usando el proyecto.

La Paleta de Comandos: el Atajo Más Útil

Si solo vas a recordar un atajo, que sea este: Ctrl + Shift + P (Cmd + Shift + P en Mac). Abre la Paleta de comandos, un cuadro de búsqueda con todos los comandos de VS Code. Escribe lo que quieres, como “theme”, “format” o “terminal”, y elígelo de la lista. Nunca tendrás que buscar entre menús.

Tu Primer Proyecto: Hola, Mundo en Python

Vamos a escribir y ejecutar un programa pequeño en Python. Necesitas tener Python instalado en tu computadora (si eres nuevo en Python, empieza con Fundamentos de Python: Lo que Todo Principiante Debería Saber).

1. Abre una carpeta. Crea una carpeta nueva llamada hello-vscode y en VS Code elige Archivo → Abrir carpeta y selecciónala. VS Code funciona mejor cuando abres una carpeta (tu proyecto), no archivos sueltos.

Confianza en el área de trabajo: la primera vez que abres una carpeta, VS Code te pregunta si confías en los autores de sus archivos. Para tus propias carpetas, elige Sí, confío en los autores. Para código descargado de internet que no has revisado, elegir No lo abre en Modo restringido, que impide que el código se ejecute automáticamente.

2. Instala la extensión de Python. Haz clic en el ícono de Extensiones en la Barra de actividades (o presiona Ctrl + Shift + X), busca Python e instala la que publica Microsoft. Muchas veces VS Code te la sugiere automáticamente al abrir un archivo de Python.

3. Crea un archivo. En el Explorador, haz clic en el ícono de Nuevo archivo y llámalo hello.py. La terminación .py le indica a VS Code que es un archivo de Python, así que activa los colores y las sugerencias correctas. Escribe:

name = input("What's your name? ")
print(f"Hello, {name}! Welcome to VS Code.")

4. Ejecútalo. Haz clic en el botón Ejecutar (el triángulo ▷) en la esquina superior derecha del editor. VS Code abre la terminal abajo y ejecuta tu programa. Escribe tu nombre y presiona Enter:

What's your name? Ana
Hello, Ana! Welcome to VS Code.

Eso es todo: escribiste y ejecutaste un programa sin salir del editor.

También puedes ejecutarlo tú mismo en la terminal integrada. Ábrela con Ctrl + ` (la tecla del acento grave). En muchos teclados en español ese atajo es Ctrl + Ñ; si ninguno funciona, usa el menú Terminal → Nueva terminal. Después escribe python hello.py (o python3 hello.py en macOS y Linux).

Consejo: si VS Code te pide seleccionar un intérprete de Python, te está preguntando qué instalación de Python usar. Haz clic en la versión de Python en la Barra de estado, o ejecuta Python: Select Interpreter desde la Paleta de comandos. Si tu proyecto tiene un entorno virtual, elige ese. (Consulta Entornos Virtuales de Python: Guía de Configuración y Mejores Prácticas.)

Extensiones que Vale la Pena Instalar

Las extensiones son las que convierten a VS Code en la herramienta adecuada para tu trabajo. Empieza con las que coincidan con lo que estás aprendiendo:

Instala las extensiones con cuidado. Las extensiones pueden ejecutar código en tu computadora, igual que cualquier programa. Prefiere las de editores verificados (tienen una marca de verificación junto a su nombre), con muchas instalaciones y actualizaciones recientes, e instala solo las que realmente uses.

Atajos de Teclado que Todo Principiante Debe Conocer

Algunos atajos son diferentes en Linux, y en algunos teclados en español ciertas combinaciones cambian según la distribución del teclado. Para ver o cambiar cualquier atajo, abre Métodos abreviados de teclado con Ctrl + K y luego Ctrl + S (Cmd + K, Cmd + S en Mac).

Un truco más: varios cursores. Mantén presionada la tecla Alt (Option en Mac) y haz clic en varios lugares para escribir en todos al mismo tiempo. Junto con Ctrl + D, es una forma rápida de editar texto repetido.

Funciones Integradas que Usarás Todos los Días

• IntelliSense: empieza a escribir y VS Code te sugiere nombres, funciones y sus parámetros. Presiona Tab o Enter para aceptar una sugerencia.
• Panel de Problemas: los errores y advertencias aparecen como líneas onduladas en tu código y como una lista en el panel Problemas. Haz clic en uno para ir directo a él.
• Depurador: haz clic a la izquierda del número de una línea para poner un punto de interrupción (un punto rojo) y presiona F5. Tu programa se detiene en esa línea y puedes revisar el valor de cada variable. Es mucho más útil que llenar tu código de print().
• Control de código fuente: VS Code tiene Git integrado. La vista de Control de código fuente muestra qué cambió en cada archivo y te permite preparar, confirmar (commit) y subir (push) cambios sin escribir comandos de Git. Aun así, ayuda aprender primero los comandos; consulta Domina Git: Comandos Básicos para el Control de Versiones.
• Emmet para HTML: en un archivo .html, escribe ! y presiona Tab (o Enter) para generar al instante la estructura completa de una página HTML. (¿Eres nuevo en HTML? Consulta Cómo Usar HTML y CSS: Guía para Principiantes.)
• Guardado automático: activa Archivo → Guardado automático para no perder tu trabajo ni ejecutar por accidente una versión vieja.

Personaliza VS Code

Temas

Presiona Ctrl + K y luego Ctrl + T (Cmd + K, Cmd + T en Mac) para ver y elegir un tema de colores. Puedes instalar más temas desde la vista de Extensiones.

Configuración

Abre la Configuración con Ctrl + , (Cmd + , en Mac). Puedes buscar cualquier opción, como “font size” o “word wrap”, y cambiarla con un clic.

Por detrás, VS Code guarda tu configuración en un archivo llamado settings.json. Para editarlo directamente, ejecuta Preferences: Open User Settings (JSON) desde la Paleta de comandos. Este es un buen punto de partida para principiantes:

{
    "editor.fontSize": 16,
    "editor.wordWrap": "on",
    "editor.formatOnSave": true,
    "files.autoSave": "afterDelay",
    "workbench.colorTheme": "Default Dark Modern"
}

Esto hace el texto un poco más grande, ajusta las líneas largas para que no tengas que desplazarte hacia los lados, da formato al archivo cada vez que guardas (si tienes un formateador instalado), guarda automáticamente y usa el tema oscuro predeterminado.

Sincronización de la Configuración y Perfiles

• Sincronización de la configuración guarda tu configuración, tus extensiones y tus atajos en tu cuenta de Microsoft o de GitHub, para que una computadora nueva quede lista en segundos. Actívala desde el ícono de Cuentas en la parte inferior de la Barra de actividades.
• Perfiles te permiten tener configuraciones separadas, por ejemplo una con extensiones de Python para análisis de datos y otra con extensiones para desarrollo web. Adminístralos desde Archivo → Preferencias → Perfiles (Code → Configuración → Perfiles en Mac).

Funciones de IA en VS Code

VS Code incluye funciones de IA a través de GitHub Copilot: sugerencias de código mientras escribes, una vista de Chat donde puedes hacer preguntas sobre tu código y agentes que pueden hacer cambios en varios archivos. Si inicias sesión con una cuenta de GitHub sin una suscripción de pago, obtienes el plan Copilot Free, que incluye un uso mensual limitado.

La IA puede ser una gran ayuda, pero cuando estás aprendiendo también puede pensar por ti. Un buen enfoque:

• Primero inténtalo, luego pregunta. Escribe tu propia solución y usa la IA para que te explique los errores o revise lo que escribiste.
• Lee cada sugerencia antes de aceptarla y asegúrate de entenderla.
• Desactívala si prefieres aprender sin ella. Busca Disable AI Features en la Configuración (la opción chat.disableAIFeatures). Puedes desactivarla para todo o solo para un proyecto específico.

Para Ir Más Allá

Cuando ya domines lo básico, VS Code crece contigo:

• Remote - SSH: edita y ejecuta código en un servidor, como un VPS o una Raspberry Pi, desde tu propia computadora. (Consulta ¿Qué Es SSH?.)
• Dev Containers: desarrolla dentro de un contenedor de Docker, para que cada proyecto tenga exactamente las herramientas que necesita. (Consulta Docker para Principiantes.)
• WSL: en Windows, escribe código dentro de un entorno Linux real.
• vscode.dev: una versión de VS Code que funciona en tu navegador, sin instalar nada. Es práctica para hacer cambios rápidos desde cualquier computadora, aunque no puede abrir una terminal ni ejecutar la mayoría de los programas.

Errores Comunes de Principiantes

• Abrir archivos sueltos en lugar de una carpeta. Muchas funciones, como el Explorador, la búsqueda y Git, trabajan sobre la carpeta que abriste. Para un proyecto, usa siempre Archivo → Abrir carpeta.
• Olvidar guardar. Un punto blanco en una pestaña significa que el archivo tiene cambios sin guardar. Presiona Ctrl + S (Cmd + S) o activa el Guardado automático.
• Usar el Python equivocado. Si un paquete que instalaste “no se encuentra”, revisa el intérprete en la Barra de estado.
• Instalar demasiadas extensiones. Cada una puede hacer más lento a VS Code o chocar con otra. Instala lo que necesites y quita lo que no uses.
• Confundir VS Code con Visual Studio. Son productos distintos, como vimos arriba.

Conclusión

Visual Studio Code es un editor de código gratuito, rápido y flexible que sirve para casi cualquier lenguaje. Aprendiste a instalarlo, a moverte por su interfaz, a escribir y ejecutar tu primer programa en Python, a agregar las extensiones adecuadas y a trabajar más rápido con la Paleta de comandos y los atajos de teclado.

La mejor forma de sentirte cómodo es usarlo todos los días. Abre una carpeta, crea un archivo y empieza a construir algo pequeño: una calculadora, una página web, un script que cambie el nombre de tus fotos. VS Code te acompañará en cada paso, desde tu primer print() hasta tu primer proyecto real. (¿Listo para un proyecto web? Consulta Aprende JavaScript: Guía para Principiantes.)