En la web anterior aprendiste a escribir HTML y CSS: la estructura y el aspecto. JavaScript es lo que hace que la página responda. Y antes de escribir una sola línea, conviene saber dónde vive y cómo se prueba, porque ahí es donde vas a pasar las horas.
Tu primer sitio es la consola del navegador. Se abre con F12 (o clic derecho → Inspeccionar → Consola). Es una ventana donde el navegador te habla: escribe lo que le pides, y también los errores. Aprende a mirarla desde el minuto uno; el que no la mira programa a ciegas.
Para que tu código se ejecute en una página, se enlaza el archivo desde el HTML:
<script src="app.js"></script>Y va justo antes de cerrar </body>, no en la cabecera. El motivo es de orden: el navegador lee el HTML de arriba abajo. Si el script se ejecuta antes de que el HTML exista, busca elementos que todavía no están y no encuentra nada.
console.log(algo) escribe en la consola lo que le pongas. Es la herramienta que más vas a usar, muy por encima de cualquier otra: sirve para ver qué vale una variable en cualquier punto.
La forma de trabajar no es escribir mucho y rezar. Es un ciclo corto que repites sin parar:
- Escribes una línea. Una idea, no un bloque entero.
- Guardas y recargas la página.
- Miras la consola. ¿Ha salido lo que esperabas?
- Si hay error rojo, lo lees entero. Dice el archivo y la línea exacta.
El error de principiante: escribir veinte líneas antes de probar. Cuando algo falla, no sabes cuál de las veinte fue. Escribe una, compruébala, sigue. Depurar de una en una es cuatro veces más rápido que de golpe.
Y cuando salga un error rojo, no lo esquives: léelo. Un mensaje como Uncaught ReferenceError: nombre is not defined te está diciendo, con nombres y apellidos, que usaste algo que no existe. El error no es tu enemigo; es la pista más directa que tienes.
En una línea
- La consola (F12) es donde el navegador te habla: míralas siempre.
- El script va al final del body para que el HTML ya exista.
- Trabaja en ciclos cortos: una línea, prueba, siguiente.