Antes de continuar
Ahora que sabemos crear archivos personalizados, hablemos un poco del flujo de trabajo que recomendamos usar en este curso.
Sobre la ruta de estudio
A pesar de que existen diferentes alternativas para agregar JavaScript a nuestros proyectos, en esta ruta de estudio nos concentraremos en usarlo mediante el procedimiento que aprendimos en la lección pasada.
Sobre la creación de archivos
Nuestra siguiente recomendación es crear un nuevo archivo .html
por cada lección que veamos. Todos van a seguir la misma estructura básica:
- Crear un archivo con el nombre de la lección. Por ejemplo:
variables.html
- Agregar el código HTML por defecto
- Agregar las etiquetas
<script>
- Escribir el código de las lecciones y ejercicios
Por ejemplo:

Sobre Live Server
Por defecto, cuando modificamos el código dentro de nuestros archivos, debemos recargar la página en el navegador para ver los cambios. Esto puede ser un poco molesto, especialmente cuando estamos aprendiendo.
Para solucionar este problema, podemos usar una extensión de VS Code llamada Live Server.
Una extensión es como un mini programa que le agrega funcionalidad a nuestro editor de código.
Instalación
Para instalar Live Server, debemos:
- Ir a la barra lateral de VS Code y abrir el panel de Extensiones
- En la barra de búsqueda, escribir
Live Server
- Instalamos la extensión, usualmente es la primera opción en los resultados

Uso
Una vez instalada la extensión, podemos abrir nuestros archivos HTML de una manera más conveniente:
- Dar clic derecho sobre el archivo HTML
- Seleccionar
Open with Live Server

Esto abrirá nuestro archivo en el navegador.
Ahora cada vez que hagamos cambios en el archivo y guardemos, la página se actualizará automáticamente.