Proyectos paso a paso
Aprender a programar es construir cosas. Elige un proyecto, síguelo paso a paso con el código explicado y, en los proyectos web, cámbialo en el editor en vivo y mira el resultado al momento.
- 17 proyectos
- 8 lenguajes
- 85 pasos explicados
Lenguaje
Nivel 1 Básico
-
HTML y CSS 40 minutos · editor en vivo
Tarjeta de presentación
Tu primera página: una tarjeta con tu nombre, a qué te dedicas y tus enlaces, centrada, con modo oscuro automático y adaptada al móvil.
-
HTML y CSS 50 minutos · editor en vivo
Página de receta adaptable
Una receta que se lee bien en el móvil y en el ordenador: HTML semántico, una rejilla de dos columnas en pantallas anchas e ingredientes que se tachan al marcarlos.
-
JavaScript 1 hora · editor en vivo
Calculadora
Una calculadora que funciona con el ratón y con el teclado, sin usar eval: botones en rejilla, operaciones encadenadas y errores bien tratados.
-
Python 45 minutos
Adivina el número
El clásico juego de consola: el ordenador piensa un número y tú lo adivinas con pistas. Bucles, condiciones, errores de entrada, niveles y un récord que se guarda.
-
PowerShell 45 minutos
Copia de seguridad automática
Un script que comprime una carpeta en un ZIP con la fecha, guarda solo las últimas copias, apunta lo que hace en un registro y se puede programar para que se ejecute solo.
Nivel 2 Intermedio
-
JavaScript 1 hora y media · editor en vivo
Lista de tareas que se guarda
La aplicación clásica para aprender JavaScript de verdad: añadir, marcar, borrar y filtrar tareas, con los datos guardados en el navegador para que sigan ahí mañana.
-
JavaScript 1 hora · editor en vivo
Temporizador Pomodoro
Un temporizador de 25 minutos de concentración y 5 de descanso que no se desajusta, cambia de modo solo, cuenta tus pomodoros y avisa con un sonido generado en el navegador.
-
JavaScript 1 hora · editor en vivo
Generador de contraseñas seguras
Contraseñas aleatorias de verdad con el generador criptográfico del navegador: longitud y tipos de caracteres a elegir, un carácter de cada tipo garantizado, copiar con un clic y su fuerza en bits.
-
JavaScript 1 hora y cuarto · editor en vivo
Juego de preguntas
Un cuestionario con pantallas de inicio, partida y resultado: opciones que se colorean al responder, barra de progreso, preguntas mezcladas y 15 segundos para cada una.
-
Python 1 hora
Control de gastos con CSV
Un programa que lee tus gastos de una hoja de cálculo exportada en CSV y saca un informe por categorías y por mes, desde la terminal y con exportación a JSON.
-
SQL 1 hora
Base de datos de una biblioteca
Diseña las tablas de una biblioteca (autores, libros, socios y préstamos), relaciónalas con claves y responde con consultas qué libros están prestados, quién debe devolverlos y qué se lee más.
-
Bash y la terminal 1 hora
Organizador de descargas
Un script que ordena la carpeta de descargas en subcarpetas por tipo (imágenes, documentos, música…), con modo simulación para ver qué haría antes de mover nada.
-
Java 1 hora y media
Agenda de contactos
Un programa de consola con menú para añadir, listar y buscar contactos, que comprueba los datos y guarda la agenda en un archivo para la próxima vez.
-
C# 1 hora y cuarto
Inventario de una tienda
Un programa que lleva el inventario de una tienda: avisa de lo que hay que reponer, calcula el valor por categorías, registra ventas sin quedarse en negativo y guarda todo en JSON.
Nivel 3 Avanzado
-
JavaScript 2 horas · editor en vivo
Juego de la serpiente
El clásico de los móviles de antes, dibujado en un canvas: la serpiente avanza sola, crece al comer, choca contra los bordes y contra sí misma, guarda el récord y se juega con flechas o deslizando el dedo.
-
JavaScript 1 hora y media · editor en vivo
Galería de fotos
Una galería en rejilla con búsqueda que ignora las tildes, filtros por categoría combinables y un visor a pantalla completa que se recorre con las flechas.
-
Python 1 hora y media
Tareas en la terminal
Una herramienta de línea de comandos para gestionar tareas: órdenes como «añadir», «listar», «hecha» y «borrar», prioridades, fechas límite y los datos guardados en JSON.
Cómo funcionan los proyectos
- Cada paso explica qué se hace y por qué, con el código completo y lo nuevo resaltado.
- En los proyectos web, el editor en vivo ejecuta tu código aislado del resto de la página: puedes romperlo sin miedo.
- En el resto, verás lo que muestra el programa al ejecutarlo y cómo ponerlo en marcha en tu ordenador.
- Tu progreso se guarda solo en este navegador. Si te atascas, repasa las lecciones de Programación.