展示HN：可以编辑和运行代码的Node.js视频教程
嗨，HN，
我是 Sindre，Scrimba 的首席技术官（YC S20）。我们最初推出 Scrimba 是为了让视频学习对有志于成为前端开发者的人更加互动。因此，您可以直接在视频播放器中跳入并实验代码，而不是被动观看视频。自推出以来，已有近两百万人使用 Scrimba 来提升他们的技能。
然而，一个限制是我们只支持前端代码，因为我们的互动视频在浏览器中运行，而大多数学习者希望能够全栈开发——构建 API、处理身份验证、使用数据库等等。
为了解决这个问题，我们花了六个月的时间将 StackBlitz WebContainers 集成到 Scrimba 中。这使得我们的视频播放器中可以直接运行完整的 Node.js 环境——包括终端、shell、npm 访问和虚拟文件系统——一切都在浏览器中运行。
这里有一个两分钟的录制演示： [https://scrimba.com/s08dpq3nom](https://scrimba.com/s08dpq3nom)
如果您想了解更多，可以随时注册我们迄今为止推出的七门全栈课程，内容涵盖 Node、Next、Express、SQL、Vite 等等。我们今天为 Hacker News 开放了这些课程，您甚至不需要创建账户就可以观看内容：
[https://scrimba.com/fullstack](https://scrimba.com/fullstack)
*关于我们的“IDE 视频”的其他显著亮点：*
- 基于事件（代码编辑、光标移动等）而非像素
- 大约比传统视频小 100 倍
- 录制简单：在编码时只需说话
- 可以嵌入到博客、文档或课程中，就像 MDN 在这里所做的那样：[https://developer.mozilla.org/en-US/curriculum/core/css-fundamentals/](https://developer.mozilla.org/en-US/curriculum/core/css-fundamentals/)
- 完全使用我自己创建的语言 Imba 构建：[https://news.ycombinator.com/item?id=28207662](https://news.ycombinator.com/item?id=28207662)
我们认为这种格式对开源维护者和专注于 API 的团队创建互动文档或演练非常有用。我们的课程视频已经被 MDN、LangChain 和 Coursera 嵌入。
如果您维护一个库或 SDK，并希望制作一个互动视频，请告诉我们——我们乐意免费为您录制一个，您可以随意使用。
期待回答任何问题或听取大家的反馈！
查看原文
Hey HN,<p>I'm Sindre, CTO of Scrimba (YC S20). We originally launched Scrimba to make video learning more interactive for aspiring frontend developers. So instead of passively watching videos, you can jump in an experiment with the code directly inside the video player. Since launch, almost two million people have used Scrimba to grow their skills.<p>However, one limitation is that we've only supported frontend code, as our interactive videos run in the browser, whereas most of our learners want to go fullstack—building APIs, handling auth, working with databases, and so forth.<p>To fix this, we spent the last 6 months integrating StackBlitz WebContainers into Scrimba. This enables a full Node.js environment—including a terminal, shell, npm access, and a virtual file system—directly inside our video player. Everything runs in the browser.<p>Here is a 2-minute recorded demo: <a href="https://scrimba.com/s08dpq3nom">https://scrimba.com/s08dpq3nom</a><p>If you want to see more, feel free to enroll into any of the seven fullstack courses we've launched so far, on subject like Node, Next, Express, SQL, Vite, and more. We've opened them up for Hacker News today so that you don't even need to create an account to watch the content:<p><a href="https://scrimba.com/fullstack">https://scrimba.com/fullstack</a><p>*Other notable highlights about our "IDE videos":*<p>- Based on events (code edits, cursor moves, etc) instead of pixels
- Roughly 100x smaller than traditional videos
- Recording is simple: just talk while you code
- Can be embedded in blogs, docs, or courses, like MDN does here: <a href="https://developer.mozilla.org/en-US/curriculum/core/css-fundamentals/" rel="nofollow">https://developer.mozilla.org/en-US/curriculum/core/css-fund...</a>
- Entirely built in Imba, a language I created myself: <a href="https://news.ycombinator.com/item?id=28207662">https://news.ycombinator.com/item?id=28207662</a><p>We think this format could be useful for open-source maintainers and API-focused teams looking to create interactive docs or walkthroughs. Our videos are already embedded by MDN, LangChain, and Coursera.<p>If you maintain a library or SDK and want an interactive video about it, let us know—happy to record one for free that you can use however you like.<p>Would love to answer any questions or hear people's feedback!