JavaScript desde cero: guía práctica para principiantes

JavaScript desde cero | Tutorial práctico
Portátil con editor de código y elementos de programación
Guía práctica · Nivel inicial

Aprende JavaScript creando.

Una introducción clara al lenguaje que da vida a la web. Entiende los fundamentos, prueba código real y construye tu primer componente interactivo.

Empezar tutorial ↓Visitar CodeAdditsia ↗
● 20 min de lectura● Ejemplos prácticos● Sin experiencia previa
01 · Punto de partida

¿Qué es JavaScript?

JavaScript permite que una página responda al usuario. Mientras HTML organiza el contenido y CSS define su apariencia, JavaScript añade comportamiento: valida formularios, actualiza datos, anima interfaces y se comunica con servidores.

01

Está en el navegador

Puedes empezar ahora mismo, sin herramientas complejas.

02

Sirve para mucho

Web, servidores, apps móviles, escritorio y automatización.

03

Aprendes haciendo

Cada cambio aparece en pantalla inmediatamente.

02 · Fundamentos

Variables y tipos de datos

Una variable guarda un valor. Usa const si no vas a reasignarlo y let si puede cambiar.

  • Texto y números
  • Booleanos: true y false
  • Arrays y objetos
variables.js
const nombre = "Ada";
let nivel = 1;
const temas = ["HTML", "CSS", "JS"];
nivel++;
console.log(`${nombre}: nivel ${nivel}`);
03 · Reutiliza

Funciones: pequeñas máquinas

Una función recibe datos, realiza una tarea y puede devolver un resultado.

  • Evitan repetir lógica
  • Dividen problemas grandes
  • Facilitan mantener el código
funciones.js
function saludar(nombre) {
  return `¡Hola, ${nombre}!`;
}
const mensaje = saludar("JavaScript");
console.log(mensaje);
04 · Interactividad

El DOM y los eventos

El DOM representa la página que JavaScript puede modificar. Selecciona un elemento y escucha acciones como clics o escritura.

  • querySelector encuentra elementos
  • addEventListener escucha acciones
  • textContent actualiza el texto
eventos.js
const boton = document.querySelector("#sumar");
let contador = 0;
boton.addEventListener("click", () => {
  contador++;
  total.textContent = contador;
});
05 · Pruébalo

Tu primer componente interactivo

Este contador usa variables, funciones, selectores y eventos. Pulsa los botones y observa cómo JavaScript actualiza la página sin recargarla.

Reto: impide que el contador baje de cero.

0
06 · Clase en vídeo

Refuerza lo aprendido

Acompaña la lectura con este curso introductorio en español. Practica cada bloque en la consola del navegador.

Explorar más recursos ↗
Siguiente paso

Sigue programando. La práctica hace el código.

Descubre más ejemplos, ejercicios y explicaciones para continuar avanzando a tu ritmo.

Ir al tutorial de JavaScript ↗

Comentarios

Publicar un comentario

Hola amigos/as dejad vuestros comentarios, gracias 🙂

Entradas populares de este blog

Inicios de un Gran Proyecto: cómo convertir una idea en realidad

  Primera entrada · CodeAddits CodeAddits y Lotodes: el inicio de un proyecto real Bienvenidos a CodeAddits , un espacio creado para aprender programación, inteligencia artificial y desarrollo moderno construyendo proyectos reales. Empezamos esta etapa con Lotodes , nuestro primer proyecto de referencia. Qué es CodeAddits CodeAddits nace con una idea clara: aprender haciendo. Aquí hablaremos de programación, IA, Android, bases de datos, Linux, desarrollo web y herramientas modernas, pero siempre con un enfoque práctico. El objetivo no es publicar teoría aislada. Cada entrada debe servir para construir algo, resolver un problema o mejorar una parte concreta de un proyecto. Qué es Lotodes Lotodes es nuestro proyecto en marcha. Nos servirá como laboratorio real para aplicar lo que vamos aprendiendo y convertirlo en una herramienta ...
Leer más

Historia de la Computación: desde el ábaco hasta la Inteligencia Artificial

Historia de la programación · CodeAddicts Los inicios de la programación: cuando las ideas empezaron a dar instrucciones a las máquinas Antes de Python, JavaScript, Android o la inteligencia artificial moderna, hubo una pregunta fundamental: ¿cómo podemos decirle a una máquina exactamente qué debe hacer? Esa pregunta marcó el nacimiento de la programación.  La programación empezó antes que los ordenadores modernos Cuando pensamos en programar, solemos imaginar pantallas, editores de código y terminales. Pero los primeros pasos de la programación aparecieron mucho antes de los ordenadores personales. En el siglo XIX, Charles Babbage diseñó la Máquina Analítica, una idea revolucionaria para su época: una máquina capaz de realizar cálculos siguiendo instrucciones. Aunque no llegó a construirse completamente, sentó una base clave para la computación. Ada Love...
Leer más

Código Máquina: Qué es, cómo funciona y ejemplos prácticos en Linux x86-64

Código Máquina: qué es, cómo funciona y ejemplos en Linux Programación de bajo nivel Código Máquina: el lenguaje que entiende directamente el procesador Descubre cómo las instrucciones escritas en ensamblador se convierten en bytes ejecutables y aprende a crear tus primeros programas para Linux x86-64. La mayoría de los programadores escriben código en Python, C++, Java o JavaScript. Sin embargo, ninguno de estos lenguajes es ejecutado directamente por el procesador. Antes de que un programa pueda funcionar, debe convertirse en código máquina , el único lenguaje que la CPU entiende de forma nativa. ¿Qué es el código máquina? El código máquina es un conjunto de instrucciones representadas mediante bytes que el procesador ejecuta directamente. Por ejemplo, una instrucción ensamblador como:...
Leer más