Dominando el Comando de Línea para el Desarrollo Web en HTML, CSS y JavaScript

Adentrarte en el mundo del desarrollo web implica más que solo aprender HTML, CSS y JavaScript; también es crucial entender cómo usar eficientemente el comando de línea o terminal. Esta herramienta poderosa te permite interactuar directamente con tu sistema operativo y realizar una variedad de tareas importantes. En esta guía, te introduciremos al comando de línea y sus comandos esenciales, facilitando tu trabajo en proyectos de desarrollo web.

¿Qué es el Comando de Línea o Terminal?

El comando de línea, también conocido como terminal, es una interfaz basada en texto que te permite comunicarte con el sistema operativo de tu computadora. Te permite ejecutar comandos escribiendo instrucciones de texto en lugar de depender únicamente de interfaces gráficas (GUI). Aunque puede parecer intimidante al principio, el comando de línea ofrece una forma más rápida y eficiente de realizar tareas una vez que te familiarices con sus comandos básicos.

Empezando con el Comando de Línea

1. Abrir el Comando de Línea:
   • En Windows: Abre el menú Inicio, busca Símbolo del sistema o PowerShell y haz clic para abrirlo.
   • En macOS: Abre la aplicación Terminal, que se encuentra en la carpeta "Utilidades" dentro del directorio Aplicaciones.
   • En Linux: Abre la aplicación Terminal a través del lanzador de aplicaciones del sistema o presionando ctrl+alt+t.
2. Navegando por Carpetas:
   • cd directorio: Cambia el directorio actual al especificado. Por ejemplo, cd Documentos te llevará a la carpeta "Documentos".
   • cd ..: Retrocede un nivel en la jerarquía de directorios.
   • cd ~: Navega hasta tu directorio de inicio.
3. Listando Archivos y Carpetas:
   • ls (macOS/Linux) o dir (Windows): Lista los archivos y carpetas en el directorio actual. ls -lodir /w`: Muestra una lista detallada de archivos y carpetas.
4. Creando y Eliminando Archivos/Carpetas:
   • touch archivo.txt (macOS/Linux) o echo > archivo.txt(Windows): Crea un nuevo archivo.
   • mkdir carpeta (macOS/Linux) o mkdir carpeta (Windows): Crea una nueva carpeta.
   • rm archivo.txt (macOS/Linux) o del archivo.txt (Windows): Elimina un archivo.
   • rmdir carpeta (macOS/Linux) o rmdir /s carpeta (Windows): Elimina una carpeta vacía.

Ejecutando Archivos HTML, CSS y JavaScript

1. Abriendo Archivos HTML en el Navegador:
   • Navega hasta el directorio que contiene tu archivo HTML usando el comando cd.
   • Escribe el nombre del archivo HTML (por ejemplo, index.html) y presiona Enter.
   • El navegador web predeterminado se abrirá, mostrando tu página HTML.
2. Usando un Servidor de Desarrollo Local:
   • Instala un servidor ligero como http-server ejecutando npm install -g http-server (requiere Node.js y npm).
   • Navega hasta el directorio de tu proyecto en el comando de línea.
   • Ejecuta http-server para iniciar el servidor. Abre tu navegador web y visita http://localhost:8080 para ver tu página web.
   • Nota: Tengo un artículo el cual hablo más afondo el tema de crear tu propio entorno localhost.

En conclusión

Dominar el comando de línea o terminal es una habilidad valiosa para los desarrolladores web que trabajan con HTML, CSS y JavaScript. Te proporciona un mayor control y eficiencia en la gestión de archivos, carpetas y ejecución de proyectos web. Al familiarizarte con los comandos básicos mencionados en esta guía, podrás navegar por los directorios, crear y eliminar archivos y carpetas, y ejecutar tus páginas web sin problemas.

Si tienes alguna pregunta o comentario, no dudes en dejarlos en los comentarios.

¡Gracias por leer y nos vemos en el próximo artículo!