OpenAI: Ejercicios prácticos y asistentes con React + NestJS
Imágenes, modelos, audio a texto, texto a audio, asistentes, transcripciones, traducciones, librería de OpenAI y más.
Lo que serás capaz de hacer
Bienvenidos a nuestro curso práctico de OpenAI + Nest + React Este es un curso en el cual aprenderemos de forma práctica, a utilizar la librería de OpenAI con Node y React , donde nuestro backend será quien hable con OpenAI y el backend hecho en NestJS será quien haga las respuestas y los flujos (streams) de información hacia el cliente que estará hecho en React con Vite y Tailwind. Puntualmente usaremos la librería de OpenAI para: Generar audios basados en textos Generar textos basados en audio Subtítulos Transcripciones Traducciones a diferentes idiomas Carga de archivos al backend para enviarlos a OpenAI Generación de imágenes Variaciones Imágenes nuevas Crear máscara para editar porciones de las mismas mediante AI Generar consultas sobre cualquier tema Asistentes de personalizados Entrenar asistente con material personalizado Darle personalidad Instruirlo Consumir su api Assistant API Creación de " threads " Creación de mensajes Creación de " run " Ejecución y espera de los " run " Mensajes de respuesta Creación y consumo de un API personalizado para los asistentes en NestJS Este curso está pensado para realizar una integración de React con Vite, hacia un backend en Node/Nest, todo el código escrito está en TypeScript. Por favor, tengan presente que no es un curso para aprender Node, React, Nest o Tailwind, pero se lleva suave esos temas para que todos lo puedan seguir, pero el conocimiento de esas tecnologías harán más fácil aprender todo, ya que me quiero enfocar en el consumo de la librería. Nota de actualización - 12 de agosto de 2025: Debido a cambios recientes en las políticas de OpenAI, posteriores a la grabación de las clases de este curso, es importante que tengan en cuenta lo siguiente: Para poder trabajar con su API, ahora es necesario que tu cuenta tenga un consumo mínimo equivalente a 5 USD. El crédito gratuito que antes se otorgaba a nuevos usuarios fue discontinuado desde el año 2024. Alternativas disponibles: • Gemini flash: es gratis y fácil de configurar. • Modelos locales: instalados directamente en el equipo, pero solo lo recomendamos para usuarios avanzados. Les mantendremos informados en caso de que esta situación cambie nuevamente. Cualquier duda al respecto, les invitamos a dejarla en el panel de consultas para que podamos asistirles con este cambio.
- Usar la librería de OpenAI para Node/TS
- Generar imágenes
- Editar y cortar partes de imágenes para regenerarlas
- Traducciones de textos a idiomas
- Consultas a OpenAI y diferentes modelos
- Texto a audio / Audio a texto
Temario
UNIDAD 1 - Introducción · 5 leccionesUNIDAD 1 - Introducción
UNIDAD 1 - Introducción
- Introducción al curso
- ¿Cómo funcionará el curso?
- ¿Cómo hacer preguntas?
- Instalaciones recomendadas
- Nota de actualización
UNIDAD 2 - Frontend - Diseño y creación de la aplicación · 14 leccionesUNIDAD 2 - Frontend - Diseño y creación de la aplicación
UNIDAD 2 - Frontend - Diseño y creación de la aplicación
- Introducción a la sección
- Temas puntuales de la sección
- Inicio de proyecto - ReactGPT
- Configurar TailwindCSS en React
- Rutas y páginas
- DashboardLayout - Diseño
- Resolución de la tarea
- Diseño de la pantalla del chat
- Indicador de escritura
- Caja de envío de mensajes
- Funcionalidad de mensajes
- Mensajes con archivos
- Mensajes con selectores
- Código fuente de la sección
UNIDAD 3 - Backend - Caso de uso - Ortografía · 12 leccionesUNIDAD 3 - Backend - Caso de uso - Ortografía
UNIDAD 3 - Backend - Caso de uso - Ortografía
- Introducción a la sección
- Temas puntuales de la sección
- Inicio de proyecto - NestGPT
- Rutas y CORS
- Validaciones de la petición
- Pasar argumentos del DTO al UseCase
- OpenAI - Configuración de cuenta y token
- Nuestro primer prompt
- Corrector de ortografía - Use Case
- Retornar un JSON con la información
- Postman - Guardar endpoints
- Código fuente de la sección
UNIDAD 4 - Frontend - Ortografía · 6 leccionesUNIDAD 4 - Frontend - Ortografía
UNIDAD 4 - Frontend - Ortografía
- Introducción a la sección
- Temas puntuales de la sección
- Continuación de proyecto
- Orthography Use Case
- Mostrar la respuesta en pantalla
- Código fuente de la sección
UNIDAD 5 - Backend - ProsCons Discusser - Streams · 7 leccionesUNIDAD 5 - Backend - ProsCons Discusser - Streams
UNIDAD 5 - Backend - ProsCons Discusser - Streams
- Introducción a la sección
- Temas puntuales de la sección
- Continuación de la aplicación
- Tarea - ProsCons - Controller, Service y UseCase
- Solución de la tarea
- ProsCons como Stream
- Código fuente de la sección
UNIDAD 6 - Frontend - ProsCons Discusser - Streams · 10 leccionesUNIDAD 6 - Frontend - ProsCons Discusser - Streams
UNIDAD 6 - Frontend - ProsCons Discusser - Streams
- Introducción a la sección
- Temas puntuales de la sección
- Continuación de la sección
- Tarea - ProsCons Discusser
- Solución de la tarea
- Leer respuesta de un stream
- Mostrar respuesta conforme es generada
- Stream con función generadora
- AbortSignals - Cancelar el stream
- Código fuente de la sección
UNIDAD 7 - Backend - Traducciones · 6 leccionesUNIDAD 7 - Backend - Traducciones
UNIDAD 7 - Backend - Traducciones
- Introducción a la sección
- Temas puntuales de la sección
- Continuación del backend - Traducciones
- Tarea - Construcción del endpoint
- Solución de la tarea - Traducciones
- Código fuente de la sección
UNIDAD 8 - Frontend - Traducciones · 6 leccionesUNIDAD 8 - Frontend - Traducciones
UNIDAD 8 - Frontend - Traducciones
- Introducción a la sección
- Temas puntuales de la sección
- Continuación de la sección
- Creación del UI necesario
- Caso de uso de traducción
- Código fuente de la sección
UNIDAD 9 - Backend - Texto a audio · 8 leccionesUNIDAD 9 - Backend - Texto a audio
UNIDAD 9 - Backend - Texto a audio
- Introducción a la sección
- Temas puntuales de la sección
- Continuación de la sección - Texto a audio
- Texto a audio - Preparación
- Generación del audio
- Enviar MP3 como respuesta
- Regresar audios previamente generados
- Código fuente de la sección
UNIDAD 10 - Frontend - Texto a audio · 6 leccionesUNIDAD 10 - Frontend - Texto a audio
UNIDAD 10 - Frontend - Texto a audio
- Introducción a la sección
- Temas puntuales de la sección
- Continuación de aplicación - Texto a Audio
- Preparar la pantalla de texto a audio
- Obtener audio y reproducirlo
- Código fuente de la sección
UNIDAD 11 - Backend - Audio a texto · 7 leccionesUNIDAD 11 - Backend - Audio a texto
UNIDAD 11 - Backend - Audio a texto
- Introducción a la sección
- Temas puntuales de la sección
- Continuación de la sección - Audio a texto
- Cargar archivos de audio
- Generar transcripciones y subtítulos
- Enviar instrucciones mediante el prompt
- Código fuente de la sección
UNIDAD 12 - Frontend - Audio a texto · 7 leccionesUNIDAD 12 - Frontend - Audio a texto
UNIDAD 12 - Frontend - Audio a texto
- Introducción a la sección
- Temas puntuales de la sección
- Continuación de la aplicación - Audio a texto
- Selección de archivo y envío al caso de uso
- Implementación del caso de uso
- Mostrar respuesta en pantalla
- Código fuente de la sección
UNIDAD 13 - Backend - Generación de imágenes · 15 leccionesUNIDAD 13 - Backend - Generación de imágenes
UNIDAD 13 - Backend - Generación de imágenes
- Introducción a la sección
- Temas puntuales de la sección
- Continuación de aplicación - Generación de imágenes
- Preparación de Endpoint, DTO y Servicio
- Obtener la imagen basado en el prompt
- Guardar las imágenes en FileSystem
- GET - Retornar imagen previamente generada
- Convertir imagen a PNG
- Editar imágenes
- Retornar el URL de nuestro servidor
- Generar variación de imagen - Endpoint
- Implementar la variación de la imagen
- Aumentar el tamaño de la petición POST
- Corrección con el URL
- Código fuente de la sección
UNIDAD 14 - Frontend - Generación y edición de imágenes · 12 leccionesUNIDAD 14 - Frontend - Generación y edición de imágenes
UNIDAD 14 - Frontend - Generación y edición de imágenes
- Introducción a la sección
- Temas puntuales de la sección
- Continuación de la aplicación - Generación de imágenes
- Caso de uso - Generación de Imagen
- Mostrar imagen en pantalla
- Generación de variaciones
- Seleccionar imágenes para variaciones
- Preparar el espacio para editar imágenes
- Convertir imagen a un canvas
- Dibujar, borrar y obtener la nueva imagen
- Editar la imagen
- Código fuente de la sección
UNIDAD 15 - Backend - Asistentes de OpenAI · 13 leccionesUNIDAD 15 - Backend - Asistentes de OpenAI
UNIDAD 15 - Backend - Asistentes de OpenAI
- Introducción a la sección
- Temas puntuales de la sección
- Introducción a los asistentes de OpenAI
- Continuación de la aplicación - Asistentes
- Creación de asistente - Desde OpenAI
- Probar asistente
- Crear módulo - Assistant
- Crear Thread - Caso de Uso
- Crear Mensaje - Caso de Uso
- Crear Run (ejecución) - Caso de uso
- Run Complete Status - Caso de Uso
- Lista de mensajes - Caso de uso
- Código fuente de la sección
UNIDAD 16 - Frontend - Asistentes · 8 leccionesUNIDAD 16 - Frontend - Asistentes
UNIDAD 16 - Frontend - Asistentes
- Introducción a la sección
- Temas puntuales de la sección
- Continuación de la sección
- Creación del Thread
- Realizar pregunta - Caso de Uso
- Mostrar los mensajes en el chat
- Más información a leer
- Código fuente de la sección
UNIDAD 17 - Tareas adicionales · 3 leccionesUNIDAD 17 - Tareas adicionales
UNIDAD 17 - Tareas adicionales
- Introducción a la sección
- Imagen a texto
- Código fuente
UNIDAD 18 - Fin del curso · 1 leccionesUNIDAD 18 - Fin del curso
UNIDAD 18 - Fin del curso
- Despedida del curso
Tu certificado lo emite la SEP, no solo una plataforma
Al demostrar la competencia recibes un certificado emitido por la Secretaría de Educación Pública a través del Gobierno del Estado de México: un documento oficial que puedes presentar con confianza ante cualquier empleador o institución.
Tu certificado con INEC
- Lo emite la Secretaría de Educación Pública (SEP), a través del Gobierno del Estado de México
- Documento oficial con folio verificable en línea
- Lo otorga la Universidad Tecnológica Fidel Velázquez
Otras plataformas en línea
- Constancia privada emitida por la misma plataforma
- Solo acredita horas cursadas o asistencia
- Sin respaldo de una autoridad educativa
Tu itinerario, de la inscripción al certificado
- 1
Inscripción con pago único
Pagas $2,800 MXN una sola vez y entras de inmediato al curso.
- 2
Estudias a tu ritmo
18 unidades con videos, lecturas y actividades, disponibles 24/7 durante 12 meses.
- 3
Cuestionarios por unidad
Cuestionarios para comprobar lo aprendido.
- 4
Certificado
Emitido por la SEP a través del Gobierno del Estado de México, con folio verificable.
Un certificado oficial de la SEP
Muestra · verificable por folio y QR
- Emitido por la Secretaría de Educación Pública (SEP), a través del Gobierno del Estado de México. No es una constancia privada: es un documento oficial, y ese respaldo marca la diferencia frente a otras plataformas en línea.
- Contenido impartido por Fernando Herrera.
- Folio y QR verificables para compartirlo con quien te contrate.
Empieza hoy, a tu ritmo
Un solo pago y acceso inmediato al curso completo durante 12 meses.
- 18 unidades · 146 lecciones · 60 h
- 12 meses de acceso
- Certificado emitido por la SEP (Gob. del Estado de México) con folio verificable
Sobre tu inscripción
¿Cómo es el pago?
Un solo pago de $2,800 MXN. No hay mensualidades ni cargos recurrentes.
¿Cuánto tiempo tengo acceso?
12 meses desde tu inscripción, 24/7, para avanzar a tu ritmo.
¿Quién imparte el contenido?
El curso es impartido por Fernando Herrera; INEC gestiona tu inscripción, evaluación y certificado.
¿Qué pasa cuando vence mi acceso?
Puedes renovar tu cuenta tú mismo desde la plataforma, sin trámites ni esperas.
