Contenidos del curso
Aquí tienes disponible nuestro Bootcamp de Desarrollo web 100% gratuito en formato de roadmap de curso. Más de 80 horas de contenido, desde lo más básico hasta cosas modernas y avanzadas. Probablemente, el bootcamp gratuito más completo que vas a encontrar, ideal para ENTENDER lo que estás haciendo. También tienes la web del Bootcamp o puedes verla desde Youtube si lo prefieres.
FASE 1: Fundamentos
En este primer bloque aprenderás las bases y fundamentos que debes saber para trabajar como developer. Desde nociones básicas y avanzadas de terminal, pasando por fundamentos de programación en Javascript y trabajar con herramientas de Inteligencia Artificial.
Día 1 📕 Terminal Linux
1. Presentación inicial6 min
2. Introducción al Bootcamp15 min
3. Inicio del Bootcamp14 min
4. Preparación de entorno y WSL29 min
5. Seguridad18 min
6. Personalizar la terminal (fish)11 min
7. Moverse por carpetas24 min
8. Ver, copiar y mover archivos25 min
9. Ver contenido de archivos8 min
10. Editores de terminal25 min
11. Visual Studio Code29 min
12. Scripts y alias18 min
13. Preguntas finales35 min
Día 2 📕 Fundamentos de programación Javascript
1. Presentación inicial9 min
2. Fundamentos de Javascript12 min
3. Tipo de código13 min
4. Variables y comentarios20 min
5. Tipos de datos primitivos27 min
6. Tipos de datos avanzados35 min
7. Condicionales24 min
8. Bucles15 min
9. Funciones34 min
10. Bases de las Clases32 min
11. Visibilidad y miembros de Clases24 min
12. Roadmap sugerido y preguntas22 min
Día 3 📕 Control de proyectos Javascript
1. Presentación inicial16 min
2. Instalación de PNPM y Node35 min
3. Rust / Go / Python (Opcional)14 min
4. Estructura de carpetas30 min
5. Servidores locales de desarrollo24 min
6. Trabajando con pnpm15 min
7. Dependencias + semver21 min
8. Automatizar scripts8 min
9. Mensaje para Youtube1 min
10. Linters y formateadores26 min
11. Git29 min
12. GitHub52 min
13. Cursor dancing1 min
14. Despliegue en GitHub Pages13 min
15. Preguntas finales23 min
Día 4 📕 Inteligencia Artificial
1. Presentación inicial11 min
2. Desmitificación "Voy a usar IA"12 min
3. Evolución IA para desarrollo18 min
4. Vibe Coding / Vibe Learning18 min
5. LLM (Loros estocásticos)27 min
6. Modelos LLM32 min
7. OpenCode1 hr 17 min
8. Dancing cursor3 min
9. Modelos locales7 min
10. Ollama (LLM locales)39 min
11. OpenCode con Ollama11 min
12. IA Generativa12 min
13. Instalación de ComfyUI9 min
14. ComfyUI42 min
15. Qwen3 Image Edit8 min
16. Preguntas21 min
FASE 2: Front-end
En esta fase nos centraremos en los pilares del front-end. Como estructurar bien una página con HTML y todo lo que tiene alrededor, como utilizar CSS correctamente, aprender mecanismos para crear layouts e interfaces de usuario y CSS moderno y avanzado.
Día 5 📙 HTML ¿Lenguaje de programación?
1. ¿Qué es HTML?8 min
2. Sintaxis de HTML7 min
3. Categorías de etiquetas29 min
4. Agrupación y texto13 min
5. Enlaces11 min
6. Multimedia (Imagen)32 min
7. Multimedia (Video/Audio)30 min
8. Bases de formularios33 min
9. ¿Qué es la semántica?7 min
10. Campos avanzados14 min
11. Semántica17 min
12. Custom Elements11 min
13. Markdown5 min
14. HTML-first y mejora progresiva25 min
15. Preguntas30 min
Día 6 📙 Bases de CSS
1. Introducción8 min
2. Introducción a CSS10 min
3. Cómo aprender CSS2 min
4. Overflow (desbordamiento)12 min
5. Cargar CSS2 min
6. Variables CSS10 min
7. Unidades CSS15 min
8. Modelo de cajas14 min
9. Bordes y esquinas23 min
10. Esquemas de colores14 min
11. Fondos e imágenes7 min
12. Gradientes31 min
13. Tipografías9 min
14. Cargar tipografías27 min
15. Selectores CSS20 min
16. Pseudoselectores CSS12 min
17. Combinadores lógicos CSS9 min
18. Preguntas18 min
Día 7 📙 Layouts de CSS
1. Charla inicial7 min
2. Display16 min
3. Flex24 min
4. Flex multilínea22 min
5. Grid28 min
6. Grid por áreas14 min
7. Grid irregulares9 min
8. Grid lanes11 min
9. Position28 min
10. Anchor position6 min
11. Animaciones34 min
12. Ritmos (Easing)18 min
13. Scroll-driven y View Transition10 min
14. Preguntas28 min
Día 8 📙 CSS Avanzado
1. Introducción11 min
2. Colores derivados11 min
3. Utilidades para imágenes13 min
4. Renderización de imágenes6 min
5. Filtros y modos de fusión27 min
6. Responsive: Media queries19 min
7. Responsive: Media features9 min
8. Responsive: Preferencias de usuario4 min
9. Responsive: Container queries9 min
10. ¿Qué es la cascada CSS?6 min
11. Cascada: Herencia10 min
12. Cascada: Estructura tradicional14 min
13. Cascada: Estructura moderna27 min
14. Cascada: Alcance (scope)18 min
15. Máscaras y recortes38 min
16. Lógica CSS31 min
17. Preguntas finales21 min
FASE 3: Javascript
Esta fase te va a ayudar a comprender como utilizar Javascript correctamente. Desde el uso del lenguaje, hasta comprender y estructurar el DOM, comunicarse mediante eventos y otros aspectos avanzados de Javascript del lado del cliente (navegador).
Día 9 📒 Javascript
1. Métodos básicos de String29 min
2. Manipulación de Strings45 min
3. Métodos de Math13 min
4. Métodos de Array6 min
5. Mutaciones11 min
6. Objetos + JSON19 min
7. Acertijo8 min
8. Desestructuración33 min
9. Ordenación y clonación27 min
10. Iteradores de objetos6 min
11. Introducción a Array functions18 min
12. Carácteres zero-width y preguntas34 min
Día 10 📒 DOM Moderno
1. Tour por el Bootcamp17 min
2. ¿Qué es el DOM?14 min
3. Buscar en el DOM25 min
4. Modificar contenido29 min
5. Atributos HTML24 min
6. Clases HTML16 min
7. Crear elementos14 min
8. APIs de inserción11 min
9. Etiqueta template21 min
10. APIs relacionadas50 min
11. Plantillas HTML40 min
Día 11 📒 Eventos JS
1. Eventos en Javascript52 min
2. Información de Eventos1 hr 7 min
3. Propagación de eventos46 min
4. APIs modernas28 min
5. Expresiones regulares43 min
Día 12 📒 Javascript Avanzado
1. Vite1 hr 1 min
2. LightningCSS y plugins52 min
3. Array functions33 min
4. Complejidad17 min
5. Iterator functions24 min
6. Código limpio28 min
7. Patrones de diseño36 min
FASE 4: Avanzado
En esta fase 4 vamos entrando en temas más avanzados y profesionales. Exploramos los módulos de Javascript y aprendemos a separar y organizar, crear webcomponents nativos y detalles de performance y rendimiento web, para evitar que nuestra web tenga un mal rendimiento.
Día 13 📘 Módulos Javascript
1. Historia de módulos en Javascript42 min
2. Módulos de Javascript (ESM)24 min
3. Rutas, CDN y Bare imports16 min
4. Imports Maps7 min
5. Barrels8 min
6. Import estáticos vs Import dinámicos26 min
7. Patrón nomodule + modos import10 min
8. Gestor de estados + Bus de Eventos8 min
9. Estructura de carpetas7 min
10. Ejercicio práctico52 min
Día 14 📘 Asincronía
1. Introducción4 min
2. Promesas13 min
3. Thennables12 min
4. Crear nuestras promesas20 min
5. Async/await26 min
6. Promesas en grupo17 min
7. Fetching y URL25 min
8. Fetch (Peticiones HTTP)22 min
9. Request / Response19 min
10. Ejercicio propuesto36 min
Día 15 📘 WebComponents
1. Introducción21 min
2. Custom Elements23 min
3. Custom Elements + Javascript43 min
4. HTML/DOM en WebComponents35 min
5. CSS + Shadow DOM39 min
6. Slots + Scoping/Parts32 min
7. Comunicar componentes19 min
Día 16 📘 Rendimiento web
1. ¿Qué es el rendimiento web?8 min
2. Chrome Dev Tools14 min
3. Reducir uso de memoria48 min
4. Reducir uso de tiempo49 min
5. Reducir uso de transferencia1 hr 7 min
6. Reducir uso de dependencias31 min
7. Reducir tamaño de recursos24 min
8. Testing y análisis36 min
FASE 5: Introducción back-end
Por último, para finalizar el Bootcamp, vamos a explorar algunos aspectos más relacionados con servidores y back-end. Desde el uso de NodeJS y Express, hasta un metaframework como Astro o utilizar un servidor VPS. Con esto cerramos este Bootcamp.