Bienvenido. Antes de tocar HTML o JavaScript, dedica dos minutos a entender cómo está montado este curso. Saber usar bien las herramientas que tienes delante te va a ahorrar mucho tiempo.
La idea es sencilla: tener todo en un sitio, en castellano, y avanzar de forma progresiva (cada capítulo asume lo del anterior) con ejemplos reales de empresa, no ejercicios abstractos de juguete. El objetivo no es que leas mucho, sino que sepas hacer.
La estructura de un capítulo#
Casi todos los capítulos siguen el mismo patrón, de arriba abajo:
- Teoría con ejemplos reales. Se explica el concepto y se ve aplicado a un caso que podrías encontrar en un trabajo de verdad.
- Playground: un editor de código aquí mismo, en la página, para experimentar sin instalar nada. Tocas, ejecutas y ves el resultado al instante.
- Quiz: unas pocas preguntas para fijar la teoría. Te da feedback inmediato y te explica por qué cada respuesta es la correcta.
- Ejercicio en local: el de verdad. Se hace en tu ordenador, con tu editor, porque ahí es donde se aprende.
- Soluciones comentadas: para comparar cuando termines (o si te atascas).
El playground: pruébalo ahora#
Cada vez que veas un bloque como este, es tuyo para trastear. Edita el código y, al
pulsar Ejecutar (o Ctrl+Enter), mira cómo cambia la consola.
OK, mejor, excelente: el corazón del curso#
Cada ejercicio se puede resolver con distintos niveles de calidad, y aquí no nos conformamos con que “funcione”:
- OK — funciona y da el resultado correcto. Es el primer objetivo, siempre.
- Mejor — además está limpio, se lee bien y cuida los casos raros (una lista vacía, un dato que falta).
- Excelente — encima es eficiente y fácil de mantener cuando el proyecto crece.
Las soluciones de cada ejercicio traen las tres versiones, con comentarios que explican por qué una mejora a la anterior. Esa explicación es lo más valioso del curso: es la diferencia entre escribir código y escribir buen código. No te saltes ese salto.
Cómo hacer los ejercicios en local#
Los ejercicios no se hacen aquí, sino en tu máquina (aprenderás a montar el entorno en los primeros capítulos). En general:
- Clonas el repositorio del curso una vez.
- Entras en la carpeta del ejercicio.
- Abres su
index.htmlen el navegador y escribes tu solución ensolucion.js. - Cuando funcione, intentas subir de “OK” a “mejor” y a “excelente”. Luego comparas con las soluciones.
Detalles que te hacen la vida más fácil#
- Tu progreso se guarda solo, en tu navegador (sin cuentas ni servidores).
- Arriba a la derecha puedes cambiar entre tema claro y oscuro cuando quieras.
- En cada capítulo puedes ocultar el índice lateral para que el contenido ocupe más pantalla.
- Un hilo conductor recorre el curso: irás construyendo una misma app de ejemplo (un Overwatch Team Builder) a medida que aprendes, para ver cómo encajan las piezas.
Comprueba que lo has pillado#
Así funciona un quiz. Responde y te explico cada respuesta:
Pregunta 1 de 3