Sobre Live Server

herramientas extensión

2 Minutos

1 feb 2024

6 jun 2024

Live Server es una extensión de VS Code que nos ayuda a ver nuestro sitio web sin tener que recargar el navegador cada que hagamos cambios. De esta manera podemos desarrollar a la par con lo que estamos viendo.

Instalación

Para instalarla, nos dirigimos a la barra lateral > extensiones y buscamos live server.

¿Cómo usar?

Para iniciar el servidor

Hay dos formas de ejecutar la extensión. Una de ellas es estar en un archivo .html y dar clic derecho.

En el menú deberá aparecer Open with Live Server.

La otra opción es dar clic en la barra inferior, en el botón Go Live.

Cómo funciona

Una vez que iniciamos el servidor, se abrirá nuestro navegador en la dirección que por defecto nos da la extensión: http://127.0.0.1:5500

Ahora podemos cambiar el código y al guardar el archivo, los cambios se verán reflejados automáticamente en el navegador.

Para que la extensión funcione correctamente debemos tener por lo menos la etiqueta <body> dentro de nuestro archivo. Si no, nos aparecerá una advertencia.

Para detener el servidor

Para detener el servidor se hace de manera similar.

Podemos dar clic derecho y seleccionar Stop Live Server.

O podemos ir a la barra inferior y utilizar el botón que indica el puerto en el que está corriendo el servidor, usualmente Port: 5500.

Comentarios

Esta artículo aparece en estas rutas de aprendizaje

Aprendamos HTML

Aprenderemos desde los conceptos básicos de HTML hasta los conceptos más avanzados

DEV

Web Dev (Frontend)

Aprendamos HTML, CSS y JS para navegador

En construcción