Live server en Visual Studio Code

Autor: | Última modificación: 14 de octubre de 2022 | Tiempo de Lectura: 2 minutos
Temas en este post:

¿Sabes qué es Live server en Visual Studio Code? Aunque se piense lo contrario, el mundo de un desarrollador web es mucho más que el editor de código, pues el resultado final se crea realmente en el navegador. Por ello, hay varias herramientas que le permiten previsualizar el resultado a la par que escribe su código.

En este post, te enseñaremos qué es y cómo funciona live server en Visual Studio Code, una herramienta fundamental para todo desarrollador web.

¿Qué es live server en Visual Studio Code?

Live server en Visual Studio Code es una herramienta que nos permite lanzar un servidor de desarrollo local para previsualizar en el navegador lo que estamos escribiendo en nuestro editor de código. Lo interesante de esta herramienta es que la previsualización se actualiza inmediatamente al guardar el proyecto desde el editor. Esto es ideal para revisar los cambios que hacemos en nuestras páginas tanto estáticas como dinámicas.

Para automatizar aún más el proceso, puedes editar la configuración de guardado automático en Visual Studio Code.

Además de live server en Visual Studio Code, existen muchas herramientas que nos permiten visualizar el resultado del código que estamos desarrollando al mismo tiempo que lo desarrollamos. Sin embargo, esta herramienta es la más utilizada cuando escribimos usando VSCode, pues se enfoca en el desarrollo frontend.

Algunas de las características de esta herramienta, además de tener una actualización rápida en el navegador, son el soporte de HTTPS de todos los navegadores, de la extensión de debugger de Chrome y el soporte de archivos para detectar cambios. Además, soporta proxies y un espacio de trabajo multiroot.

¿Cómo funciona live server en Visual Studio Code?

Lo primero que debes hacer para usar live server en Visual Studio Code es instalar los dos programas. Para ello, te recomendamos seguir el tutorial de Visual Studio Marketplace sobre Live Server.

Una vez instalados los programas, debes asegurarte de que están en funcionamiento. Ahora, para hacer funcionar la herramienta live server en Visual Studio Code, basta con ejecutar el siguiente comando en la terminal del editor de código:

npx live-server

Al darle a enter tras escribir este comando, se nos montará un servidor HTTP. Para conocer cuál es el servidor que se ha montado y cómo acceder a él, solo hay que leer la instrucción serving «/proyecto» at http://servidor. Este servidor recargará todo nuestro código en el navegador de manera inmediata en cuanto guardemos nuestro proyecto.

Como muchas de las herramientas en el mundo de la programación, podemos personalizar el funcionamiento de live server en Visual Studio Code. Para conocer las configuraciones que podemos darle a esta herramienta, te recomendamos explorar el github vscode-live-server/docs/settings.md.

¿Qué sigue?

Ahora que sabes qué es y cómo funciona live server en Visual Studio Code, ¡ha llegado la hora de usarlo en tus propios proyectos! Para seguir aprendiendo sobre el desarrollo de todo tipo de proyectos web, te invitamos a formar parte de nuestro Desarrollo Web Full Stack Bootcamp, en donde aprenderás a dominar los lenguajes y herramientas del desarrollo web en pocos meses para convertirte en un experto y destacar en el sector IT. ¡Pide ya más información para cambiar tu vida!

👉 Descubre más del Desarrollo Web Full Stack Bootcamp ¡Descarga el temario!

👉 Prueba el Bootcamp Gratis por una Semana ¡Empieza ahora mismo!

👉 Conoce nuestros otros Bootcamps en Programación y Tecnología

[email protected]

¿Trabajo? Aprende a programar y consíguelo.

¡No te pierdas la próxima edición del Aprende a Programar desde Cero Full Stack Jr. Bootcamp!

 

Prepárate en 4 meses, aprende las últimas tecnologías y consigue trabajo desde ya. 

 

Solo en España hay más de 120.400 puestos tech sin cubrir, y con un sueldo 11.000€ por encima de la media nacional. ¡Es tu momento!

 

🗓️ Próxima edición: 13 de febrero

 

Reserva tu plaza descubre las becas disponibles.

¿Sabías que hay más de 40.000 vacantes para desarrolladores web sin cubrir en España? 

En KeepCoding llevamos desde 2012 guiando personas como tú a áreas de alta empleabilidad y alto potencial de crecimiento en IT con formación de máxima calidad.

 

Porque creemos que un buen trabajo es fuente de libertad, independencia, crecimiento y eso ¡cambia historias de vida!


¡Da el primer paso!