Aquí tienes el DÍA 23, empezando con una introducción para este nuevo bloque, y luego toda la estructura detallada para que puedas subir de nivel.

---

📚 Curso JavaScript Mid Level — Introducción

¡Bienvenido a una nueva etapa en tu camino como desarrollador! 🚀
Tras haber dominado las bases en el nivel Junior, ahora damos un gran paso hacia adelante:
Aprenderás a gestionar la asincronía, trabajar con APIs reales, almacenar información localmente y modernizar tu código con técnicas de JavaScript ES6+.

A partir de aquí, no solo serás capaz de crear páginas dinámicas, sino que también podrás integrarlas con servidores, manejar grandes volúmenes de datos y desarrollar aplicaciones mucho más profesionales.

¡Es hora de subir de nivel y convertirte en un programador que puede trabajar en proyectos reales de principio a fin! 🔥

---

🔒 Día 23 — Programación asíncrona, Promesas, Async/Await, Fetch API

Objetivo:
Hoy descubrirás cómo manejar acciones asíncronas en JavaScript, desde los antiguos callbacks hasta las modernas promesas y async/await, y comenzarás a consumir datos de servidores externos usando Fetch API.

---

📚 Formación Teórica

1. ¿Qué es la programación asíncrona?

• La programación asíncrona permite que JavaScript no se bloquee mientras espera respuestas de procesos lentos (por ejemplo, cargar datos de una API).
• Con la asincronía, podemos seguir ejecutando el código mientras esperamos.

2. De Callbacks a Promesas

• Callback: función que se pasa como argumento a otra función y se ejecuta después.
• Problema: anidación excesiva (“callback hell”).
• Promesa: objeto que representa un valor que estará disponible en el futuro (resolve, reject).

3. Async / Await

• Sintaxis moderna y más limpia para trabajar con promesas.
• Permite escribir código asíncrono como si fuera síncrono, mejorando la legibilidad.

4. Fetch API

• Interfaz moderna para hacer solicitudes HTTP de manera fácil en JavaScript.

---

🎥 Vídeos de hoy

• ✅ Callbacks, Promesas, Async/Await en JavaScript (Desde 4:52:34 hasta 5:42:47)
• ✅ Introducción a Fetch y peticiones HTTP (Hasta 7:10:07)

Instrucciones para el vídeo:

• Comprende bien la evolución: callbacks → promesas → async/await.
• Observa cómo se usan fetch y async/await para consumir datos externos.

---

🧠 Apuntes Técnicos del Día

📌 Callbacks

function saludar(nombre, callback) {
  console.log("Hola, " + nombre);
  callback();
}

function despedirse() {
  console.log("Adiós!");
}

saludar("Jesús", despedirse);

• Llamada a una función después de terminar otra.

---

📌 Promesas

const promesa = new Promise((resolve, reject) => {
  let exito = true;
  if (exito) {
    resolve("Todo salió bien.");
  } else {
    reject("Algo salió mal.");
  }
});

promesa
  .then(response => console.log(response))
  .catch(error => console.error(error));

• then(): ejecuta si la promesa se resuelve.
• catch(): ejecuta si la promesa falla.

---

📌 Async / Await

async function obtenerDatos() {
  try {
    let respuesta = await fetch('https://jsonplaceholder.typicode.com/posts/1');
    let datos = await respuesta.json();
    console.log(datos);
  } catch (error) {
    console.error("Error al obtener datos:", error);
  }
}

obtenerDatos();

• async marca una función que usa await internamente.
• await espera que la promesa se resuelva antes de continuar.

---

📌 Fetch API

fetch('https://jsonplaceholder.typicode.com/posts')
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('Error:', error));

• Simplifica las peticiones HTTP en JavaScript moderno.

---

🛠️ Tareas prácticas del Día 23

Tarea 1 — Uso de promesas:

• Crea una promesa que resuelva si una variable es mayor a 10 y rechace si no.

Tarea 2 — Uso de Async/Await:

• Crea una función async que consulte datos de https://jsonplaceholder.typicode.com/users y muestre los nombres en consola.

Tarea 3 — Consumo de API con Fetch:

• Usa fetch para obtener una lista de posts y muestra en consola el título de cada uno.

Entrega:

• Crea un documento PDF donde adjuntes:
  • Código de las promesas, async/await y fetch.
  • Capturas de pantalla mostrando que las peticiones funcionan correctamente.

---

🚀 Resultado esperado al finalizar el día

• Dominar la asincronía moderna en JavaScript usando promesas y async/await.
• Realizar peticiones HTTP reales a servidores externos usando Fetch API.
• Comprender cómo capturar y manejar errores de forma segura.

---