使用 github.dev 可以做的有趣的事情😎

GitHub 最近发布了github.dev，它允许你.直接在浏览器中点击任意代码库，即可在 VS Code 中打开它 (🤯)。这个简单的操作可以显著提升你在 GitHub 上阅读、编辑和共享代码的效率，即使在 iPad 上也能轻松操作！

注意：除了.密钥之外，您还可以在 URL 栏中将“.com”更改为“.dev”，以达到相同的效果👍

由于 github.dev 基于 VS Code，您可以自定义按键绑定、颜色主题、文件图标、代码片段等。更棒的是，您可以启用设置同步，并在 VS Code、github.dev 和Codespaces之间漫游您的个性化设置。这样，无论您在哪里阅读/编辑代码，都能立即感到轻松自在 💖

然而，可能不太明显的是，github.dev 实现了更引人注目的功能：定制和创建全新的GitHub 原生工作流程。无需依赖浏览器扩展或第三方服务来增强 github.com 的功能，你只需利用你喜爱的编辑器及其丰富的生态系统，就能直接增强 GitHub 的功能。为了说明我的意思，让我们来看看 Github.dev 目前实现的 10 个示例 🚀

1. ✉️ 分享深层链接

除了.在仓库页面中按下 之外，您还可以.在 GitHub.com 上查看特定文件时按下 。此外，如果您在当前打开的文件中选中部分文本，然后按下.，则 VS Code 打开后会聚焦该文件并高亮显示相同的文本选择。然后，您可以在浏览器中复制 URL，并将其发送给其他人，以便共享相同的上下文。这项简单的功能有可能带来新颖有趣的代码交流方式🔥

演示：单击此链接查看GitDoc 扩展如何在 VS Code 中订阅 repo 事件。

2. ✅ 拉取请求评审

除了.在 GitHub.com 上点击某个仓库或文件外，您还可以在查看拉取请求时点击它。这样您就可以使用丰富的多文件视图来审查 PR，其中包括查看和回复评论、提出修改建议，甚至可以直接在编辑器中批准/合并 PR。这有望减少“肤浅的审查”，为开发人员提供更好的工具，而无需克隆或切换分支🙅‍♂️

演示：单击此链接可查看向CodeTour 扩展添加正则表达式解析器的 PR 。

3. 📊 编辑图像 + 图表

除了编辑文本文件之外，VS Code 还允许扩展程序贡献自定义编辑器，让您能够编辑项目中的任何文件类型。例如，如果您安装了Drawio 扩展程序，则可以查看和编辑丰富的图表。

此外，如果您安装Luna Paint 扩展，您可以编辑图像（PNG、JPG 等）。

在任何情况下，您的编辑都会自动保存，您可以通过标签页将更改提交/推送回您的 GitHub 仓库Source Control。更酷的是，您可以与他人共享图像/图表的深层链接，只要他们安装了必要的扩展程序，他们就能通过完全相同的体验与您协作。这实际上使 github.dev 成为了一个可入侵的“画布”，可以访问存储在 GitHub 中的任何文件类型 😎

4. 🗺 代码库演练

学习新的代码库并非易事，因为通常不清楚从哪里开始，也不清楚各种文件/文件夹之间的关系。使用 github.dev，您可以安装CodeTour 扩展程序，它允许您创建和回放代码库的引导式演示。由于 github.dev 完全在浏览器中运行，这使得团队或社区中的任何人都可以轻松快速地上手，而无需在本地安装任何东西。

演示：打开此 repo并安装 CodeTour。系统会弹出一个提示框，询问您是否愿意参与此Getting Started导览。

5.📕 代码片段 + Gists

Gist是开发者管理和分享代码片段、配置文件、注释等内容的常用方式。在 github.dev 中，您可以安装GistPad 扩展程序并查看/编辑您的 Gist。这样您就可以跨多个代码库维护代码片段，并且可以通过桌面编辑器以及在 GitHub 上浏览/编辑代码时访问它们。

6. 🎢 Web Playgrounds + 教程

编程游乐场（例如 CodePen、JSFiddle）是学习编程语言/库并与他人分享的热门方式。使用 github.dev，您可以安装CodeSwing 扩展并开始使用现有的编辑器设置创建 Web 游乐场，并将文件保存回 GitHub。

演示：打开此 repo并安装 CodeSwing + CodeTour。几秒钟后，您将看到 playground 环境。

7. ✏️ 笔记 + 知识库

VS Code 是一款世界一流的 Markdown 编辑器，因此，您可以开始使用 github.dev 编辑和预览您的所有个人笔记/文档。更棒的是，您可以安装WikiLens 扩展程序，以获得类似 Roam/Obsidian 的编辑体验，用于维护存储在 GitHub 中的知识库，并能够从 VS Code 的扩展/个性化生态系统中受益。

8. 📽 演示文稿

一旦你习惯了使用 github.dev 进行基于 Markdown 的笔记记录，你必然会想用 Markdown 编写其他类型的文档，因为它的体验非常简单优雅。如果你安装了Marp 扩展程序，就可以开始只用 Markdown 创建幻灯片，并直接从浏览器进行演示。我已经开始使用这个工作流程了，当它与 GistPad（用于将演示文稿存储为 Gist）结合使用时，它就是推动对话/会议的最神奇的方式 🥰

9. 📓 Jupyter Notebooks

除了编程游乐场之外，另一种流行的学习和分享代码的方式是通过 Jupyter Notebook。如果你.ipynb在 github.dev 中打开一个文件，就可以立即查看 Notebook 的单元格和缓存的输出。更棒的是，你可以安装Pyodide 扩展，这样就可以完全在浏览器中运行 Python 代码了！

10.🛠创建您自己的扩展！

您可能已经注意到，上面的大多数功能都是通过扩展程序启用的，这些扩展程序是由某人创建并发布到市场的。由于 VS Code完全可扩展，使用简单的 JavaScript API，您可以创建自己的扩展程序，不仅支持 VS Code 桌面版，还支持github.dev。所以，如果您有一个很棒的想法，想让在 GitHub 上编码更高效、更有趣，那么您现在已经拥有了开始的一切🏃

🔮 展望未来

虽然 GitHub.dev 已经有很多用例，但它仍处于早期阶段，因此随着生态系统的持续创新，这是一个值得关注的领域。尤其让我兴奋的是，实时协作和课堂作业功能在浏览器中得到了全面支持。💯 激动人心的时刻！