initial commit: slides + practica_resueltos + README
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,15 @@
|
||||
---
|
||||
layout: cover
|
||||
class: text-center
|
||||
---
|
||||
|
||||
# ¿Qué es LangChain?
|
||||
|
||||
Framework para desarrollar aplicaciones con Modelos de Lenguaje (LLMs)
|
||||
|
||||
<div class="pt-12">
|
||||
<span class="px-2 py-1 rounded cursor-pointer opacity-80">
|
||||
Conectando LLMs con el mundo real
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,33 @@
|
||||
---
|
||||
layout: default
|
||||
---
|
||||
|
||||
# Historia de LangChain
|
||||
|
||||
<div class="text-sm">
|
||||
|
||||
<v-clicks>
|
||||
|
||||
<div class="mb-3">
|
||||
<p><strong>Octubre 2022</strong>: Nace LangChain en <strong>Python</strong> 🐍</p>
|
||||
<p class="text-xs opacity-80 ml-4">Creado por Harrison Chase • Enfoque inicial: encadenar prompts y LLMs</p>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<p><strong>Diciembre 2022</strong>: Lanzamiento de <strong>LangChain.js</strong> ⚡</p>
|
||||
<p class="text-xs opacity-80 ml-4">Apenas 2 meses después • Port oficial • Para desarrolladores web</p>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<p><strong>2023</strong>: Explosión de adopción en ambos ecosistemas</p>
|
||||
<p class="text-xs opacity-80 ml-4">Múltiples proveedores de LLMs • 110K+ stars en GitHub</p>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<p><strong>2024-2025</strong>: Maduración hacia producción</p>
|
||||
<p class="text-xs opacity-80 ml-4"><strong>LangGraph</strong>: Control de bajo nivel • <strong>LangSmith</strong>: Observabilidad y testing</p>
|
||||
</div>
|
||||
|
||||
</v-clicks>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,34 @@
|
||||
---
|
||||
layout: center
|
||||
class: text-center
|
||||
---
|
||||
|
||||
# Filosofía de LangChain
|
||||
|
||||
<div class="grid grid-cols-2 gap-4 mt-8">
|
||||
|
||||
<div v-click class="border border-main rounded p-4">
|
||||
<div class="text-2xl mb-2">🔌</div>
|
||||
<div class="font-bold">Flexibilidad</div>
|
||||
<div class="text-sm opacity-80">Sin vendor lock-in</div>
|
||||
</div>
|
||||
|
||||
<div v-click class="border border-main rounded p-4">
|
||||
<div class="text-2xl mb-2">🔗</div>
|
||||
<div class="font-bold">Integración</div>
|
||||
<div class="text-sm opacity-80">LLMs + Datos externos</div>
|
||||
</div>
|
||||
|
||||
<div v-click class="border border-main rounded p-4">
|
||||
<div class="text-2xl mb-2">🤖</div>
|
||||
<div class="font-bold">Agentes</div>
|
||||
<div class="text-sm opacity-80">Decisiones autónomas</div>
|
||||
</div>
|
||||
|
||||
<div v-click class="border border-main rounded p-4">
|
||||
<div class="text-2xl mb-2">🏗️</div>
|
||||
<div class="font-bold">Producción</div>
|
||||
<div class="text-sm opacity-80">Del prototipo a la realidad</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,33 @@
|
||||
---
|
||||
layout: default
|
||||
---
|
||||
|
||||
# Principios Fundamentales
|
||||
|
||||
<div class="grid grid-cols-1 gap-6 mt-8">
|
||||
|
||||
<div class="border-l-4 border-blue-500 pl-4">
|
||||
<h3 class="text-xl font-bold">1. Flexibilidad de Modelos</h3>
|
||||
<p class="opacity-80">
|
||||
Estandarización de inputs/outputs entre proveedores de LLMs.
|
||||
Cambia fácilmente entre OpenAI, Anthropic, Google, etc.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="border-l-4 border-green-500 pl-4">
|
||||
<h3 class="text-xl font-bold">2. Orquestación Compleja</h3>
|
||||
<p class="opacity-80">
|
||||
Los modelos coordinan flujos de trabajo con datos externos y herramientas.
|
||||
Más allá de la simple generación de texto.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="border-l-4 border-purple-500 pl-4">
|
||||
<h3 class="text-xl font-bold">3. Fiabilidad en Producción</h3>
|
||||
<p class="opacity-80">
|
||||
Observabilidad, testing y debugging para aplicaciones reales.
|
||||
El prototipo es fácil, producción es el reto.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,38 @@
|
||||
---
|
||||
layout: default
|
||||
---
|
||||
|
||||
# Creencias Fundamentales
|
||||
|
||||
<div class="text-sm">
|
||||
|
||||
<v-clicks>
|
||||
|
||||
<div class="mb-4">
|
||||
<h3 class="text-lg">🚀 Los LLMs son tecnología poderosa</h3>
|
||||
<p class="opacity-80">Una innovación que vale la pena construir sobre ella</p>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<h3 class="text-lg">🔗 Los LLMs son mejores con datos externos</h3>
|
||||
<p class="opacity-80">Combinar LLMs con fuentes de datos externas potencia sus capacidades</p>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<h3 class="text-lg">🤖 El futuro es agéntico</h3>
|
||||
<p class="opacity-80">Las aplicaciones exhibirán capacidades autónomas y de toma de decisiones</p>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<h3 class="text-lg">🌱 Estamos en una etapa temprana</h3>
|
||||
<p class="opacity-80">El campo está en constante evolución con espacio sustancial para crecer</p>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<h3 class="text-lg">💪 Producción es difícil</h3>
|
||||
<p class="opacity-80">Prototipar es fácil, lograr fiabilidad en producción es el verdadero desafío</p>
|
||||
</div>
|
||||
|
||||
</v-clicks>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,31 @@
|
||||
---
|
||||
layout: center
|
||||
class: text-center
|
||||
---
|
||||
|
||||
# Ecosistema LangChain
|
||||
|
||||
<div class="grid grid-cols-3 gap-8 mt-12">
|
||||
|
||||
<div v-click>
|
||||
<div class="text-4xl mb-4">⛓️</div>
|
||||
<div class="font-bold text-xl">LangChain (v1)</div>
|
||||
<div class="text-sm opacity-70 mt-2">Interfaz productiva para agentes</div>
|
||||
<div class="text-sm opacity-70">createAgent + Middleware</div>
|
||||
</div>
|
||||
|
||||
<div v-click>
|
||||
<div class="text-4xl mb-4">🕸️</div>
|
||||
<div class="font-bold text-xl">LangGraph</div>
|
||||
<div class="text-sm opacity-70 mt-2">Motor de runtime confiable</div>
|
||||
<div class="text-sm opacity-70">Persistencia, streaming, control granular</div>
|
||||
</div>
|
||||
|
||||
<div v-click>
|
||||
<div class="text-4xl mb-4">🔍</div>
|
||||
<div class="font-bold text-xl">LangSmith</div>
|
||||
<div class="text-sm opacity-70 mt-2">Observabilidad + Evaluación</div>
|
||||
<div class="text-sm opacity-70">Tracing automático, debugging visual</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,42 @@
|
||||
---
|
||||
layout: default
|
||||
---
|
||||
|
||||
# ¿Quién usa LangChain?
|
||||
|
||||
<div class="grid grid-cols-2 gap-6 mt-6">
|
||||
|
||||
<div>
|
||||
|
||||
## 🏢 Empresas en Producción
|
||||
|
||||
- **LinkedIn** - Agentes con LangGraph
|
||||
- **Uber** - Sistemas agénticos
|
||||
- **Replit** - Asistentes de código
|
||||
- **Klarna** - Chatbots de atención
|
||||
- **Snowflake** - Integración de datos
|
||||
- **J.P. Morgan** - Aplicaciones financieras
|
||||
- **BCG** - Consultoría con IA
|
||||
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
## 📊 Números de Adopción
|
||||
|
||||
- **1,306** empresas verificadas
|
||||
- **132K+** aplicaciones LLM construidas
|
||||
- **130M+** descargas totales
|
||||
- **51%** usando agentes en producción
|
||||
- **78%** planean usar agentes pronto
|
||||
|
||||
### 💼 Casos de Uso Comunes
|
||||
|
||||
- Chat sobre documentos
|
||||
- Atención al cliente
|
||||
- Asistentes personalizados
|
||||
- Análisis de datos
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,52 @@
|
||||
---
|
||||
layout: default
|
||||
---
|
||||
|
||||
# Modelo de Negocio de LangChain
|
||||
|
||||
<div class="grid grid-cols-2 gap-6 mt-4 text-sm">
|
||||
|
||||
<div>
|
||||
|
||||
## 🏢 La Empresa
|
||||
|
||||
|
||||
- **Fundadores**: Harrison Chase y Ankush Gola
|
||||
- **Fundación**: Octubre 2022
|
||||
- **Sede**: San Francisco, CA
|
||||
- **CEO**: Harrison Chase
|
||||
- **Equipo**: ~136 empleados (2025)
|
||||
|
||||
### 💰 Financiación
|
||||
|
||||
- **$260M** levantados en total
|
||||
- **$1.25B** de valoración (Oct 2025)
|
||||
- **Inversores**: Sequoia, Benchmark, IVP, CapitalG
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
## 💼 Modelo de Negocio
|
||||
|
||||
|
||||
**Freemium B2B**
|
||||
- Framework open-source (gratis)
|
||||
- Monetización vía LangSmith
|
||||
|
||||
**Revenue 2025**: $16M ARR
|
||||
- Crecimiento: $8.5M → $16M en 1 año
|
||||
- **1,000+** clientes empresariales
|
||||
|
||||
|
||||
### 💎 LangSmith Pricing
|
||||
|
||||
- **Developer**: Gratis (5k traces/mes)
|
||||
- **Plus**: $39/usuario/mes (10k traces)
|
||||
- **Enterprise**: Personalizado + self-hosted
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,27 @@
|
||||
---
|
||||
layout: two-cols
|
||||
---
|
||||
|
||||
# LangChain.js
|
||||
|
||||
La implementación JavaScript/TypeScript del framework LangChain
|
||||
|
||||
::right::
|
||||
|
||||
<v-clicks>
|
||||
|
||||
## ¿Por qué LangChain.js?
|
||||
|
||||
- **Desarrollo web nativo**
|
||||
- Frontend y backend con la misma tecnología
|
||||
|
||||
- **Ecosistema JavaScript**
|
||||
- NPM, TypeScript, Node.js
|
||||
|
||||
- **Paridad con Python**
|
||||
- Mismos conceptos y APIs
|
||||
|
||||
- **Comunidad activa**
|
||||
- Mantenido oficialmente
|
||||
|
||||
</v-clicks>
|
||||
@@ -0,0 +1,54 @@
|
||||
---
|
||||
layout: default
|
||||
---
|
||||
|
||||
# LangChain.js: Entornos de Ejecución
|
||||
|
||||
<div class="grid grid-cols-2 gap-6 mt-6">
|
||||
|
||||
<div>
|
||||
|
||||
## 🖥️ Runtimes Soportados
|
||||
|
||||
<v-clicks>
|
||||
|
||||
- **Node.js** (20.x, 22.x, 24.x)
|
||||
- ESM y CommonJS
|
||||
|
||||
- **Deno** - Runtime seguro
|
||||
|
||||
- **Bun** - Runtime ultra-rápido
|
||||
|
||||
- **Navegadores** - Client-side
|
||||
|
||||
</v-clicks>
|
||||
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
## ☁️ Edge & Serverless
|
||||
|
||||
<v-clicks>
|
||||
|
||||
- **Cloudflare Workers**
|
||||
|
||||
- **Vercel Edge Functions**
|
||||
|
||||
- **Next.js** (Server, Edge, Browser)
|
||||
|
||||
- **Supabase Edge Functions**
|
||||
|
||||
</v-clicks>
|
||||
|
||||
<v-click>
|
||||
|
||||
### 💪 Ventaja Clave
|
||||
|
||||
**Una sola codebase** para frontend, backend, edge y serverless
|
||||
|
||||
</v-click>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,59 @@
|
||||
---
|
||||
layout: default
|
||||
---
|
||||
|
||||
# Arquitectura de Componentes
|
||||
|
||||
<p class="text-sm opacity-80 -mt-2">Los componentes trabajan juntos para crear aplicaciones AI sofisticadas</p>
|
||||
|
||||
<div class="mt-4">
|
||||
|
||||
## 🧩 Seis Categorías Principales
|
||||
|
||||
<div class="grid grid-cols-3 gap-3 mt-4 text-sm">
|
||||
|
||||
<v-click>
|
||||
<div class="border-l-4 border-blue-500 pl-3 py-1">
|
||||
<h3 class="font-bold text-base">📝 Models</h3>
|
||||
<p class="text-xs opacity-80">Chat, LLMs, embeddings</p>
|
||||
</div>
|
||||
</v-click>
|
||||
|
||||
<v-click>
|
||||
<div class="border-l-4 border-green-500 pl-3 py-1">
|
||||
<h3 class="font-bold text-base">🔧 Tools</h3>
|
||||
<p class="text-xs opacity-80">APIs, búsquedas, DBs</p>
|
||||
</div>
|
||||
</v-click>
|
||||
|
||||
<v-click>
|
||||
<div class="border-l-4 border-purple-500 pl-3 py-1">
|
||||
<h3 class="font-bold text-base">🤖 Agents</h3>
|
||||
<p class="text-xs opacity-80">Orquestación y razonamiento</p>
|
||||
</div>
|
||||
</v-click>
|
||||
|
||||
<v-click>
|
||||
<div class="border-l-4 border-yellow-500 pl-3 py-1">
|
||||
<h3 class="font-bold text-base">💾 Memory</h3>
|
||||
<p class="text-xs opacity-80">Historia y estado</p>
|
||||
</div>
|
||||
</v-click>
|
||||
|
||||
<v-click>
|
||||
<div class="border-l-4 border-red-500 pl-3 py-1">
|
||||
<h3 class="font-bold text-base">🔍 Retrievers</h3>
|
||||
<p class="text-xs opacity-80">Búsqueda vectorial y web</p>
|
||||
</div>
|
||||
</v-click>
|
||||
|
||||
<v-click>
|
||||
<div class="border-l-4 border-orange-500 pl-3 py-1">
|
||||
<h3 class="font-bold text-base">📄 Documents</h3>
|
||||
<p class="text-xs opacity-80">Loaders, splitters</p>
|
||||
</div>
|
||||
</v-click>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
Reference in New Issue
Block a user