如何通过 GitHub 上的代码进行学习?
通过 GitHub 上的项目进行学习是学习新技术和为自己的项目寻找灵感的好方法。
但 GitHub 上有数百万个公开可用的存储库,查找适合自己项目的代码可能会非常耗时。 即使找到非常合适的存储库,浏览代码库查找有用的示例也可能会非常麻烦。
相比尝试了解整个项目,更好的方法是选择单个特性或功能并了解其原理。 可以使用 Copilot Chat 和 GitHub 的搜索功能来查找功能,并在代码库中追踪其实现路径。 这是一种极佳的学习方式,因为可以看到该功能从后端到前端的完整运作过程。
在本指南中,你将通过执行示例方案同时了解如何完成这两项操作:了解如何在 Jekyll 网站上加载和显示文件中的数据。 然后,可以将相关技巧应用于其他项目和编程语言。
查找示例项目
第一步是查找适合学习的项目。
使用 Copilot Chat 标识存储库
查找包含适合学习的代码的项目的最快方法是让 Copilot Chat 查找与需求匹配的存储库。
打开 Copilot Chat 并启动常规用途聊天。 然后询问:
可否找到一些使用 Jekyll 显示存储库中文件的常用存储库?
Copilot 会返回相关存储库的链接,之后可以进一步询问有关存储库的问题。
通常 Copilot 在结束其响应时会显示提供更多结果的 GitHub 搜索的链接。 接下来,查看这些结果。
使用搜索标识更多选项
如果 Copilot 包含搜索结果的链接,请使用该链接。 如果没有,请按照以下步骤生成自己的搜索查询。
- 导航到“高级搜索”。
- 在“高级选项”部分中,使用“用此语言编写”下拉列表来选择编程语言。 为 Jekyll 网站选择“HTML”。
- (可选)在“存储库选项”下的“使用这么多星号”旁键入
>150
。 这有助于找到维护良好的常用存储库。 - 在页面顶部,单击“搜索”****。
Tip
可以通过向搜索查询中添加主题和文本,进一步缩小搜索结果范围。 例如,topic:jekyll "blog"
会返回所有者分类为与 Jekyll 相关且名称或说明中含“博客”一词的存储库。 有关常见主题的列表,请参阅 GitHub 上的主题。
选择项目
查看 Copilot 提供的结果并进行搜索后,我们决定使用 github/choosealicense.com
存储库。 此存储库包含“选择许可证”的源代码,“选择许可证”是共享开放源代码许可证相关信息的 Jekyll 网站。
我们特别关注“许可证”页,该页显示数据文件中的常用开放源代码许可证。
在项目中自我定位
在深入了解用于显示数据文件的代码之前,先在存储库中进行大体上的自我定位。
首次访问存储库时,很难知道应从何处开始。 虽然每个项目有其自己的组织方式,但可以依赖一些常见的文档方法来帮助理清方向。
README.md 文件
一个不错的方法是阅读 README.md 文件,该文件是存储库的首页,会自动显示在文件列表下方。 不同的维护者会提供不同的信息,但通常可以找到关于项目的信息、如何在本地计算机上构建项目以及相关文档的链接。
在 github/choosealicense.com
存储库中,README.md 文件说明了许可证文件所在的位置 (/_licenses
)、每个许可证可能包含的属性以及如何让网站在计算机上运行。
使用 Copilot Chat
如果 README.md 文件未提供所有解答,可以让 Copilot 帮助浏览存储库和查找功能。
**** 若要打开 Copilot Chat,单击搜索栏旁的 GitHub Copilot 图标并提问。 例如:
此 Jekyll 网站的主登陆页面是什么?
向 Copilot 询问有关存储库的问题时,它可以返回相关文件、解释其在功能中的作用并提供链接。
存储库的 Wiki
另一个可能的信息来源是存储库的 Wiki****,这是存储库专用于托管文档的部分。 GitHub 上的每个存储库都配置了使用 Wiki 的功能,但并非每个存储库都会用到。 若要访问 Wiki,单击存储库中的“Wiki”**** 选项卡。
发行版本
如果存储库的源代码生成到可执行文件中,某些存储库维护者会通过存储库的“版本”**** 发布二进制文件。 可以下载并运行这些二进制文件,以检查应用程序在浏览代码库时的工作方式,而无需自行生成项目。
可以在文件列表右侧的边栏以及 README.md 中找到存储库的版本。
内部文档
也可以在存储库的内容中查找内部文档。 这可能是单个 Markdown 文件或包含 Markdown 文件的目录。 用于查找的常见名称包括“docs”、“documentation”、“wiki”、“resources”、“help”和“manual”。
浏览源代码
现在,我们已经了解存储库的整体结构,接下来可以使用 GitHub 搜索来查找所需的具体功能。
当位于存储库中并单击页面顶部的搜索字段时,GitHub 会自动添加 repo
搜索限定符,将搜索结果范围限定在查看的存储库。
首先,我们需要确定搜索什么。 我们可能需要查找正在检查的功能特有的文本字符串,也可能需要查看页面的 HTML 源或查找具体的 class
或 id
属性。
在本示例中,我们将使用查询 repo:github/choosealicense "If you’re looking for a reference table?"
搜索许可证页顶部的文本。 查询返回了一个结果,一个名为 licenses.html
的文件。
现在可以单击结果并深入查看! licenses.html
是我们查找的“许可证”页面的源。 可以看到搜索的字符串,以及每个许可证都包含在以下代码中:
{% include license-overview.html license-id="agpl-3.0" %}
了解源代码
现在已找到所需的特定代码,接着我们来了解这些代码。
向 Copilot Chat 询问这些代码
可以使用 Copilot 详细了解某个文件甚至特定代码行。 Copilot 会结合编程语言的相关信息和存储库中的上下文,提供非常详细的解答。
现在让 Copilot 解释第 11 行代码,并包含 {% include %}
标记。 单击行号。 然后,在行右侧,单击 。 在聊天窗口中,询问:
这一行的作用是什么?
Copilot 会说明,这行代码的作用是引入 license-overview.html
文件,并将 "agpl-3.0"
作为 license-id
传递以显示内容。
Tip
如果不理解 Copilot Chat 的响应,可以要求它简化回答或进一步说明回答的特定部分。
阅读注释
注释是人可阅读的注解,可用于理解代码,且不会在代码中被执行。 通常使用 //
或 /*
等字符将其隔开。
需要了解以下几种类型的注释:
- 行****:描述特定行作用的单行注释
- 块****:多行注释,描述整个函数或文件的作用
- 文件****:文件开头的块注释,提供代码库特定部分的概述
在编程语言参考中查找函数
每种编程语言都会在线上提供参考信息,详细说明该语言的各个方面。
如果使用搜索引擎搜索编程语言和函数,应会找到指向该函数参考页的链接。
在我们的示例中,在搜索引擎中搜索 jekyll include
应会返回 Jekyll 文档中的“Includes”文档。 如果进一步阅读 Jekyll 的文档,可以了解到许可证本身是 _licenses
目录中的一个集合。
Tip
如果未在编程语言参考中找到函数,则可能函数是在代码库自身中定义的。 询问 GitHub Copilot 查找该函数。
所学内容总结:licenses.html
文件包含显示的每个许可证的 /_includes/license-overview.html
。 /_includes/license-overview.html
文件与提供给 /_licenses
集合中一个许可证的 license-id
匹配,并显示详细信息。
小更改试验
如果可以在计算机上本地运行项目,一种很好的学习方法是进行微小更改来了解会发生什么。
首先,可以更改文本,然后尝试进行更大的更改,例如尝试了解函数和文件彼此如何交互。
尝试在 _includes
目录中查找 license-overview.html
文件,然后更改许可证的显示方式或试验并了解如何从集合中加载许可证。
可以更改其中一个许可证文件开头的元数据,更改 license-overview.html
中显示的属性,甚至尝试添加自己的属性。 更改后,可以按照 README.md 中的说明在浏览器中查看它以进行测试。
应用所学内容
存储库 github/choosealicense.com
是大型 Jekyll 项目的一个很好的示例,充分体现了使用 Jekyll 和 GitHub Pages 可以实现什么。 你是否能够应用所学到的有关存储库结构、存储库如何使用集合及其包含许可证数据的方式等相关知识生成自己的项目?
后续步骤
了解了示例代码的原理后,你可能会希望在自己的项目中重复使用它。 代码重用是软件开发中的一个重要部分,但要正确、合法地实现需要遵循一些重要步骤。 完整教程请参阅 在你的项目中重复使用其他人的代码。