Initial commit: LangChain evolution tutorial deck (132 slides)

- Cover, TOC, 5 dividers, 3 recap slides - 5 sections (chains, langgraph, deepagents, openswe, ecosystem) - design-system.js with theme tokens + 9 helper functions - research/: timeline + sources + per-tech notes - final-compile.js + merge.js for rebuild pipeline - output/: langchain-evolution.pptx (2.3 MB) + langchain-evolution.pdf (1.1 MB) + 7 sample previews
2026-06-22 11:29:03 +03:00
parent ed5b5c91bf
commit 75601988c2
220 changed files with 13069 additions and 3 deletions
@@ -0,0 +1,152 @@
+// Slide 01: Section cover -- Stage 5 / Ecosystem (LangSmith + Studio + Platform)
+// Asymmetric layout: big section number + title block on left,
+// "ecosystem wheel" mock on right with the 3 satellite products.
+
+const ds = require('./design-system');
+
+function createSlide(pres, theme) {
+  const slide = pres.addSlide();
+  ds.helpers.slideBase(slide, pres, theme);
+
+  // Left vertical accent stripe -- gold for the ecosystem meta-section
+  slide.addShape(pres.ShapeType.rect, {
+    x: 0, y: 0, w: 0.25, h: 5.625,
+    fill: { color: theme.palette.accent.secondary },
+    line: { type: 'none' },
+  });
+
+  // Top tag pill: section meta
+  slide.addShape(pres.ShapeType.roundRect, {
+    x: 0.7, y: 0.55, w: 2.8, h: 0.36,
+    fill: { color: theme.palette.accent.secondary },
+    line: { type: 'none' },
+    rectRadius: 0.18,
+  });
+  slide.addText('STAGE 5  |  ECOSYSTEM', {
+    x: 0.7, y: 0.55, w: 2.8, h: 0.36,
+    fontFace: ds.helpers.withFallback(theme.fonts.ui),
+    fontSize: 10, bold: true,
+    color: theme.palette.bg.primary,
+    align: 'center', valign: 'middle',
+    charSpacing: 4, margin: 0,
+  });
+
+  // Main title
+  slide.addText('Экосистема', {
+    x: 0.7, y: 1.15, w: 5.9, h: 1.0,
+    fontFace: ds.helpers.withFallback(theme.fonts.ui),
+    fontSize: 56, bold: true,
+    color: theme.palette.text.primary,
+    align: 'left', valign: 'middle',
+    margin: 0,
+  });
+
+  // Subtitle
+  slide.addText('LangSmith, Studio, deployment', {
+    x: 0.7, y: 2.15, w: 9, h: 0.55,
+    fontFace: ds.helpers.withFallback(theme.fonts.ui),
+    fontSize: 26,
+    color: theme.palette.accent.tertiary,
+    align: 'left', valign: 'middle',
+    margin: 0,
+  });
+
+  // Description block
+  slide.addText(
+    'Сервисы вокруг 4 основных ступеней: observability и eval ' +
+    '(LangSmith SDK), визуальный дебаг графов (LangGraph Studio), ' +
+    'production deployment (LangGraph Platform), self-hosted и TypeScript-клиенты. ' +
+    'Все, что превращает прототип в production-grade систему.',
+    {
+      x: 0.7, y: 2.85, w: 5.7, h: 1.6,
+      fontFace: ds.helpers.withFallback(theme.fonts.ui),
+      fontSize: 13,
+      color: theme.palette.text.secondary,
+      align: 'left', valign: 'top',
+      margin: 0,
+    }
+  );
+
+  // Right-side ecosystem mock: LangSmith SDK in center, 3 satellite products
+  const codeX = 6.7;
+  const codeY = 1.55;
+  const codeW = 2.85;
+  const codeH = 3.05;
+
+  slide.addShape(pres.ShapeType.roundRect, {
+    x: codeX, y: codeY, w: codeW, h: codeH,
+    fill: { color: theme.palette.bg.elevated },
+    line: { color: theme.palette.border.subtle, width: 1 },
+    rectRadius: 0.1,
+  });
+
+  // Center node: LangSmith SDK
+  slide.addShape(pres.ShapeType.roundRect, {
+    x: codeX + 0.7, y: codeY + 1.15, w: codeW - 1.4, h: 0.75,
+    fill: { color: theme.palette.accent.primary },
+    line: { type: 'none' },
+    rectRadius: 0.08,
+  });
+  slide.addText('langsmith', {
+    x: codeX + 0.7, y: codeY + 1.15, w: codeW - 1.4, h: 0.45,
+    fontFace: ds.helpers.withFallback(theme.fonts.code),
+    fontSize: 16, bold: true,
+    color: theme.palette.bg.primary,
+    align: 'center', valign: 'middle',
+    margin: 0,
+  });
+  slide.addText('Python SDK 0.8.9', {
+    x: codeX + 0.7, y: codeY + 1.5, w: codeW - 1.4, h: 0.35,
+    fontFace: ds.helpers.withFallback(theme.fonts.ui),
+    fontSize: 10, italic: true,
+    color: theme.palette.bg.primary,
+    align: 'center', valign: 'middle',
+    margin: 0,
+  });
+
+  // Three satellite nodes
+  const satellites = [
+    { label: '@traceable',  color: theme.palette.accent.tertiary, y: codeY + 0.18 },
+    { label: 'Studio',      color: theme.palette.accent.tertiary, y: codeY + 2.05 },
+    { label: 'Platform',    color: theme.palette.accent.tertiary, y: codeY + 2.55 },
+  ];
+  satellites.forEach((s) => {
+    slide.addShape(pres.ShapeType.roundRect, {
+      x: codeX + 0.4, y: s.y, w: codeW - 0.8, h: 0.4,
+      fill: { color: theme.palette.bg.code },
+      line: { color: s.color, width: 1.25 },
+      rectRadius: 0.06,
+    });
+    slide.addText(s.label, {
+      x: codeX + 0.4, y: s.y, w: codeW - 0.8, h: 0.4,
+      fontFace: ds.helpers.withFallback(theme.fonts.code),
+      fontSize: 12, bold: true,
+      color: s.color,
+      align: 'center', valign: 'middle',
+      margin: 0,
+    });
+  });
+
+  // Caption under the mock
+  slide.addText('observability  |  visual debug  |  deploy', {
+    x: codeX, y: codeY + codeH + 0.05, w: codeW, h: 0.3,
+    fontFace: ds.helpers.withFallback(theme.fonts.ui),
+    fontSize: 11, italic: true,
+    color: theme.palette.text.muted,
+    align: 'center', valign: 'middle', margin: 0,
+  });
+
+  // Bottom meta strip
+  slide.addText('12 СЛАЙДОВ  |  PYTHON >= 3.9  |  LANGSMITH 0.8.x', {
+    x: 0.7, y: 5.05, w: 9, h: 0.3,
+    fontFace: ds.helpers.withFallback(theme.fonts.ui),
+    fontSize: 10,
+    color: theme.palette.text.muted,
+    align: 'left', valign: 'middle',
+    charSpacing: 3, margin: 0,
+  });
+
+  ds.helpers.addPageNumber(slide, pres, theme, 1);
+}
+
+module.exports = { createSlide };