本文介绍了一个免费的 Web 应用程序，用于创建交互式编码教程，以将代码解释为故事。项目文档是一个无聊的部分，大多数人只有在被困在某个地方时才会参考。它通常充满了信息，这并不总是对每个人有帮助，尤其是新手。因此，这里有一个简单的方法，您可以使用它来将 GitHub 项目文档变成一个引人入胜的故事。StoryTime 是一个免费的 Web 应用程序，您可以在其中将无聊的 GitHub 存储库文档转换为交互式故事。您可以获取 GitHub 存储库并选择要通过故事或教程解释的文件。这样做会在编辑器中打开该文件，你可以在编辑器中逐帧创建类似调试的视觉效果。您可以使用各种注释进行解释，还可以添加模因、GIF、屏幕截图等。完成后，故事就像演示文稿一样运行，您可以逐帧播放或导航。除了文档之外，您还可以将其与代码文件一起使用，并创建交互式编码教程来向用户解释编程过程。另请阅读：？带有动画视频的在线编码教程，代码示例：DevelopPHP如何使用 StoryTime 创建交互式编码教程？要创建交互式编码教程，请访问 StoryTime 网站并使用您的 GitHub 帐户注册。注册后，它会为您提供有关故事的简要介绍，以及您可以采取哪些措施来使其引人入胜。从这里，您可以通过三个简单的步骤为您的 GitHub 存储库创建一个故事。步骤1在第一步中，您必须输入此应用程序的 GitHub 所有者/存储库。Doing 从 GitHub 获取相应的存储库，并列出存储库中的所有文件。或者，您可以在 GitHub 站点上打开存储库，只需将 URL 中的“github.com”替换为“storytime.dev”即可。第2步获取存储库后，您将从该存储库中获取文件列表。每个文件的名称旁边都有一个“创建故事”按钮。在这里，您必须选择要为其创建故事的文件。您可以使用 README.md 文件创建一个故事，并将无聊的文档变成一个交互式故事，或者为代码文件创建一个故事来解释编码过程。如果单个文件没有包含所有信息，则可以在创建故事时创建一个新文件并添加所有必需的信息。而且，如果文件存储库中已有故事，则该文件将列在屏幕左侧。第 3 步第三步是实际工作发生的地方。此步骤将打开一个编辑器，其中包含您的文件内容。从最左侧，您可以向故事添加帧。然后，您可以在框架中分发内容并添加交互元素来创建故事。以下是您可以添加以创建故事的所有元素和注释的列表：注释（行注释、添加断点、添加内联变量、动画整行、滚动到行等）手表表达式调用堆栈屏幕截图标题模因反应GIF打开另一个文件（单步执行）创建新文件完成后，添加故事和顶部的名称，然后点击 Enter 保存它。预览使用右上角的“播放”按钮，您可以预览您的故事。故事屏幕有一个播放/暂停按钮以及帧导航按钮。用户可以播放故事，一帧又一帧地显示到最后，也可以使用导航按钮手动循环浏览所有帧。创建故事后，只需在存储库中包含故事链接即可使用它，而不是使用传统文档。在这里创建交互式编码故事。?StoryTime 是一个不错的网络应用程序，它可以将相当无聊的文档转换为引人入胜的故事。您可以将其与代码文件一起使用，并创建交互式编码教程来向用户解释编程过程。试一试，并在评论部分与我们分享您的想法。
