JavaScript desde Cero
Se intenta aprendan a programar con JavaScript para crear páginas web interactivas y sentar bases sólidas para frameworks modernos (React, Vue, Angular…).
1. Introducción
Se explica qué es JavaScript, su papel en la web (junto a HTML y CSS) y cómo configurarse un entorno sencillo con el navegador y Visual Studio Code. Primera prueba: un “Hola Mundo” en la consola.
Lecciones
1.1 Qué es JavaScript y para qué sirve. 1.2 Entorno de trabajo (navegador, VS Code). 1.3 Hola mundo en JS. 1.4 Resumen Introducción2. Fundamentos del lenguaje
Bases de programación: variables con
let y const, tipos de datos (números, cadenas, booleanos), operadores y estructuras de control como if, for o while. Es el esqueleto de todo programa.Lecciones
2.1 Variables (let, const). 2.2 Tipos de datos. 2.3 Operadores. 2.4 Estructuras de control (if, for, while). 2.5 Resumen del lenguaje3. Funciones
Qué son, cómo se crean y usan. Diferencia entre funciones tradicionales y funciones flecha. Se trabaja el paso de parámetros, retorno de valores y conceptos como el ámbito de las variables.
Lecciones
3.1 Declaración y expresión. 3.2 Funciones flecha. 3.3 Parámetros y retorno. 3.4 Ámbito y closures. 3.5 Resumen Funciones4. Objetos y Arrays
Cómo guardar y organizar datos en estructuras clave: arrays y objetos. Métodos esenciales de arrays (
map, filter, reduce) y cómo trabajar con JSON para intercambiar datos.Lecciones
4.1 Creación y manipulación. 4.2 Métodos principales de arrays (map, filter, reduce). 4.3 Introducción a JSON. 4.4 Resumen Objetos y Arrays5. DOM (Document Object Model)
Cómo acceder y modificar el contenido de una página web desde JavaScript. Selección de elementos, cambios en el texto, estilo o atributos. Es la base para hacer páginas dinámicas.
Lecciones
5.1 Selección de elementos. 5.2 Eventos (click, input, submit). 5.3 Manipulación del DOM. 5.4 Resumen DOM6. Eventos y formularios
Cómo escuchar e interactuar con las acciones del usuario (clics, teclas, envíos de formularios). Validaciones básicas para evitar datos erróneos. Aquí se aprende a conectar el código con la experiencia del usuario.
Lecciones
6.1 Validación de formularios con JS. 6.2 Prevención de envíos incorrectos. 6.3 Resumen Eventos y formularios7. Asincronía
Se introduce el concepto de procesos no bloqueantes. Uso de
setTimeout, setInterval, fetch para llamadas a servidores y async/await para escribir código más claro y moderno.Lecciones
7.1 setTimeout y setInterval. 7.2 fetch y promesas. 7.3 async/await. 7.4 Resumen Asincronía8. Mini proyectos prácticos
Aplicar lo aprendido en ejercicios útiles:Calculadora básica.Lista de tareas (To-Do list).Juego sencillo (piedra, papel o tijera).Consumo de una API pública como el clima.
Lecciones
8.1 Calculadora básica. 8.2 Lista de tareas (To-Do list). 8.3 Juego sencillo (ej: piedra, papel o tijera). 8.4 Consumo de API pública (ej: clima). 8.5 Resumen Mini proyectos prácticos9. Buenas prácticas
Trucos para escribir un código limpio: nombres de variables claros, comentarios útiles, depuración con la consola del navegador, y cómo evitar errores comunes.
Lecciones
9.1 Comentarios y legibilidad. 9.2 Debugging con consola. 9.3 Reutilización de código. 9.4 Resumen buenas prácticas10. Siguiente paso
Se abre la puerta a lo que viene después: novedades de ES6+, módulos (
import/export), y una visión general de librerías y frameworks modernos (React, Vue, Angular).