Aprender a moverte en la terminal de Linux es una de las habilidades más valiosas para cualquier persona que quiera dedicarse al desarrollo web. Aquí descubrirás los comandos básicos de terminal Linux que necesitas para navegar entre directorios, crear archivos HTML y abrirlos en Visual Studio Code usando WSL.

Esta guía está pensada para quienes están dando sus primeros pasos en front-end y quieren dejar de depender del clic derecho para crear archivos.

¿Cómo saber en qué directorio estás dentro de la terminal?

El primer comando que vas a usar es pwd, que viene de print working directory. Te dice exactamente en qué carpeta estás parado dentro del sistema [00:12].

Es tu punto de partida. Antes de mover archivos, crear carpetas o ejecutar proyectos, conviene saber dónde estás.

¿Qué hace el comando pwd? Imprime la ruta del directorio en el que te encuentras actualmente. Útil para confirmar tu ubicación antes de ejecutar otros comandos.

¿Cómo cambiar de directorio con cd?

El comando cd significa change directory y te permite moverte entre carpetas. Tiene tres variantes que vale la pena memorizar:

• cd . te mantiene en el mismo lugar.
• cd .. te retrocede un directorio.
• cd solo te lleva a tu directorio principal, ese que aparece con la virgulilla (~) [00:35].

Si sigues retrocediendo con cd .., vas a llegar al directorio raíz, representado con un simple /. Ese es el origen de todo el árbol de archivos en Linux [01:05].

¿Cómo limpiar y resetear la terminal cuando se pone lenta?

A veces la pantalla se llena de texto y se vuelve incómodo trabajar. Para eso existe clear, que limpia la vista y te deja la terminal como nueva [01:25].

Ojo: cls no funciona aquí, ese es de otra terminal.

Si además sientes que tu terminal está respondiendo lenta o rara, usa reset. Tarda un poco más porque hace un reseteo completo, pero soluciona muchos problemas de rendimiento [01:40].

¿Cuándo uso reset en lugar de clear? Usa clear cuando solo quieres limpiar la pantalla. Usa reset cuando la terminal responde lenta o muestra caracteres extraños.

Otro truco útil: puedes abrir varias terminales al mismo tiempo. En una trabajas con tu proyecto y en otra haces pruebas, sin interferencias.

¿Cómo creo un archivo HTML desde la terminal de Linux?

En Windows estás acostumbrado al clic derecho, crear archivo. En Linux el flujo cambia y se hace con un solo comando: touch [02:15].

La sintaxis es directa:

bash touch web.html

Después, si ejecutas ls, vas a ver tu archivo web.html listado en el directorio actual. Ese ls te muestra el contenido de la carpeta donde estás.

¿Cómo abrir el proyecto en Visual Studio Code desde la terminal?

Estando dentro de la carpeta de trabajo, escribe:

bash code .

El punto significa abre el directorio actual. Visual Studio Code se va a lanzar mostrando todos los archivos de esa carpeta [02:55]. La primera vez te va a preguntar si confías en los autores. Como el código lo escribiste tú, le das que sí.

¿Qué estructura HTML básica necesitas para tu primera web?

Dentro de web.html puedes empezar con la estructura mínima que todo sitio web necesita. La declaración DOCTYPE html le dice al navegador que estás usando HTML5.

Luego abres la etiqueta html y dentro colocas dos bloques principales:

• El head para metadata como el title, que es lo que aparece en la pestaña del navegador.
• El body, donde va el contenido visible de la página.

Dentro del body puedes usar un div para encapsular contenido y una etiqueta h1 para tu primer título visible. Algo tan simple como Hola, queridos estudiantes, bienvenidos a este gran proyecto ya cuenta como tu primer elemento HTML funcional [04:20].

¿Cómo conectar Visual Studio Code con WSL?

Para que tu Visual Studio Code trabaje directamente con el ambiente Linux, necesitas la extensión Windows Subsystem for Linux (WSL). Esa extensión integra ambos mundos: editas con la comodidad de VS Code y ejecutas con la potencia del entorno Linux [05:00].

La instalas desde la pestaña de extensiones, le das clic en Install y listo. A partir de ahí, todo lo que abras desde la terminal de Ubuntu con code . corre integrado con WSL.

¿Cómo visualizar tu HTML en el navegador con Live Server?

Con la extensión Live Server instalada, vas a ver un botón que dice Go Live en la barra inferior de VS Code. Le das clic, permites el acceso y tu navegador abre automáticamente la web mostrando el título y el contenido del h1 [05:45].

Ese flujo (editar, guardar con Ctrl + S, ver cambios en vivo) es la base del desarrollo front-end moderno.

¿Qué hace Live Server? Levanta un servidor local que recarga tu navegador cada vez que guardas cambios en el código. Ideal para ver resultados al instante.

Dominar la terminal no es opcional si quieres competir como desarrollador front-end. Cuéntame en los comentarios qué comando se te hizo más útil y cuál te dio más curiosidad para profundizar.