Saltar la navegación

🚀 Guía rápida para empezar a programar en JavaScript

Introducción

Antes de instalar nada ni usar herramientas complejas, vamos a empezar donde JavaScript nació y vive cada día: el navegador. Esta forma de empezar es, en mi opinión, la mejor posible, porque elimina barreras y te permite centrarte en lo importante: probar, equivocarte y entender qué pasa.

🧪 Primer paso: JavaScript en el navegador

Todos los navegadores modernos incluyen herramientas para desarrolladores con una consola JavaScript. Ahí puedes escribir código y ver el resultado al instante.

Vamos a usar Mozilla Firefox, aunque Chrome o Edge funcionarían igual.

🔧 Abrir la consola en Firefox

  1. Abre Firefox.
  2. Pulsa F12 o Ctrl + Shift + K.
  3. Se abrirán las herramientas de desarrollo.
  4. Haz clic en la pestaña Consola.

Consola Javascript

Ya estás dentro de un entorno real de programación.

✍️ Ejecutando tus primeras instrucciones

Prueba a escribir esto en la consola y pulsa Enter:

console.log("Hola, JavaScript");

Verás el mensaje en pantalla. Acabas de ejecutar tu primer programa.

Prueba ahora con números:

console.log(2 + 3);

Y con variables:

let edad = 16;
console.log(edad);

💡 Consejo importante: la consola es ideal para experimentar. No pasa nada si te equivocas. Aquí aprenderás probando cosas pequeñas.

Resultado del código

🧠 Qué estás haciendo realmente

  • Estás escribiendo instrucciones.
  • Se ejecutan en orden (secuenciación).
  • El navegador actúa como intérprete de JavaScript.

Esto es programación real, no una simulación.

🖥️ Segundo paso: usar un IDE online

La consola está genial para aprender, pero cuando los programas crecen necesitamos:

  • Escribir varias líneas con comodidad.
  • Guardar código.
  • Ejecutar programas más completos.
  • Para eso vamos a usar un IDE online, que funciona directamente desde el navegador.

Dos opciones muy recomendables:

🔹 CodePen

  • Muy visual e intuitivo.
  • Ideal para empezar y para código corto.
  • Perfecto para ver resultados rápidos.

🔹 Replit

  • Más completo.
  • Permite trabajar como en un entorno profesional.
  • Ideal para proyectos un poco más largos.

Cualquiera de los dos te vale. Lo importante no es la herramienta, sino lo que haces con ella.

🧪 Primer ejemplo en un IDE onlineCodepen

Vamos a elegir CodePen por su sencillez, si deseas hacerlo con Replit, experimenta tú mismo.

  1. En primer lugar, accede al sitio web: https://codepen.io/
  2. A continuación haz clic en Start Coding como ves en la imagen a la derecha
  3. En este punto, empieza a crear tu código. Aquí es donde empieza la "magia":
  4. Ve a la sección JS (significa JavaScript), escribe el siguiente código y observa el resultado en la consola (abajo a la izquierda):
let nombre = "Ada";
console.log("Hola " + nombre);

Código

👉 Aquí ya no estás probando instrucciones sueltas, estás escribiendo un pequeño programa completo.

🧠 Para quedarte con lo esencial

  • JavaScript se puede usar directamente desde el navegador.
  • La consola es perfecta para aprender y experimentar.
  • Un IDE online te permite trabajar de forma más ordenada.
  • No tengas miedo a probar: programar es ensayo y error con cabeza.

A partir de aquí, el teclado es tu laboratorio. 💻🧠

Creado con eXeLearning (Ventana nueva)