GitHub 从 0 到 1 使用教程

前言

欢迎来到 GitHub 的世界。

如果你是一名开发者------无论你是刚入行的新手,还是已经有几年经验的工程师------GitHub 都是你绕不开的工具。它不仅是全球最大的代码托管平台,更是技术人学习、协作、展示自己的核心阵地。

本教程的目标是:从零开始,带你掌握 GitHub 的核心使用场景

我们会重点覆盖:

  • GitHub 网页端的完整操作(注册、个人主页、发现项目、Star/Fork)
  • 仓库的创建与管理(网页端为主)
  • Pull Request 与开源协作(全程不离开浏览器)
  • Git 基础命令的联动使用

对于 Git 命令行细节和团队协作高级场景(如分支策略、rebase、复杂冲突解决等),本教程会提供深入学习资源链接,供你按需进阶。

现在,让我们开始吧。


第一部分:入门与探索

1. GitHub 是什么?

1.1 GitHub 的核心价值

简单来说,GitHub 是一个基于 Git 的代码托管平台。但它的意义远不止于此。

GitHub 可以帮你做这些事情:

场景 说明
代码托管 把你的代码安全地存放在云端,随时随地访问
版本控制 记录每一次修改,随时可以回退到任意历史版本
开源协作 参与全球数百万开源项目,或发布自己的项目让别人参与
技术学习 阅读顶级项目的源码、文档、Issue 讨论
个人品牌 通过你的 GitHub 主页向世界展示你的技术能力和项目

1.2 GitHub 与 Git 的区别

很多初学者会混淆这两个概念。这里用一个比喻帮你理解:

Git 是一辆汽车 (版本控制工具)
GitHub 是一个停车场(代码托管平台)

  • Git 是一个命令行工具,在本地电脑上运行,负责记录代码的每一次变化。
  • GitHub 是一个网站,可以把本地的 Git 仓库上传到云端,方便多人协作和备份。

你可以只用 Git(本地管理代码),也可以只用 GitHub 网页端做简单的编辑,但更常见的做法是:本地用 Git 命令,远程用 GitHub 协作

💡 本教程会同时讲解网页端操作和基础 Git 命令,但命令行细节不会过于深入。进阶学习资源请参考附录 B。


2. 注册与个人主页设置

2.1 注册账号

  1. 打开浏览器,访问 github.com
  2. 点击右上角的 Sign up
  3. 输入以下信息:
    • 邮箱地址(建议使用常用邮箱)
    • 密码(需要包含字母、数字、符号)
    • 用户名(这将是你未来的个人主页地址:github.com/你的用户名
  4. 完成验证(拼图或邮箱验证)
  5. 选择 Free 免费计划(个人使用完全足够)

⚠️ 注意:用户名一经确定,虽然可以修改,但旧地址会失效,建议第一次就认真选择。

2.2 完善个人资料

登录后,点击右上角头像 → SettingsProfile,开始完善你的资料:

字段 说明 是否必填
Name 真实姓名或昵称 推荐
Bio 一句话介绍自己(支持 emoji) 推荐
Company 公司/学校名称 可选
Location 城市 + 国家 可选
Website 个人博客或社交链接 可选
Twitter Username 绑定 Twitter 可选

一个填好的个人资料示例:

复制代码
Name: 张三
Bio: 前端开发者 🎨 | 开源爱好者 | 正在学习 React
Location: Beijing, China
Website: https://zhangshan.dev

2.3 Pin 仓库:在个人主页展示你的项目

Pin(置顶)功能可以让访客第一时间看到你最得意的项目。

操作步骤:

  1. 进入你的个人主页(点击右上角头像 → Your profile)
  2. 点击 "Popular repositories" 区域右侧的 Customize your pins
  3. 从列表中勾选你想要展示的仓库(最多 6 个)
  4. 点击 Save

被 Pin 的仓库会以卡片形式展示在主页顶部,包含仓库名称、描述、主要语言和 Star 数量。

2.4 README 个性名片:让你的主页与众不同

GitHub 有一个隐藏的彩蛋:创建一个和你用户名完全相同的仓库,然后在该仓库中编写 README.md,这个 README 会自动显示在你的个人主页顶部。

操作步骤:

  1. 点击右上角 +New repository
  2. Repository name 输入框填:你的用户名 (例如你的用户名是 zhangsan,就填 zhangsan
  3. 勾选 "Add a README file"
  4. 点击 Create repository

创建完成后,编辑 README.md 文件,可以使用 Markdown 格式。一个简单的例子:

markdown 复制代码
## 👋 你好,我是张三

- 🔭 我正在做一个 React 后台管理项目
- 🌱 正在学习 Node.js 和 GraphQL
- 👯 希望参与 TypeScript 相关的开源项目
- 💬 问我关于:前端、Git、Vue
- 📫 联系我:zhangshan@example.com
- ⚡ 有趣的事:我每天喝 3 杯咖啡 ☕☕☕

### 📊 GitHub 统计

![张三的 GitHub 统计](https://github-readme-stats.vercel.app/api?username=zhangsan&show_icons=true&theme=default)

你也可以在网上搜索 "GitHub Profile README 模板",找到大量精美的设计参考。


3. GitHub 网页基础导航

3.1 首页信息流

登录后,你首先看到的是 Dashboard(仪表盘)。这里显示的是:

  • Follow 的人最近的活动(Star、Fork、PR 等)
  • 你参与的仓库的最新动态
  • GitHub 推荐的项目和活动

💡 多关注一些技术大佬和优秀项目,你的首页信息流会变成高质量的技术资讯源。

3.2 仓库页面结构

当你进入任意一个仓库页面(例如 github.com/facebook/react),你会看到以下核心区域:

区域 说明
仓库名称 格式为 用户名/仓库名,例如 facebook/react
Watch / Star / Fork 三个核心操作按钮,详见第 5 节
Code 标签页 查看仓库文件和源码(默认页面)
Issues 标签页 问题追踪和讨论区
Pull Requests 标签页 合并请求管理
Projects 标签页 项目管理看板
Wiki 标签页 项目文档(部分仓库使用)
文件列表区 显示仓库的目录和文件
README 展示区 文件列表下方,展示仓库的介绍文档

3.3 个人面板

点击右上角头像 → Your profile,进入你的个人主页。重点关注以下几个地方:

  • 贡献日历:绿色方块网格,展示你过去一年每天提交代码的活跃度(绿色越多越活跃)
  • 贡献活动:下方展示你最近的 Push、PR、Issue 等操作记录
  • Repositories 标签:你拥有的所有仓库列表
  • Stars 标签:你 Star 过的所有项目列表

第一部分小结

恭喜你完成了 GitHub 入门的第一步!

你学会了:

  • ✅ GitHub 与 Git 的区别
  • ✅ 注册账号并完善个人资料
  • ✅ 创建个人 README 名片
  • ✅ 了解 GitHub 的主要导航界面
    好的,我们继续撰写第二部分:发现与学习好项目

第二部分:发现与学习好项目

GitHub 不仅仅是一个存放代码的地方,它更是一个巨大的知识宝库。这里有数百万个开源项目,从操作系统、编程语言框架,到机器学习库、前端组件,几乎你能想到的技术领域,都能在 GitHub 上找到相关的项目。

但问题也随之而来:如何从海量的项目中找到真正优秀、适合自己学习的那一个?

第二部分将教你如何高效地在 GitHub 上"淘金"。


4. 如何发现优秀的项目

4.1 Explore 板块:GitHub 官方推荐

GitHub 的 Explore(探索)板块是发现热门项目的首选入口。

如何进入:

  • 点击页面顶部的 Explore 链接,或直接访问 github.com/explore

Explore 板块包含以下几个子栏目:

子栏目 说明
Trending 趋势榜,展示近期热门仓库(可按语言、时间范围筛选)
Topics 按技术主题分类(如 machine-learningreactrust
Collections 官方整理的精选合集(如 "Learn to code"、"Python 最佳实践")
Events 展示热门事件(如 Hacktoberfest 开源贡献活动)
Trending(趋势榜)使用技巧

Trending 是最常用的功能,建议按以下方式筛选:

  1. 选择语言:点击右侧的 "Language" 下拉菜单,选择你感兴趣的技术栈(如 JavaScript、Python、Go)
  2. 选择时间范围
    • Today:今天最热的项目(变化快,适合追热点)
    • This week:本周最热(推荐,平衡了热度与稳定性)
    • This month:本月最热(适合发现长期趋势)

💡 学习建议 :初学者建议先看 This week 的热门项目,每天花 10 分钟浏览,长期坚持会大大扩展你的技术视野。

4.2 搜索技巧:精准定位好项目

GitHub 内置了强大的搜索引擎,支持多种筛选语法。掌握以下技巧,你就能像专家一样快速找到目标项目。

基础搜索

在 GitHub 页面顶部的搜索框中输入关键词,例如 reactpython crawler

高级筛选语法

以下是最常用、最实用的筛选条件:

语法 作用 示例
language:xxx 按编程语言筛选 chatbot language:python
stars:>数量 按 Star 数量筛选 deep learning stars:>5000
stars:范围..范围 Star 数量区间 vue stars:10000..50000
forks:>数量 按 Fork 数量筛选 react forks:>10000
updated:>YYYY-MM-DD 按最后更新时间筛选 tensorflow updated:>2024-01-01
topic:xxx 按主题标签筛选 topic:game-engine
user:用户名 搜索特定用户的项目 user:torvalds linux
组合搜索实战示例

示例 1:寻找 2024 年之后有更新的、Python 写的中等规模机器学习项目

复制代码
machine learning language:python updated:>2024-01-01 stars:1000..10000

示例 2:寻找 Vue 生态中 Star 数超过 1 万的热门工具

复制代码
vue stars:>10000

示例 3:找微软公司最新发布的 Go 语言项目

复制代码
user:microsoft language:go

💡 小技巧 :搜索后可以点击页面上的 "Sort by" 按钮,按 Most stars (最多 Star)或 Recently updated(最近更新)排序。

4.3 Topic 标签:按技术领域浏览

GitHub 的主题标签(Topic)类似于微博的话题标签或 B 站的频道。每个热门技术领域都有一个对应的 Topic 页面。

如何进入:

  • 方法一:在 Explore → Topics 中浏览
  • 方法二:直接在 URL 中输入 github.com/topics/主题名

常用 Topic 示例:

技术领域 Topic 地址
前端框架 React github.com/topics/react
前端框架 Vue github.com/topics/vue
人工智能/机器学习 github.com/topics/machine-learning
Python github.com/topics/python
游戏开发 github.com/topics/game-development
区块链 github.com/topics/blockchain

在每个 Topic 页面中,你可以看到:

  • 该主题下的热门仓库
  • 相关的开发者
  • 官方精选的仓库集合

4.4 Awesome 系列列表:精选资源大全

在 GitHub 上,有一类特殊的仓库叫做 Awesome 系列。它们不包含代码,而是用 Markdown 整理的资源列表,涵盖某个技术领域的书籍、教程、工具、开源项目等。

最著名的 Awesome 仓库是 awesome 本身:github.com/sindresorhus/awesome

常用 Awesome 仓库推荐:

技术方向 仓库地址
综合大全 github.com/sindresorhus/awesome
Python github.com/vinta/awesome-python
JavaScript github.com/sorrycc/awesome-javascript
机器学习 github.com/josephmisiti/awesome-machine-learning
前端 github.com/uhub/awesome-frontend
网络安全 github.com/fabionoth/awesome-cyber-security

💡 使用建议 :当你想要学习某个新技术但不知道从哪里开始时,先去搜索 awesome-技术名,通常能找到一份非常完整的资源清单。


5. Star、Watch、Fork 的使用场景

这是 GitHub 网页端最常用的三个按钮,位于每个仓库页面的右上角。很多初学者不清楚它们的区别和适用场景,下面详细解释。

5.1 Star:收藏与点赞

Star 的作用:

  • 相当于给项目点赞或收藏
  • 方便你以后快速找到曾经关注过的项目
  • 项目 Star 数量是衡量其受欢迎程度的重要指标(很多开发者会通过 Star 数量判断项目质量)

什么时候使用 Star:

  • 你发现了一个有意思的项目,暂时没时间仔细看,想先收藏起来
  • 你使用某个项目解决了问题,想表达感谢和支持
  • 你想向其他人推荐这个项目

如何管理你 Star 的项目:

  1. 进入你的个人主页
  2. 点击 Stars 标签页
  3. 这里会列出你 Star 过的所有项目(按时间倒序)

💡 进阶技巧 :Star 时可以添加分类标签。在 Star 时输入 #标签名,例如 #machine-learning#react,之后可以在 Stars 页面左侧按标签筛选。

5.2 Watch:订阅动态

Watch 的作用:

  • 订阅仓库的动态,当仓库有新的 Issue、Pull Request、讨论或代码提交时,你会收到通知

Watch 的三个级别:

级别 说明
Not watching 不接收任何通知
Releases only 仅在新版本发布时接收通知(推荐大多数情况使用)
Watching 接收所有动态(适合项目核心贡献者)

什么时候使用 Watch:

  • 你是某个项目的核心贡献者,需要第一时间知道所有动态
  • 你想跟踪一个项目的开发进度(例如你正在使用的框架即将发布新版本)
  • 你正在学习一个项目,想观察它的 Issues 讨论和 PR 合并过程(这是非常高效的学习方式)

5.3 Fork:复制项目到自己的账号下

Fork 的作用:

  • 将一个项目的完整副本(包括所有代码、提交历史、分支)复制到你自己的 GitHub 账号下
  • Fork 后的仓库独立于原仓库,你可以随意修改,不会影响原项目

什么时候使用 Fork:

  • 你想要参与开源项目:Fork → 修改代码 → 发起 Pull Request
  • 你想基于别人的项目做二次开发(例如修改一个开源主题适配自己的博客)
  • 你想保存一个项目的历史快照(即使原仓库被删除,你的 Fork 仍然存在)

Fork 与 Clone 的区别:

操作 位置 作用
Fork GitHub 网页端 在服务器端复制一个仓库到你的账号下
Clone Git 命令行 / GitHub Desktop 将仓库从服务器下载到你的本地电脑

一个典型的工作流是:

  1. 在网页端点击 Fork,把项目复制到你自己的账号下
  2. 在本地执行 git clone 你账号下的仓库地址,下载到电脑
  3. 修改代码后 git push 到你自己的远程仓库
  4. 在网页端发起 Pull Request,请求原仓库合并你的修改

💡 关于 Pull Request 的详细流程,我们会在第四部分深入讲解。

5.4 三者的对比总结

功能 Star Watch Fork
主要用途 收藏点赞 订阅动态 复制项目
是否改变仓库 是(复制到你的账号)
是否通知原作者 是(作者能看到 Star 通知) 是(作者能看到 Fork 通知)
适合人群 所有用户 贡献者/深度学习者 贡献者/二次开发者

6. 通过 GitHub 学习

GitHub 是最好的技术学习平台之一,但它不像传统的在线课程那样有固定的教学结构。你需要主动探索,以下是几个高效的学习方法。

6.1 阅读优秀项目的源码和 README

怎么读:

  • 找 Star 数高、你正在使用的框架或工具(如 React、Vue、Flask)
  • 先读 README,了解项目目标、架构和用法
  • 然后看 /examples/docs 目录(如果有)
  • 最后读源码:从入口文件(通常是 index.jsmain.pysrc/index.ts)开始,顺着函数调用链往下读

初学者建议: 不要一开始就挑战大型项目(如 Linux、React 核心库)。先从 1000~5000 行的小工具或库开始。

6.2 Issues 区:看真实问题讨论与解决方案

每个仓库的 Issues 标签页是一个公开的问答区和问题追踪系统。这里藏着大量有价值的学习材料。

你可以学到什么:

  • 用户遇到的实际问题(往往是真实场景的边界情况)
  • 维护者如何分析和定位问题
  • 代码修复的具体方案(有时会附带代码片段)
  • 项目的设计决策和取舍

学习建议:

  1. 找一个你熟悉的库的 Issues 页面
  2. 筛选 closed(已关闭)状态
  3. 阅读 bug 标签的问题,看维护者如何一步步定位和修复

6.3 Discussions:参与技术问答与社区交流

Discussions(讨论区)是比 Issues 更适合初学者参与的板块。它更像一个论坛,可以发布问题、分享想法、进行技术交流。

Discussions 通常包含以下几个分类:

分类 说明
Q&A 提问与解答(类似 Stack Overflow)
Ideas 提出新功能的建议
Show and tell 展示用该项目做的作品
General 一般性讨论

💡 参与建议:你可以在这里提问、回答别人的问题、或者只是阅读别人的讨论。这是一个低门槛的参与方式,不需要写代码就能融入开源社区。

6.4 跟随项目 Wiki 或 docs 学习

很多大型项目在仓库的 Wiki 标签页中维护了额外的文档,或者在仓库根目录下有一个 /docs 文件夹。

推荐做法:

  • 学习新技术时,优先阅读官方仓库的 README 和 Wiki(这比第三方博客更权威、更新及时)
  • 很多项目的 /docs 文件夹里就是它们的完整文档网站源码,你可以学习文档的组织方式

6.5 GitHub Skills:官方交互式学习课程

GitHub 官方提供了一个免费的交互式学习平台------GitHub Skills

地址: skills.github.com

特点:

  • 在真实 GitHub 仓库环境中完成练习(每个课程会自动生成一个练习仓库)
  • 涵盖 GitHub Actions、Pages、Markdown、开源协作等主题
  • 完全免费,有中文界面

推荐课程:

  • "Introduction to GitHub":适合完全零基础
  • "Reviewing Pull Requests":学习如何做代码审查
  • "GitHub Pages":学习搭建个人网站

第二部分小结

在第二部分中,你学会了:

  • ✅ 通过 ExploreTrending搜索语法 发现优秀项目
  • ✅ 使用 Topic 标签Awesome 系列 找到学习资源
  • ✅ 区分 Star (收藏)、Watch (订阅)、Fork(复制)的使用场景
  • ✅ 通过 IssuesDiscussionsWikiGitHub Skills 高效学习

第三部分:仓库操作(网页版)

在了解了如何发现和收藏好项目之后,现在是时候动手创建属于你自己的仓库了。

很多人有一个误区:认为使用 GitHub 必须掌握复杂的 Git 命令行。其实不然------GitHub 网页端本身就能完成大部分基础的仓库管理操作

第三部分将完全聚焦于 GitHub 网页端,教你如何在不打开终端的情况下,完成仓库的创建、编辑、管理和协作。

💡 本部分不涉及 Git 命令行,纯网页操作,非常适合初学者上手。


7. 网页端创建与管理仓库

7.1 新建仓库

操作步骤:

  1. 点击页面右上角的 + 图标 → 选择 New repository
  2. 填写仓库信息:
字段 说明 示例
Repository name 仓库名称(必填,只能包含字母、数字、连字符、下划线) my-first-blog
Description 简短描述(可选,但强烈推荐填写) 一个记录我学习前端过程的博客项目
Public / Private 公开(所有人可见)或私有(仅你和邀请的人可见) 初学者建议选 Public
Initialize this repository with 初始化选项(见下方详解) 建议全部勾选

初始化选项详解:

选项 作用 建议
Add a README file 自动创建一个 README.md 文件,用于介绍项目 ✅ 强烈推荐勾选
Add .gitignore 自动生成 .gitignore 文件,排除不需要上传的文件(如日志、依赖包) ✅ 推荐勾选,并选择对应的编程语言模板
Choose a license 添加开源许可证文件,说明他人可以如何使用你的代码 ✅ 推荐勾选(详见下方说明)

关于开源许可证的快速选择:

你的需求 推荐许可证
想让别人随便用,不用注明出处 MIT License(最宽松)
想让别人必须注明出处,其他不限 Apache License 2.0
想让别人用了你的代码的项目也必须开源 GPL v3(强传染性)
不确定选什么,或只是个人学习笔记 可以不选,或者选 MIT

💡 小技巧 :仓库名建议用英文小写加连字符(如 my-todo-app),这样在 URL 中更美观,也方便命令行操作。

7.2 仓库页面的核心区域

创建完成后,你会进入仓库的主页面。让我们来熟悉一下各个区域:

复制代码
┌─────────────────────────────────────────────────────────────┐
│  [用户名/仓库名]          Watch │ Star │ Fork              │
├─────────────────────────────────────────────────────────────┤
│  Code  │ Issues │ Pull Requests │ Projects │ Wiki │ ...    │
├─────────────────────────────────────────────────────────────┤
│                                                             │
│  📁 文件列表区                                               │
│  ├── README.md                                              │
│  ├── .gitignore                                             │
│  └── LICENSE                                                │
│                                                             │
├─────────────────────────────────────────────────────────────┤
│  📖 README.md 展示区                                         │
│  (这里显示 README 文件渲染后的内容)                          │
│                                                             │
└─────────────────────────────────────────────────────────────┘

7.3 网页端直接编辑文件

你不需要在本地安装任何编辑器,GitHub 网页端自带文件编辑功能。

编辑已有文件:

  1. 在文件列表中找到要编辑的文件(例如 README.md
  2. 点击文件名进入文件详情页
  3. 点击文件内容右上角的 铅笔图标(✏️ Edit this file)
  4. 进入在线编辑器,修改内容(支持 Markdown 实时预览)
  5. 滚动到页面底部,填写提交信息:
    • Commit message :简要说明你改了啥(例如 更新了安装说明
    • Extended description:详细说明(可选)
    • 选择 Commit directly to the main branch 或创建新分支
  6. 点击 Commit changes 保存

创建新文件:

  1. 在仓库主页面,点击 Add file 下拉菜单 → Create new file
  2. 在输入框中填写文件路径和名称(例如 docs/api.md,输入 docs/ 会自动创建文件夹)
  3. 在下方编辑器中写入文件内容
  4. 填写提交信息,点击 Commit changes

上传已有文件:

  1. 点击 Add fileUpload files
  2. 将文件从电脑文件夹拖拽到网页上,或点击选择文件
  3. 填写提交信息,点击 Commit changes

⚠️ 注意:网页端编辑适合小文件(配置文件、文档等)。对于大量代码文件或大型项目,建议使用 Git 命令行或 GitHub Desktop。

7.4 删除文件

  1. 进入要删除的文件详情页
  2. 点击右上角的 垃圾桶图标(Delete this file)
  3. 填写提交信息,点击 Commit changes

⚠️ 警告:删除文件后,该文件的所有历史版本仍然保存在 Git 历史中,可以从历史记录中恢复。但操作不可逆,建议删除前确认。

7.5 查看提交历史(Commit History)

每个文件的每一次修改都会被记录下来。

查看单个文件的修改历史:

  1. 进入文件详情页
  2. 点击右上角的 History 按钮
  3. 你会看到该文件的所有历史版本,点击任意一个可以查看当时的完整内容

查看整个仓库的提交历史:

  1. 在仓库主页面,点击文件列表上方的 N commits(N 是提交次数)
  2. 或者直接访问 github.com/用户名/仓库名/commits/main

在提交历史页面中,你可以看到:

  • 每次提交的哈希值(一串字母数字)
  • 提交信息
  • 提交时间
  • 提交者头像

点击任意一次提交,可以查看这次提交修改了哪些文件、具体改了什么内容(绿色表示增加的行,红色表示删除的行)。


8. GitHub 网页版 Issue 与 Project 基础

当你开始一个项目(尤其是多人协作的项目)时,单纯靠代码仓库是不够的。你需要一个地方来记录待办任务、报告 Bug、讨论功能。

GitHub 提供了两个工具来解决这个问题:Issues (问题追踪)和 Projects(项目看板)。

8.1 用 Issue 记录任务或 Bug

Issue 本质上是一个"任务单"或"问题单"。任何人都可以在公开仓库中创建 Issue(仓库管理员可以限制权限)。

创建 Issue:

  1. 点击仓库顶部的 Issues 标签页
  2. 点击绿色按钮 New issue
  3. 填写 Issue 表单:
字段 说明 示例
Title 简短的标题,一句话概括问题 登录页面在移动端显示错位
Description 详细描述(建议包含:复现步骤、预期结果、实际结果、截图) 见下方模板
Assignee 分配给谁处理(可选) 可以分配给协作者
Labels 分类标签(如 bugenhancementhelp wanted 常用标签见下方
Projects 关联到项目看板(可选) 下一节会讲
Milestone 里程碑(可选,用于版本规划) v1.0

推荐的 Issue 描述模板(Bug 类):

markdown 复制代码
## 问题描述
(清晰简洁地描述问题)

## 复现步骤
1. 打开 xxx 页面
2. 点击 xxx 按钮
3. 出现 xxx 错误

## 预期行为
(正常情况下应该发生什么)

## 实际行为
(实际发生了什么)

## 截图
(如果有,请粘贴截图)

## 环境信息
- 操作系统:Windows 11
- 浏览器:Chrome 120
- 项目版本:v2.1.0

常用的 Labels 标签:

标签名称 颜色 含义
bug 红色 这是一个 Bug
enhancement 绿色 这是一个新功能建议
documentation 蓝色 文档相关的问题
good first issue 紫色 适合新手的入门任务
help wanted 黄色 需要社区帮助
question 灰色 这是一个疑问,不是 Bug
duplicate 黑色 与已有 Issue 重复

💡 学习建议:多去看看知名开源项目的 Issues 页面,观察它们如何组织、分类和回复 Issue。这是学习项目管理的好方法。

8.2 用 Projects(看板)进行简单项目管理

GitHub Projects 是一个类似 Trello 的看板工具,可以帮助你可视化地管理任务。

创建 Project:

  1. 点击仓库顶部的 Projects 标签页
  2. 点击 New project
  3. 选择模板:
    • Board:经典的三列看板(待办 / 进行中 / 已完成)
    • Roadmap:时间线视图(适合规划版本)
    • Table:表格视图(类似 Excel)

最常用的是 Board 模板,创建后你会看到三列:

列名 含义
Todo 待办任务
In Progress 正在进行的任务
Done 已完成的任务

添加任务到看板:

  1. 点击某一列的 + Add item
  2. 输入任务标题,按回车
  3. 点击任务卡片,可以添加更详细的信息(描述、Assignee、截止日期等)

将 Issue 关联到 Project:

  • 在创建或编辑 Issue 时,从右侧的 Projects 下拉菜单中选择对应的 Project
  • 该 Issue 会自动出现在看板的对应列中

💡 实用场景:即使你是一个人在做项目,Projects 也是一个很好的自我管理工具。把你想做的功能、修 Bug 的任务都写在看板上,完成一个拖一个,非常有成就感。

8.3 关闭与重新打开 Issue

当 Issue 描述的问题被解决后,可以关闭它。

关闭 Issue:

  • 进入 Issue 详情页
  • 滚动到底部,点击 Close issue 按钮

重新打开 Issue:

  • 在已关闭的 Issue 详情页中,点击 Reopen issue 按钮

💡 自动关闭技巧 :当你的 Pull Request 被合并时,如果在 PR 描述中写了 Closes #123(123 是 Issue 编号),GitHub 会自动关闭对应的 Issue。这个技巧非常实用,我们会在第四部分详细讲解。


第三部分小结

在第三部分中,你学会了:

  • ✅ 在网页端创建新仓库,理解 README、.gitignore、许可证的作用
  • ✅ 熟悉仓库页面的核心区域布局
  • 在网页端编辑、创建、上传、删除文件
  • ✅ 查看提交历史,追溯每次修改
  • ✅ 使用 Issues 记录任务和 Bug
  • ✅ 使用 Projects 看板管理项目进度

现在,你已经可以用纯网页操作来管理一个完整的项目了。

但是,网页端也有它的局限性------当项目变大、需要多人协作时,你还是需要 Git 命令来完成更复杂的操作(如分支合并、冲突解决、批量提交等)。


第四部分:本地与远程协作

前面三部分我们主要停留在 GitHub 网页端。对于简单的文档编辑、单个文件修改,网页端完全够用。

但是,当你开始写真正的项目代码时(尤其是多人协作的场景),网页端就会显得力不从心:

  • 无法批量修改多个文件
  • 没有本地编辑器的语法高亮、自动补全、调试功能
  • 无法离线工作
  • 无法处理复杂的合并冲突

这时候,就需要 Git 命令行 上场了。

第四部分将带你完成从"纯网页用户"到"本地 + 远程协作用户"的转变。我们会学习最核心的 Git 命令,并完整走一遍 Fork → Clone → 本地修改 → Push → Pull Request 的全流程。

💡 本部分只覆盖最常用的命令,更多进阶内容请参考附录 B 的学习资源。


9. Git 基础命令 + 网页端联动

9.1 安装 Git

在使用 Git 命令之前,你需要在本地电脑上安装 Git。

Windows:

  1. 访问 git-scm.com/downloads
  2. 下载 Windows 版本并安装(一路默认选项即可)
  3. 安装完成后,在开始菜单中找到 Git Bash(推荐使用这个终端)

macOS:

  • 方法一:在终端中输入 git --version,如果没有安装,系统会自动提示安装
  • 方法二:使用 Homebrew:brew install git

Linux (Ubuntu/Debian):

bash 复制代码
sudo apt update
sudo apt install git

验证安装成功:

打开终端(或 Git Bash),输入:

bash 复制代码
git --version

如果显示类似 git version 2.40.0 的信息,说明安装成功。

9.2 配置 Git 用户信息

Git 的每一次提交都会记录作者信息。你需要先告诉 Git 你是谁。

bash 复制代码
git config --global user.name "你的名字"
git config --global user.email "你的邮箱"

示例:

bash 复制代码
git config --global user.name "Zhang San"
git config --global user.email "zhangsan@example.com"

⚠️ 注意:邮箱地址建议和 GitHub 账号注册邮箱保持一致,这样你的提交记录才能正确关联到你的 GitHub 账号。

查看当前配置:

bash 复制代码
git config --list

9.3 克隆仓库到本地

Clone(克隆) 的意思是把 GitHub 上的远程仓库完整地复制到你的本地电脑上。

操作步骤:

  1. 打开你想要克隆的仓库页面(例如你自己的某个仓库,或者别人的公开仓库)
  2. 点击绿色的 <> Code 按钮
  3. 选择 HTTPS 标签(推荐),复制显示的 URL(类似 https://github.com/用户名/仓库名.git
  4. 在本地终端中,进入你想要存放代码的目录,然后执行:
bash 复制代码
git clone https://github.com/用户名/仓库名.git

执行后,Git 会在当前目录下创建一个以仓库名为名称的文件夹,并把所有代码和历史记录下载下来。

示例:

bash 复制代码
cd ~/Desktop
git clone https://github.com/octocat/Hello-World.git

9.4 Git 工作区概念(理解这个很重要)

在学习具体命令之前,先理解 Git 的三个区域:

复制代码
┌─────────────┐     git add     ┌─────────────┐    git commit    ┌─────────────┐
│  工作区      │ ──────────────> │  暂存区      │ ───────────────> │  本地仓库    │
│ (Working    │                 │ (Staging    │                  │ (Repository)│
│  Directory) │                 │  Area)      │                  │             │
└─────────────┘                 └─────────────┘                  └─────────────┘
                                                                        │
                                                                   git push
                                                                        ▼
                                                                  ┌─────────────┐
                                                                  │  远程仓库    │
                                                                  │  (GitHub)   │
                                                                  └─────────────┘
区域 说明 类比
工作区 你电脑上看到的文件目录,可以随意修改 你的办公桌
暂存区 临时存放你准备提交的修改 文件筐(放好准备归档的文件)
本地仓库 Git 记录的所有版本历史(在你电脑上) 档案柜
远程仓库 GitHub 服务器上的版本 云备份

9.5 核心命令:status / add / commit / push / pull

git status ------ 查看当前状态

任何时候,如果你不确定当前处于什么状态,输入这个命令准没错。

bash 复制代码
git status

它会告诉你:

  • 当前在哪个分支
  • 有哪些文件被修改了但还没暂存
  • 有哪些文件已经暂存但还没提交
git add ------ 添加到暂存区

当你修改了文件后,需要告诉 Git"我要把这个修改纳入下一次提交"。

bash 复制代码
# 添加单个文件
git add 文件名

# 添加所有修改的文件(注意点号)
git add .
git commit ------ 提交到本地仓库

把暂存区的所有修改打包成一个版本快照,并附上提交信息。

bash 复制代码
git commit -m "这里写你的提交说明"

提交信息的规范:

  • 用中文或英文都可以,但团队内要统一
  • 第一行简短概括(不超过 50 个字符)
  • 用动词开头,如 添加修复更新

示例:

bash 复制代码
git commit -m "修复了登录页面的按钮样式问题"
git push ------ 推送到远程仓库

把本地仓库的提交记录上传到 GitHub。

bash 复制代码
git push

如果是第一次推送,可能需要指定远程分支:

bash 复制代码
git push -u origin main

-u 会建立关联,以后直接 git push 即可)

git pull ------ 拉取远程更新

如果远程仓库有别人提交的新代码,你需要先拉取到本地。

bash 复制代码
git pull

这个命令相当于 git fetch + git merge,会把远程的新提交合并到你当前分支。

9.6 一个完整的本地修改工作流

假设你已经在本地克隆了一个仓库,现在想要修改一个文件并推送到 GitHub:

bash 复制代码
# 1. 确保本地仓库是最新的(如果多人协作)
git pull

# 2. 修改文件(用你的编辑器,比如 VS Code)

# 3. 查看修改了哪些文件
git status

# 4. 把修改添加到暂存区
git add 修改的文件名
# 或者添加所有修改
git add .

# 5. 再次查看状态,确认暂存区内容
git status

# 6. 提交到本地仓库
git commit -m "添加了用户资料页面"

# 7. 推送到 GitHub
git push

完成!现在去 GitHub 网页上刷新你的仓库,应该能看到新提交的内容了。

9.7 在网页上查看提交记录和分支网络图

当你执行完 git push 后,可以在 GitHub 网页端看到刚才的提交:

  1. 进入你的仓库页面
  2. 点击 N commits(N 是提交次数)
  3. 你会看到所有提交记录,最新的在最上面

查看分支网络图(可视化分支结构):

  • 进入仓库页面
  • 点击 Insights 标签页
  • 选择 Network(网络图)

你会看到一个类似地铁线路图的界面,每个节点是一次提交,不同的颜色代表不同的分支。这是理解分支和合并的最佳可视化工具。


10. 分支与 Pull Request(网页端为核心)

分支(Branch)是 Git 最强大的特性之一。它让你可以在不影响主代码的情况下,独立开发新功能或修复 Bug。

10.1 为什么要用分支?

假设你正在开发一个网站,突然收到一个紧急 Bug 需要修复。如果没有分支,你可能需要:

  • 停下手中的工作
  • 小心翼翼地备份当前代码
  • 修复 Bug 后,再把之前的代码恢复

有了分支,你可以:

  • 从主分支(main)拉出一个 bugfix 分支
  • bugfix 分支上修复 Bug
  • 测试通过后,合并回 main
  • 然后继续在原来的分支上开发新功能

互不干扰,并行工作。

10.2 在网页上创建分支

GitHub 网页端也支持分支操作,非常简单:

  1. 进入仓库页面
  2. 点击左上角的分支下拉菜单(默认显示 main
  3. 在文本框中输入新分支名称(例如 feature-add-login
  4. 点击 Create branch: xxx

现在你就有了一个新的分支。在这个分支上的所有修改,都不会影响 main 分支。

10.3 在本地创建和切换分支

网页端创建分支后,可以用命令行在本地切换:

bash 复制代码
# 拉取远程分支信息到本地
git fetch

# 切换到新分支
git checkout feature-add-login

# 或者用新版命令
git switch feature-add-login

一条命令创建并切换:

bash 复制代码
git checkout -b 新分支名

查看所有分支:

bash 复制代码
git branch          # 本地分支
git branch -r       # 远程分支
git branch -a       # 所有分支(本地+远程)

10.4 Pull Request 完整流程(全程网页操作)

Pull Request(简称 PR)是 GitHub 协作的核心机制。它的本质是:你请求别人把你分支上的修改,合并到另一个分支(通常是 main

下面我们走一遍完整的 PR 流程,全程不需要离开浏览器

场景假设

你发现了一个开源项目(假设地址是 github.com/example/project)有一个小 Bug,你想要修复它并提交给项目作者。

步骤 1:Fork 项目
  1. 打开原项目页面
  2. 点击右上角的 Fork 按钮
  3. 选择你的账号作为目标位置

现在你的账号下有了一个完全相同的副本:github.com/你的用户名/project

步骤 2:在网页上修改文件
  1. 进入你 Fork 后的仓库(github.com/你的用户名/project
  2. 找到需要修改的文件
  3. 点击铅笔图标 ✏️ 进入编辑模式
  4. 修改代码
  5. 滚动到页面底部,填写提交信息
  6. 重要 :选择 Create a new branch for this commit ,输入分支名(例如 fix-typo
  7. 点击 Commit changes
步骤 3:发起 Pull Request

修改完成后,GitHub 会自动提示:

"Your branch is xx commits ahead of example:main"

同时会出现一个绿色的 Compare & pull request 按钮。

  1. 点击这个按钮(或者进入 Pull Requests 标签页 → New pull request)
  2. 确认对比分支:base: example/maincompare: 你的用户名/fix-typo
  3. 填写 PR 表单:
字段 说明 示例
Title 简短标题 修复 README 中的拼写错误
Description 详细描述,说明你改了啥、为什么改 见下方模板
Reviewers 请求特定的人来审查(可选) 可以留空
Assignees 分配给谁处理(可选) 可以留空
Labels 添加标签(如 bug 可选
Linked issues 关联 Issue(写 Closes #123 如果有相关 Issue 可以填

推荐的 PR 描述模板:

markdown 复制代码
## 修改内容
- 修复了 README.md 第 23 行的拼写错误:`intall` → `install`

## 原因
这个拼写错误可能会误导新手用户

## 测试
- 仅文档修改,无需测试

## 关联 Issue
Closes #456
  1. 点击 Create pull request
步骤 4:等待审查与合并

提交 PR 后:

  • 项目维护者会收到通知
  • 他们可能会在你的 PR 下评论、提出修改建议
  • 如果需要修改,你可以在本地或网页上继续 push 新的提交,PR 会自动更新
  • 审查通过后,维护者会点击 Merge pull request 按钮,把你的修改合并到主分支
步骤 5:PR 合并后同步你的 Fork

PR 被合并后,你 Fork 的仓库就和原仓库不一致了。为了下次贡献,需要同步:

bash 复制代码
# 添加原仓库作为上游(只需执行一次)
git remote add upstream https://github.com/example/project.git

# 拉取上游的最新代码
git pull upstream main

# 推送到你自己的 Fork
git push origin main

也可以在网页上操作:进入你 Fork 的仓库 → 点击 Sync fork 按钮 → Update branch

10.5 在网页上进行 Code Review

如果你有自己的项目,或者你被邀请作为某个项目的协作者,你可能需要审查别人提交的 PR。

在网页上审查 PR 的步骤:

  1. 进入仓库的 Pull Requests 标签页
  2. 点击某个待审查的 PR
  3. 点击 Files changed 标签页
  4. 浏览修改的文件:
    • 绿色背景:新增的行
    • 红色背景:删除的行
  5. 鼠标悬停在行号上,会出现 + 号按钮,点击可以对某一行添加评论
  6. 审查完毕后,点击右上角的 Review changes
    • Comment:只评论,不表态
    • Approve:同意合并
    • Request changes:要求修改后再合并
  7. 填写总体评论,点击 Submit review

10.6 关闭 Issue 与 PR 的关联

这是一个非常实用的小技巧:在 PR 描述中写 Closes #Issue编号,当这个 PR 被合并时,GitHub 会自动关闭对应的 Issue。

示例:

复制代码
Closes #123

你也可以同时关闭多个 Issue:

复制代码
Closes #123, #456, #789

这个技巧被广泛使用,建议养成习惯。


第四部分小结

在第四部分中,你学会了:

  • ✅ 安装和配置 Git
  • ✅ 理解工作区、暂存区、本地仓库、远程仓库的概念
  • ✅ 核心命令:clonestatusaddcommitpushpull
  • ✅ 在网页端和本地创建、切换分支
  • ✅ 完整的 Fork → 修改 → 发起 PR → 合并 流程
  • ✅ 在网页上进行 Code Review
  • ✅ 使用 Closes #Issue号 自动关联 Issue

现在,你已经具备了参与开源项目的基本能力。你可以去 GitHub 上找一些 good first issue 标签的任务,开始你的第一次开源贡献了。


第五部分:进阶网页功能

掌握了基础操作和协作流程之后,是时候探索 GitHub 更强大的功能了。

第五部分将介绍三个非常实用的进阶功能:

  • GitHub Pages:免费托管个人网站或项目文档
  • GitHub Actions:自动化执行任务(测试、部署等)
  • GitHub Insights:查看项目的健康度数据

这些功能全部可以通过 GitHub 网页端完成,不需要复杂的配置。


11. GitHub Pages 网页端配置

11.1 什么是 GitHub Pages?

GitHub Pages 是 GitHub 提供的免费静态网站托管服务。你只需要把 HTML、CSS、JavaScript 文件推送到仓库,GitHub 就会自动生成一个网站,访问地址为:

复制代码
https://你的用户名.github.io/仓库名/

特殊用法 :如果你创建一个名为 你的用户名.github.io 的仓库,那么这个仓库会成为你的用户站点 ,访问地址就是 https://你的用户名.github.io/

GitHub Pages 适合做什么?

用途 示例
个人博客 使用 Jekyll、Hexo、Hugo 等静态博客生成器
项目文档 为开源项目搭建在线文档
作品集网站 展示你的作品和简历
前端 Demo 部署一个 Vue/React 小应用
在线简历 一份精美的 HTML 简历

⚠️ 注意:GitHub Pages 只支持静态文件(HTML/CSS/JS),不支持后端语言(PHP、Python、Node.js 等)。但你可以通过 JavaScript 调用外部 API 来实现动态功能。

11.2 开启 GitHub Pages(网页端操作)

方法一:从仓库设置中开启

  1. 进入你想要发布为网站的仓库
  2. 点击顶部的 Settings(设置)标签页
  3. 在左侧菜单中,点击 Pages(通常在 Code and automation 分类下)
  4. Branch 区域:
    • 选择分支(通常选 mainmaster
    • 选择文件夹(/ (root) 表示根目录,或者 /docs 文件夹)
  5. 点击 Save
  6. 等待 1-2 分钟,页面会刷新并显示你的网站地址(类似 https://你的用户名.github.io/仓库名/

方法二:使用快速模板(初学者推荐)

如果你只是想快速体验一下,GitHub 提供了现成的模板:

  1. 在仓库页面,点击 Add fileCreate new file
  2. 文件名输入 index.html
  3. 粘贴以下简单代码:
html 复制代码
<!DOCTYPE html>
<html>
<head>
    <title>我的第一个 GitHub Pages 网站</title>
</head>
<body>
    <h1>Hello, GitHub Pages!</h1>
    <p>这是我的第一个静态网站 🎉</p>
</body>
</html>
  1. 提交后,按上述方法开启 Pages,就能看到你的网站了。

11.3 为项目文档启用 Pages(/docs 文件夹方式)

很多开源项目会在仓库根目录下创建一个 /docs 文件夹,专门存放文档网站。这样可以让代码和文档在同一个仓库里,互不干扰。

操作步骤:

  1. 在你的仓库中创建 docs 文件夹
  2. docs 文件夹中放入你的文档文件(可以是 HTML,或者 Markdown + Jekyll)
  3. 进入 Settings → Pages
  4. 在 Branch 中,选择分支(如 main),然后选择文件夹 /docs
  5. 点击 Save

现在访问 https://你的用户名.github.io/仓库名/ 就会展示 docs 文件夹下的内容。

11.4 自定义域名(可选)

如果你有自己的域名(如 www.yourname.com),可以绑定到 GitHub Pages。

步骤概览:

  1. 在仓库的 Settings → Pages 中,在 Custom domain 输入框中填写你的域名(如 www.yourname.com
  2. 保存后,GitHub 会在仓库根目录自动生成一个 CNAME 文件
  3. 前往你的域名服务商(如阿里云、腾讯云、GoDaddy),添加 DNS 记录:
    • 类型:CNAME
    • 主机记录www(或 @ 表示根域名)
    • 记录值你的用户名.github.io
  4. 等待 DNS 生效(可能需要几分钟到几小时)

💡 温馨提示 :自定义域名绑定需要你拥有一个域名。如果只是学习和个人使用,GitHub 提供的 github.io 域名完全够用。

11.5 Jekyll 主题快速换肤

GitHub Pages 原生支持 Jekyll------一个静态网站生成器。你可以不用写 HTML/CSS,直接选一个主题就能拥有漂亮的网站。

操作步骤:

  1. 确保你的仓库根目录下有一个 _config.yml 文件(如果没有,可以自己创建一个)
  2. _config.yml 中添加一行:theme: jekyll-theme-主题名
  3. 或者更简单:进入 Settings → Pages,点击 Change theme,直接可视化选择主题

常用的 Jekyll 主题:

主题名 特点
minima 极简风格,适合博客
cayman 清爽的单页风格
hacker 程序员风格,深色背景
architect 适合项目文档
leap-day 带侧边栏的文档风格

💡 进阶建议:对于个人博客,很多人会使用 Hexo 或 Hugo 这类更强大的静态博客框架,然后部署到 GitHub Pages。这需要一些额外的配置,但可玩性更高。


12. GitHub Actions 入门(网页版 YAML 编辑)

12.1 什么是 GitHub Actions?

GitHub Actions 是 GitHub 内置的 CI/CD(持续集成/持续部署)工具。简单来说,它可以让你在 GitHub 上自动执行一些任务。

常见的自动化场景:

场景 说明
自动测试 每次 push 代码时,自动运行单元测试
自动部署 代码合并到 main 分支后,自动部署到服务器或 Pages
自动打包 每次发布新版本时,自动构建并上传到发布页
定时任务 每天定时运行某个脚本(如爬取数据)

🎁 免费额度:GitHub 对每个账号提供免费的 Actions 使用额度(公共仓库完全免费,私有仓库有每月 2000-3000 分钟的免费额度)。

12.2 认识 Workflow 文件

GitHub Actions 的自动化任务是通过 Workflow(工作流) 文件来定义的。这些文件存放在仓库的 .github/workflows/ 目录下,使用 YAML 格式编写。

一个 Workflow 文件的基本结构:

yaml 复制代码
# 工作流的名称
name: 我的第一个工作流

# 触发条件:什么时候运行
on:
  push:           # 当有 push 操作时
    branches: [main]   # 仅在 main 分支上触发

# 要执行的任务(可以有一个或多个)
jobs:
  my-job:         # 任务名称(可以自定义)
    runs-on: ubuntu-latest    # 运行环境
    steps:        # 这个任务包含哪些步骤
      - name: 第一步:打印信息
        run: echo "Hello from GitHub Actions!"

12.3 在网页上创建第一个 Actions 工作流

我们来创建一个最简单的例子:每次你 push 代码到 main 分支时,自动打印一条信息。

操作步骤:

  1. 进入你的仓库
  2. 点击 Actions 标签页
  3. 点击 New workflow 按钮(或者直接跳过,手动创建文件)
  4. 点击 set up a workflow yourself(自己创建工作流)
  5. GitHub 会自动在 .github/workflows/ 下创建一个 main.yml 文件,并打开在线编辑器
  6. 将内容替换为:
yaml 复制代码
name: Hello GitHub Actions

on:
  push:
    branches: [main]

jobs:
  say-hello:
    runs-on: ubuntu-latest
    steps:
      - name: 打印欢迎信息
        run: echo "Hello, GitHub Actions! 代码已推送到 main 分支"
  1. 点击右上角的 Commit changes (可以写提交信息如 添加第一个 Actions 工作流
  2. 提交后,GitHub 会自动运行这个工作流
  3. 进入 Actions 标签页,点击刚刚运行的工作流,可以看到输出结果

12.4 实用案例:自动部署到 GitHub Pages

这是一个非常实用的工作流:当你 push 代码到 main 分支时,自动构建并部署到 GitHub Pages。

操作步骤:

  1. .github/workflows/ 下创建一个文件(例如 deploy.yml
  2. 写入以下内容:
yaml 复制代码
name: 自动部署到 GitHub Pages

on:
  push:
    branches: [main]

jobs:
  deploy:
    runs-on: ubuntu-latest
    permissions:
      contents: read
      pages: write
      id-token: write
    
    steps:
      - name: 检出代码
        uses: actions/checkout@v4
      
      - name: 配置 Pages
        uses: actions/configure-pages@v4
      
      - name: 上传产物
        uses: actions/upload-pages-artifact@v3
        with:
          path: '.'   # 上传整个仓库根目录
      
      - name: 部署到 Pages
        uses: actions/deploy-pages@v4
  1. 提交文件
  2. 确保你已经开启了 GitHub Pages(Settings → Pages → Source 选 "GitHub Actions")
  3. 之后每次 push 代码,都会自动部署

💡 小提示 :如果你的项目需要构建步骤(比如 React 项目需要 npm run build),你需要在 "检出代码" 之后添加构建步骤。

12.5 使用官方预置模板

GitHub 提供了很多预置的 Workflow 模板,覆盖了常见的场景。

如何使用模板:

  1. 进入仓库的 Actions 标签页
  2. 在 "Recommended for this repository" 区域,或者搜索框下方的模板列表中,选择一个模板
  3. 常用的模板包括:
    • Simple workflow:最简单的入门模板
    • Node.js:为 Node.js 项目自动运行测试
    • Python package:为 Python 项目自动运行测试和打包
    • Static HTML:为静态网站部署到 Pages
  4. 点击模板右侧的 Configure 按钮
  5. 根据需要修改配置(比如调整 Node 版本、添加环境变量等)
  6. 点击 Commit changes

12.6 查看工作流运行状态

  • 进入仓库的 Actions 标签页,可以看到所有工作流的运行历史
  • 每个运行都有一个状态图标:✅ 成功、❌ 失败、⏳ 进行中、⚠️ 取消
  • 点击某个运行,可以看到详细的执行日志
  • 如果某个步骤失败了,日志中会显示红色的错误信息,方便你排查问题

13. GitHub Insights 看懂项目数据

13.1 什么是 GitHub Insights?

Insights(洞察)是 GitHub 提供的项目数据分析工具。它可以帮你了解项目的健康度、活跃度、贡献者情况等。

如何进入: 在仓库页面,点击顶部的 Insights 标签页。

13.2 核心数据面板

Contributors(贡献者)
  • 显示所有为这个仓库提交过代码的人
  • 按提交次数排序
  • 点击某个贡献者,可以看到他/她的所有提交记录

使用场景:了解谁是这个项目的核心贡献者,或者寻找可以请教的人。

Traffic(流量)
  • Views:仓库页面的被查看次数
  • Unique visitors:独立访客数
  • Clones:仓库被克隆的次数

使用场景:了解你的项目有多受欢迎,哪些时段访问量最高。

⚠️ 注意:Traffic 数据只对仓库管理员可见。

Forks(复刻网络)
  • 显示这个仓库被 Fork 到了哪些账号
  • 以网络图的形式展示

使用场景:了解你的项目被哪些人/组织 Fork 了,或者找出某个 Fork 中的有趣改动。

Actions(操作记录)
  • 显示最近的工作流运行记录
  • 与 Actions 标签页类似,但在 Insights 中有更简洁的展示
Pulse(脉冲)
  • 显示最近一段时间内的活动摘要
  • 包括:新提交数、新 Issue 数、新 PR 数、新贡献者数

使用场景:快速了解项目近期的活跃程度。如果 Pulse 长时间是平的,说明项目可能停滞了。

13.3 查看 Star 历史

Star 数量的增长曲线是衡量项目受欢迎程度的重要指标。

查看方法:

  1. 进入仓库的 Insights 标签页
  2. 点击左侧的 Community(有些版本在 "Star history" 或者第三方的图表中)
  3. GitHub 原生提供的功能比较基础,推荐使用第三方工具:
    • Star History :访问 star-history.com,输入仓库地址,可以获得漂亮的折线图
    • GitHub Stars Chart:浏览器插件

如何解读 Star 历史:

  • 平稳增长:说明项目持续受欢迎
  • 突然暴涨:可能是因为某个新闻/活动/版本发布导致的
  • 长期停滞:项目可能已经不再维护,或者领域热度下降

13.4 社区健康度检查

GitHub 会为仓库提供一个 Community Standards(社区标准)评分,检查以下几个方面:

检查项 说明 建议
README 是否有 README 文件 ✅ 必须有
LICENSE 是否有开源许可证 ✅ 开源项目必须有
CODE_OF_CONDUCT 是否有行为准则 推荐大型项目添加
CONTRIBUTING 是否有贡献指南 推荐多人协作项目添加
Issue templates 是否有 Issue 模板 推荐
PR templates 是否有 PR 模板 推荐

查看方法: Insights → Community

如果你的仓库缺少某些文件,GitHub 会在这一页给出提示,并附上创建模板的快捷入口。


第五部分小结

在第五部分中,你学会了:

  • ✅ 使用 GitHub Pages 免费托管静态网站
  • ✅ 绑定自定义域名(可选)
  • ✅ 了解 GitHub Actions 的基本概念
  • ✅ 创建第一个自动化工作流
  • ✅ 使用预置模板实现自动部署
  • ✅ 通过 Insights 查看项目数据(贡献者、流量、Star 历史、社区健康度)

现在,你已经掌握了 GitHub 的绝大多数核心功能。从基础的仓库管理,到协作流程,再到进阶的自动化和数据分析,你已经具备了独立使用 GitHub 的全部能力。


第六部分:个人成长与开源参与

通过前面五个部分的学习,你已经掌握了 GitHub 的核心操作:从创建仓库、网页端编辑,到分支管理、Pull Request 协作,再到 Pages 建站和 Actions 自动化。

但 GitHub 的价值远不止于工具本身。对于开发者来说,GitHub 还是一个个人品牌展示窗口通往开源世界的入口

第六部分将教你:

  • 如何打造一个有吸引力的 GitHub 主页
  • 如何写出让人眼前一亮的好 README
  • 如何迈出参与开源的第一步
  • 如何利用 GitHub 持续学习和成长

14. 维护自己的 GitHub 主页

你的 GitHub 主页(github.com/你的用户名)是你在技术世界里的名片。很多面试官、技术同行、开源项目维护者在了解你之前,会先看你的 GitHub 主页。

一个优秀的 GitHub 主页应该具备以下特征:

  • 信息完整:让人知道你是谁、做什么技术
  • 有亮点:展示你最得意的项目
  • 保持活跃:定期有绿色格子(贡献记录)

14.1 定期更新 Pin 项目

Pin(置顶)功能让你可以把最重要的项目展示在主页最显眼的位置。

什么样的项目值得 Pin?

类型 说明 示例
个人代表作 你投入最多心血的项目 一个自己写的框架、工具库
学习项目 展示你在某个技术领域的学习成果 用 React + Node 写的全栈项目
开源贡献 你参与过的知名项目 给 React 提过 PR(哪怕是文档修改)
常用工具 你日常使用的工具,说明你的技术栈 比如你 Pin 了一个 Python 爬虫项目

操作步骤:

  1. 进入你的个人主页
  2. 点击 "Popular repositories" 区域右侧的 Customize your pins
  3. 从下拉列表中选择仓库(最多 6 个)
  4. 点击 Save

💡 建议:Pin 项目不是一次性的。当你完成了一个新项目,可以替换掉旧项目。保持展示的内容是最新、最能代表你当前水平的。

14.2 撰写高质量 README(项目级)

每个仓库的 README.md 文件是访客最先看到的内容。一个好的 README 能让人快速了解你的项目,甚至产生使用的兴趣。

一个高质量 README 应该包含以下要素:

markdown 复制代码
# 项目名称

[徽章区域](可选,但推荐)

> 一句 slogan 或简短描述

## ✨ 特性
- 特性1:用一两句话说明
- 特性2:用一两句话说明
- 特性3:用一两句话说明

## 📸 截图(可选)
(如果有 UI,放一张截图效果最好)

## 🚀 快速开始

### 安装
```bash
npm install your-project

使用

javascript 复制代码
import yourProject from 'your-project'

// 示例代码

📖 文档

详细文档请访问:[链接]

🤝 贡献

欢迎贡献!请阅读 CONTRIBUTING.md

📄 许可证

MIT © 你的名字

复制代码
**关于徽章(Badges):**

徽章是小图标,通常放在 README 顶部,用于快速展示项目状态。常用徽章包括:

| 徽章 | 含义 | 示例 |
|------|------|------|
| 构建状态 | 表示 CI 是否通过 | ![build passing](https://img.shields.io/badge/build-passing-brightgreen) |
| 许可证 | 开源协议类型 | ![MIT](https://img.shields.io/badge/license-MIT-blue) |
| 版本 | 当前版本号 | ![version](https://img.shields.io/badge/version-1.0.0-blue) |
| 下载量 | npm/pip 下载数 | ![downloads](https://img.shields.io/badge/downloads-1k/month-brightgreen) |

**生成徽章的工具:** [shields.io](https://shields.io/)

### 14.3 使用 Profile README 展示技能、博客、统计

还记得我们在第一部分提到的**同名仓库 README** 吗?这是一个展示你自己的绝佳位置。

**一个优秀的 Profile README 可以包含:**

```markdown
## 👋 你好,我是张三

[![Twitter](https://img.shields.io/badge/Twitter-@zhangsan-blue)](https://twitter.com/zhangsan)
[![Blog](https://img.shields.io/badge/Blog-zhangshan.dev-red)](https://zhangshan.dev)

### 💻 技术栈

![JavaScript](https://img.shields.io/badge/-JavaScript-F7DF1E?logo=javascript&logoColor=black)
![TypeScript](https://img.shields.io/badge/-TypeScript-3178C6?logo=typescript&logoColor=white)
![React](https://img.shields.io/badge/-React-61DAFB?logo=react&logoColor=black)
![Node.js](https://img.shields.io/badge/-Node.js-339933?logo=node.js&logoColor=white)

### 📊 GitHub 统计

![张三的 GitHub 统计](https://github-readme-stats.vercel.app/api?username=zhangsan&show_icons=true&theme=default)

### 📝 最新博客

- [如何写出好的 README](https://zhangshan.dev/posts/good-readme)
- [GitHub Actions 入门指南](https://zhangshan.dev/posts/github-actions)

### 🔭 正在做

- 开发一个 TODO 应用
- 学习 Rust 语言

常用的 Profile README 增强工具:

工具 功能 链接
github-readme-stats 生成 GitHub 统计卡片 github.com/anuraghazra/github-readme-stats
github-profile-trophy 生成成就奖杯 github.com/ryo-ma/github-profile-trophy
activity-graph 生成贡献活动图 github.com/Ashutosh00710/github-readme-activity-graph
skill-icons 技术栈图标 github.com/tandpfun/skill-icons

⚠️ 注意:Profile README 不是简历,不要太严肃。加点 emoji、写点有趣的个人介绍,会让人感觉更亲切。


15. 参与开源的第一步

很多人觉得参与开源很难,需要非常厉害的技术。其实不然。

参与开源的方式有很多种,不一定要写核心代码:

贡献类型 难度 适合人群
修复文档错别字 ⭐ 极低 所有人
翻译文档 ⭐⭐ 低 有外语能力的人
报告 Bug ⭐⭐ 低 会用某个项目的人
回答 Issue 中的问题 ⭐⭐ 低 有一定经验的人
编写测试用例 ⭐⭐⭐ 中 有一定编程基础的人
修复小 Bug ⭐⭐⭐ 中 熟悉项目代码的人
开发新功能 ⭐⭐⭐⭐ 高 有经验的开发者

对于第一次参与开源的人来说,强烈建议从文档修复或报告 Bug 开始。

15.1 找 good first issuehelp wanted 标签

很多开源项目会特意为新手标记出适合首次参与的任务。

如何找到这些任务:

  1. 进入一个你感兴趣的开源项目
  2. 点击 Issues 标签页
  3. 在搜索框中输入:label:"good first issue"label:"help wanted"
  4. 也可以组合搜索:label:"good first issue" language:python

GitHub 官方的新手任务平台:

  • GitHub Explore → Topics → good-first-issuegithub.com/topics/good-first-issue
  • Good First Issue 网站goodfirstissue.dev(按语言和难度筛选)

15.2 完全在网页上完成的开源贡献流程

假设你找到了一个文档错别字,想要修复。以下是全程不需要离开浏览器的完整流程:

步骤 1:确认没有重复的 Issue

  • 在 Issues 中搜索关键词,看看是否已经有人提过同样的问题

步骤 2:Fork 项目

  • 点击项目右上角的 Fork 按钮

步骤 3:在网页上修改文件

  • 进入你 Fork 后的仓库
  • 找到需要修改的文件(例如 README.md
  • 点击铅笔图标 ✏️ 进入编辑模式
  • 修正错别字
  • 填写提交信息(如 fix typo: intall -> install
  • 重要 :选择 Create a new branch for this commit ,输入分支名(如 fix-typo
  • 点击 Commit changes

步骤 4:发起 Pull Request

  • GitHub 会自动出现 Compare & pull request 按钮,点击它

  • 填写 PR 标题和描述:

    复制代码
    ## 修改内容
    修复了 README.md 第 23 行的拼写错误:`intall` → `install`
    
    ## 原因
    这个拼写错误可能会误导新手用户
  • 点击 Create pull request

步骤 5:等待回应

  • 项目维护者会收到通知
  • 他们可能会感谢你并合并 PR
  • 也可能会提出修改建议(不要灰心,这是正常的)
  • 如果需要修改,继续在同一个分支上 push 新的提交即可

步骤 6:庆祝!

  • 你的 PR 被合并后,你就正式成为这个项目的贡献者了
  • 你的 GitHub 主页上会出现贡献记录

15.3 遵循项目的 CONTRIBUTING 指南

很多项目会在仓库根目录下放一个 CONTRIBUTING.md 文件,里面写明了贡献指南。

常见的内容包括:

  • 如何报告 Bug(需要提供哪些信息)
  • 如何提交代码(代码风格、测试要求)
  • PR 的标题格式
  • Commit message 的规范

一定要读! 遵循项目规范会让你的 PR 更容易被接受。

15.4 开源参与的心态建议

心态 建议
不要怕被拒绝 PR 被要求修改或被拒绝是正常的,这不是针对你个人
从小处着手 第一次贡献改一个错别字就很好,不用一上来就想改核心代码
保持耐心 维护者可能很忙,回复可能需要几天时间
礼貌沟通 开源社区靠的是志愿协作,礼貌和尊重很重要
学习比完成更重要 即使 PR 没被合并,你在过程中学到的东西也是收获

16. GitHub 学习资源与社区

16.1 GitHub 官方资源

资源 地址 说明
GitHub Blog github.blog 官方博客,了解新功能和技术动态
GitHub Universe githubuniverse.com 年度大会,录像在 YouTube 可看
GitHub Skills skills.github.com 交互式学习课程
GitHub Docs docs.github.com 官方文档(有中文版)
GitHub YouTube youtube.com/@GitHub 官方视频教程和发布会录像

16.2 关注技术大佬

GitHub 上有许多技术大佬,关注他们可以:

  • 在你的首页信息流中看到他们的动态(Star 了什么项目、发了什么 PR)
  • 了解他们正在关注的技术趋势

如何发现值得关注的人:

  1. 去一个你喜欢的开源项目(如 React、Vue、TensorFlow)
  2. 点击 InsightsContributors
  3. 看看提交最多的贡献者,点进他们的主页
  4. 如果觉得不错,点击 Follow

一些知名的 GitHub 用户(仅供参考):

用户名 简介
torvalds Linus Torvalds,Linux 之父
gaearon Dan Abramov,React 核心成员
sindresorhus 高产的开源贡献者,维护大量 JS 工具
yyx990803 Evan You,Vue.js 作者
TheAlgorithms 算法项目组织(关注其仓库)

💡 不要盲目关注很多人。关注 20-30 个真正活跃且你感兴趣的大佬,信息流质量会很高。

GitHub Trending 是发现新项目的最佳入口:

  • 地址:github.com/trending
  • 每天花 5-10 分钟浏览
  • 可以按语言(JavaScript、Python、Go 等)和时间(Today、Week、Month)筛选

为什么要看 Trending:

  • 了解当下最火的技术方向
  • 发现优质的新项目(很多项目刚发布时就会上 Trending)
  • 作为自己项目的参考(别人为什么火?README 怎么写?)

16.4 GitHub 社区参与

除了代码贡献,你还可以参与 GitHub 的社区活动:

活动 时间 说明
Hacktoberfest 每年 10 月 完成 4 个 PR 可以获得限量版 T 恤
GitHub Stars 全年 成为 GitHub 明星贡献者计划成员
GitHub Education 全年 学生可以免费获得 GitHub Pro 和 Copilot

第六部分小结

在第六部分中,你学会了:

  • ✅ 维护一个吸引人的 GitHub 主页(Pin 项目 + Profile README)
  • ✅ 撰写高质量 README,包含徽章、特性、快速开始等要素
  • ✅ 使用工具(github-readme-stats 等)增强 Profile README
  • ✅ 找到 good first issue 标签,迈出开源贡献第一步
  • ✅ 在网页上完成完整的 Fork → 修改 → PR 流程
  • ✅ 遵循 CONTRIBUTING 指南,了解开源参与的心态
  • ✅ 利用 GitHub 官方资源、关注大佬、Trending、社区活动 持续学习

现在,你已经具备了从零到一完整使用 GitHub 的能力。你可以去尝试:

  • 完善自己的 GitHub 主页
  • 找一个 good first issue 任务,完成第一次开源贡献
  • 用 GitHub Pages 搭建个人博客
  • 给自己的项目加上 Actions 自动化测试

第七部分:实战与避坑

通过前六个部分的学习,你已经掌握了 GitHub 从基础到进阶的几乎所有核心功能。但知识只有在实践中才能真正内化。

第七部分将分为两个章节:

  • 实战演练:从零开始完整走一遍"发现项目 → 贡献代码 → PR 合并"的全流程
  • 常见问题与避坑指南:汇总初学者最容易遇到的 10 个问题及解决方法

17. 实战演练:从零开始完成一个完整流程

本次实战演练的目标是:找到一个开源项目,修复一个文档中的错别字,并成功提交 Pull Request。

这是一个真实、安全、低门槛的首次贡献方式。几乎所有开源项目都有文档,而文档中的错别字是最容易发现和修复的问题。

17.1 选择一个目标项目

为了确保演练顺利,我们选择一个非常活跃且对新手友好的项目作为目标。

推荐项目: freeCodeCamp/freeCodeCamp(GitHub 上 Star 数最高的开源项目之一)

  • 项目地址:github.com/freeCodeCamp/freeCodeCamp
  • 为什么选它:
    • ✅ 非常活跃,维护者响应快
    • ✅ 有大量 good first issue 标签的任务
    • ✅ 文档完善,贡献指南清晰
    • ✅ 对新手非常友好

💡 你也可以选择自己熟悉的其他项目。原则是:项目活跃 + 有新手友好标签。

17.2 步骤 1:寻找可贡献的任务

  1. 打开 github.com/freeCodeCamp/freeCodeCamp
  2. 点击 Issues 标签页
  3. 在搜索框中输入:label:"good first issue"
  4. 浏览列表,找到一个你觉得可以处理的任务

新手友好的任务示例:

  • 修复文档中的拼写或语法错误
  • 修复损坏的链接
  • 添加代码示例的注释
  • 翻译某个页面的部分内容

选择一个任务后:

  • 在 Issue 下方留言 I'd like to work on this(我想处理这个)
  • 等待维护者分配给你(通常 1-2 天内)
  • 或者如果 Issue 没有被分配,可以直接开始工作

17.3 步骤 2:Fork 项目

  1. 回到项目主页面
  2. 点击右上角的 Fork 按钮
  3. 选择你的个人账号作为目标
  4. 等待 Fork 完成(几秒钟)

现在你的账号下有了一个项目副本:github.com/你的用户名/freeCodeCamp

17.4 步骤 3:Clone 到本地(或网页编辑)

这里提供两种方式,选择你习惯的即可。

方式 A:网页端编辑(适合小改动)

  1. 进入你 Fork 后的仓库
  2. 找到需要修改的文件
  3. 点击铅笔图标 ✏️ 编辑
  4. 修改完成后,选择 Create a new branch for this commit
  5. 输入分支名(如 fix-typo-in-readme
  6. 点击 Commit changes

方式 B:本地编辑(适合需要测试的改动)

打开终端,执行:

bash 复制代码
# 克隆你 Fork 的仓库到本地
git clone https://github.com/你的用户名/freeCodeCamp.git

# 进入项目目录
cd freeCodeCamp

# 创建新分支
git checkout -b fix-typo-in-readme

# 用编辑器修改文件(如 VS Code)
code .

# 修改完成后,提交
git add .
git commit -m "fix: 修复 README 中的拼写错误"

# 推送到你的 GitHub
git push origin fix-typo-in-readme

17.5 步骤 4:发起 Pull Request

  1. 回到 GitHub 网页,打开你 Fork 的仓库
  2. 页面顶部会提示 "fix-typo-in-readme had recent pushes",点击 Compare & pull request
  3. 确认对比分支:
    • base repository: freeCodeCamp/freeCodeCamphead repository: 你的用户名/freeCodeCamp
    • base: maincompare: fix-typo-in-readme
  4. 填写 PR 表单:

标题示例:

复制代码
fix(README): 修复拼写错误 'intall' → 'install'

描述示例:

markdown 复制代码
## 修改内容
修复了 README.md 第 23 行的拼写错误:`intall` → `install`

## 关联 Issue
Closes #12345(替换为实际 Issue 编号)
  1. 点击 Create pull request

17.6 步骤 5:等待审查与回应

提交 PR 后会发生什么:

可能的情况 你应该怎么做
CI 检查通过 等待维护者审查
CI 检查失败 点击 Details 查看失败原因,修复后重新 push
维护者要求修改 按照评论建议修改,然后 push 新提交(PR 会自动更新)
PR 被合并 🎉 恭喜!你正式成为贡献者了
PR 被关闭 不要气馁,询问原因,下次改进

17.7 步骤 6:同步你的 Fork

PR 被合并后,你的 Fork 仓库需要同步原仓库的最新代码:

方法一:命令行

bash 复制代码
# 添加原仓库为上游(只需一次)
git remote add upstream https://github.com/freeCodeCamp/freeCodeCamp.git

# 拉取最新代码
git pull upstream main

# 推送到你的 Fork
git push origin main

方法二:网页端

  1. 进入你 Fork 的仓库
  2. 点击 Sync fork 按钮
  3. 点击 Update branch

17.8 实战总结

恭喜你完成了首次开源贡献!在这个过程中,你实践了:

  • ✅ 使用 good first issue 标签找到适合新手的任务
  • ✅ Fork 开源项目到自己的账号
  • ✅ 在网页端或本地修改代码
  • ✅ 创建分支并提交修改
  • ✅ 发起 Pull Request 并填写规范的描述
  • ✅ 同步 Fork 与原仓库

第一次 PR 被合并的感觉是无价的。 这不仅是技术能力的证明,更是你正式成为开源社区一员的标志。


18. 常见问题与避坑指南

18.1 提交到了 main 分支怎么办?

问题: 你在自己的 Fork 仓库中,不小心直接提交到了 main 分支,而不是新建一个分支。

解决方法:

bash 复制代码
# 1. 在本地创建一个新分支(基于当前状态)
git branch my-feature

# 2. 将 main 分支回退到远程状态
git reset --hard origin/main

# 3. 切换到新分支
git checkout my-feature

# 4. 推送新分支到远程
git push origin my-feature

💡 预防措施 :养成习惯,永远不要在 main 分支上直接修改。每次修改前先 git checkout -b 新分支名

18.2 如何撤销最后一次 commit?

场景: 你刚提交了一个 commit,发现写错了提交信息,或者漏了一个文件。

方法一:重新提交(推荐)

bash 复制代码
# 修改文件后,重新 add
git add .

# --amend 会合并到上一次提交,而不是创建新提交
git commit --amend -m "新的提交信息"

# 强制推送(注意:只在个人分支上使用)
git push --force-with-lease

方法二:硬撤销(慎用)

bash 复制代码
# 撤销最后一次提交,但保留修改内容
git reset --soft HEAD~1

# 完全撤销,不保留任何修改(危险!)
git reset --hard HEAD~1

18.3 如何解决合并冲突?

场景: 当你执行 git pull 或发起 PR 时,提示有合并冲突。

解决方法(网页端):

  1. 在 PR 页面,如果显示 "This branch has conflicts",点击 Resolve conflicts

  2. GitHub 会打开冲突编辑器,显示类似以下内容:

    复制代码
    <<<<<<< HEAD
    这是你分支上的内容
    =======
    这是目标分支上的内容
    >>>>>>> main
  3. 手动编辑,删除 <<<<<<<=======>>>>>>> 标记,保留正确的代码

  4. 点击 Mark as resolved

  5. 点击 Commit merge

解决方法(命令行):

bash 复制代码
# 1. 拉取目标分支的最新代码
git fetch origin

# 2. 合并目标分支到当前分支
git merge origin/main

# 3. 如果提示冲突,用 git status 查看冲突文件
git status

# 4. 用编辑器打开冲突文件,手动解决
code 冲突文件路径

# 5. 解决后,标记为已解决并提交
git add .
git commit -m "解决合并冲突"
git push

18.4 不小心把敏感信息(API keys)提交了怎么办?

这是一个严重的问题! 敏感信息一旦提交,即使你后来删除了,它仍然存在于 Git 历史中。

立即执行以下步骤:

  1. 立即更换泄露的密钥(去对应的服务商重新生成)
  2. 从当前代码中删除敏感信息
  3. 提交并推送修复
bash 复制代码
# 如果你只是想在最近的提交中删除
git commit --amend
# 删除敏感信息后,重新提交
git push --force-with-lease
  1. 如果敏感信息已经存在于历史中的多个提交 ,需要使用 git filter-branchBFG Repo-Cleaner 工具重写历史。这个过程比较复杂,推荐使用 BFG:
bash 复制代码
# 安装 BFG(需要 Java)
# 下载地址:https://rtyley.github.io/bfg-repo-cleaner/

# 删除包含某个字符串的所有痕迹
java -jar bfg.jar --replace-text passwords.txt 你的仓库.git
  1. 强制推送到远程(通知所有协作者重新 clone)

⚠️ 预防措施

  • 永远不要在代码中硬编码密钥
  • 使用 .env 文件 + .gitignore 排除它
  • 使用 GitHub Secrets 存储 CI/CD 中的密钥
  • 提交前用 git diff 检查改动内容

18.5 PR 冲突无法在网页上解决怎么办?

场景: 网页上的冲突解决工具无法处理复杂的冲突(比如冲突区域太大或太多)。

解决方法: 在本地解决冲突,然后 push。

bash 复制代码
# 1. 确保当前分支是你的 PR 分支
git checkout 你的PR分支名

# 2. 拉取目标分支的最新代码
git fetch origin

# 3. 合并目标分支
git merge origin/main

# 4. 手动解决冲突(用 VS Code 或任何编辑器)
# 5. 标记已解决并提交
git add .
git commit -m "解决冲突"

# 6. 推送,PR 会自动更新
git push

18.6 Star 太多了,管理不过来怎么办?

问题: 随着时间推移,你 Star 了几百个项目,很难找到之前收藏的某个项目。

解决方法:

  1. 使用 Star 分类标签 :Star 时输入 #标签名
    • 例如:#machine-learning#react#awesome-list
  2. 使用浏览器插件
    • Astral:Chrome 扩展,增强 Star 管理
    • GitStar:项目管理工具
  3. 定期清理:每季度花 30 分钟,取消 Star 那些你不再需要的项目

18.7 Watch 了太多仓库,通知爆炸怎么办?

问题: 你 Watch 了几个大型项目(如 React、Vue),每天收到几百封邮件通知。

解决方法:

  1. 进入仓库页面
  2. 点击 Unwatch 下拉菜单
  3. 选择 Releases only (只接收版本发布通知)或 Not watching(完全不接收)

💡 推荐设置 :大多数情况下,选择 Releases only 就足够了。只有你真正参与贡献的项目才需要 Watching

18.8 Fork 的仓库如何更新到最新?

问题: 你 Fork 了一个项目,原项目更新了,你的 Fork 落后了。

解决方法(网页端):

  1. 进入你 Fork 的仓库
  2. 点击 Sync fork 按钮
  3. 点击 Update branch

解决方法(命令行):

bash 复制代码
# 添加原仓库为上游(只需一次)
git remote add upstream https://github.com/原用户/原仓库.git

# 拉取上游更新
git fetch upstream

# 合并到你的 main 分支
git checkout main
git merge upstream/main

# 推送到你的 Fork
git push origin main

18.9 如何删除一个仓库?

步骤:

  1. 进入要删除的仓库
  2. 点击 Settings 标签页
  3. 滚动到页面最底部,找到 Danger Zone
  4. 点击 Delete this repository
  5. 在弹出的对话框中输入仓库名称以确认
  6. 点击 I understand the consequences, delete this repository

⚠️ 警告:删除操作不可逆!所有代码、Issues、PR、Wiki 都会被永久删除。

18.10 如何屏蔽或举报不当内容?

GitHub 是一个开放社区,但偶尔也会遇到不当内容。

屏蔽某个用户:

  1. 进入该用户的个人主页
  2. 点击右上角的 Block user 按钮
  3. 确认屏蔽

举报不当内容:

  1. 找到不当内容(Issue、PR、评论等)
  2. 点击该内容右上角的 ... 菜单
  3. 选择 Report content
  4. 填写举报原因,提交

💡 GitHub 有专门的内容审核团队,会处理违规举报。


第七部分小结

在第七部分中,你:

  • ✅ 完成了一个完整的实战演练:从发现 Issue 到 PR 被合并
  • ✅ 学会了 10 个常见问题的解决方法
    • 提交到 main 分支
    • 撤销 commit
    • 解决合并冲突
    • 敏感信息泄露处理
    • 复杂冲突的本地解决
    • Star 管理
    • Watch 通知管理
    • Fork 同步更新
    • 删除仓库
    • 屏蔽与举报

至此,你已经完成了从零到一完整学习 GitHub 的全部旅程。


教程总结

你学到的东西

部分 核心内容
第一部分 注册账号、个人主页、Profile README、网页导航
第二部分 发现项目、搜索技巧、Star/Watch/Fork、通过 Issues 学习
第三部分 网页端创建仓库、编辑文件、提交历史、Issues/Projects
第四部分 Git 安装配置、clone/add/commit/push/pull、分支、PR 全流程
第五部分 GitHub Pages 建站、Actions 自动化、Insights 数据分析
第六部分 维护主页、撰写 README、开源参与、学习资源
第七部分 实战演练、10 个常见问题与解决方案

下一步建议

  1. 完善你的 GitHub 主页:花 30 分钟写一个有趣的 Profile README
  2. 完成第一次 PR :找一个 good first issue,体验 PR 被合并的快乐
  3. 搭建个人博客:用 GitHub Pages + Jekyll/Hugo 搭建一个技术博客
  4. 给你的项目加 Actions:为自己的项目添加自动化测试或部署
  5. 持续学习:参考附录 B 的资源,深入学习 Git 和协作的高级技巧

GitHub 是一个海洋,你刚刚学会了游泳。剩下的,就是下水实践了。

祝你编码愉快!🎉


附录

本附录包含以下内容:

  • 附录A:GitHub 网页快捷键速查表
  • 附录B:Git 操作与协作深入学习资源
  • 附录C:浏览器插件推荐
  • 附录D:如何开启 GitHub 深色模式
  • 附录E:Git 常用命令速查表

附录A:GitHub 网页快捷键速查表

GitHub 网页支持大量的键盘快捷键,可以大幅提升操作效率。

全局快捷键(在任何页面都可用)

快捷键 作用
? 显示快捷键帮助菜单
s/ 聚焦到搜索框
g + n 跳转到通知页面
g + d 跳转到仪表盘
g + i 跳转到 Issues 列表
g + p 跳转到 Pull Requests 列表
g + c 跳转到 Code 标签页
g + s 跳转到 Settings 页面
esc 聚焦到用户头像下拉菜单

代码浏览快捷键

快捷键 作用
t 打开文件查找器(快速跳转到文件)
l 跳转到某一行(输入行号)
w 切换分支/标签
y 将 URL 固定到当前文件的特定版本
i 显示/隐藏 diff 的评论框
b 打开 blame 视图(查看每行代码的作者)

Issues 和 Pull Requests 快捷键

快捷键 作用
c 创建新 Issue
r 引用当前 Issue/PR 的链接
e 将光标定位到评论输入框
ctrl + enter 快速提交评论
cmd + shift + p(Mac)/ ctrl + shift + p(Win) 打开命令面板

评论编辑快捷键(Markdown)

快捷键 作用
cmd + b(Mac)/ ctrl + b(Win) 加粗文本
cmd + i(Mac)/ ctrl + i(Win) 斜体文本
cmd + k(Mac)/ ctrl + k(Win) 插入链接
cmd + shift + 7 插入有序列表
cmd + shift + 8 插入无序列表
cmd + shift + . 插入代码块

💡 使用技巧 :按 ? 键可以随时查看当前页面的可用快捷键列表。


附录B:Git 操作与协作深入学习资源

本教程重点讲解了 GitHub 网页端使用和基础的 Git 命令。对于 Git 的深入原理、高级命令、团队协作最佳实践等内容,以下资源供你进一步学习。

📚 书籍推荐

书名 作者/出版社 适合人群 特点
《Pro Git》(中文版) Scott Chacon / 开源免费 初中级开发者 Git 官方推荐,全面覆盖从基础到高级,在线免费阅读
《Git学习手册》 Anna Skoulikari / O'Reilly 完全零基础 彩色图解、情景式教学、循序渐进
《使用 Git 进行版本控制》第三版 Prem Kumar Ponuthorai, Jon Loeliger / O'Reilly 中级开发者 深入讲解合并、变基、远程仓库等核心机制

免费在线阅读《Pro Git》中文版: git-scm.com/book/zh/v2

🎓 在线教程与文档

资源名称 地址 说明
Git 官方文档 git-scm.com/doc 最权威的参考手册,包含中文版
GitHub Skills skills.github.com GitHub 官方交互式课程,在浏览器中边学边练
图解 Git marklodato.github.io/visual-git-guide 可视化理解 Git 命令的工作原理
Learn Git Branching learngitbranching.js.org 交互式学习分支和合并(强烈推荐)
Atlassian Git 教程 atlassian.com/git/tutorials 图文并茂,从入门到进阶

🎥 视频课程

课程名称 平台 说明
Git & GitHub 入门与实践 哔哩哔哩(搜索) 大量免费中文教程
Git Tutorial for Beginners YouTube (The Net Ninja) 英文,适合初学者
Git and GitHub for Poets YouTube (The Coding Train) 风格轻松有趣
GitHub 官方 YouTube YouTube @GitHub 发布会、功能演示、最佳实践

📝 分支管理与协作专题

如果你需要深入掌握团队协作中的分支策略、冲突解决、rebase 等技能,推荐以下资源:

主题 推荐资源
Git Flow 工作流 搜索 "Git flow cheatsheet" 或阅读 Atlassian 教程
GitHub Flow 工作流 docs.github.com/en/get-started/quickstart/github-flow
合并 vs 变基 《Pro Git》第 3.6 节 "变基"
交互式变基 git-scm.com/book/zh/v2/Git-工具-重写历史
提交信息规范 Conventional Commits 规范(conventionalcommits.org
Code Review 最佳实践 Google 的 Engineering Practices 文档

🛠️ 图形化工具推荐

如果你对命令行感到吃力,可以先从图形化工具入门:

工具 平台 特点
GitHub Desktop Win / Mac GitHub 官方客户端,与网页端深度集成
Sourcetree Win / Mac 免费,可视化分支图,功能强大
GitKraken Win / Mac / Linux 界面美观,免费版功能足够
VS Code 内置 Git 全平台 编辑器内置,适合日常操作

💡 学习建议

  1. 先动手再理论:先跟着本教程完成一次完整的 PR 流程,再回头学原理
  2. 可视化辅助 :使用 git log --graph 或图形工具观察分支变化
  3. 模拟冲突:故意制造合并冲突并手动解决,这是团队协作的必修课
  4. 熟记 10 个核心命令cloneaddcommitpushpullbranchcheckoutmergerebasestatus
  5. 遇到问题先查文档git --helpgit 命令 --help 可以查看帮助

附录C:浏览器插件推荐

以下插件可以增强 GitHub 网页端的使用体验(按推荐程度排序)。

强烈推荐

插件名称 浏览器 功能
Octotree Chrome / Firefox / Edge 在左侧显示仓库的树形目录,方便浏览代码
Refined GitHub Chrome / Firefox 优化 GitHub 界面,增加大量实用小功能
Sourcegraph Chrome / Firefox 增强代码浏览体验,支持跳转定义、查找引用

值得一试

插件名称 浏览器 功能
GitHub Stars Manager Chrome 增强 Star 管理,支持分类和搜索
GitHub Hovercard Chrome / Firefox 鼠标悬停时显示用户/仓库的详细信息
Enhanced GitHub Chrome 显示仓库大小、下载链接等额外信息
Isometric Contributions Chrome 将贡献日历显示为 3D 立体柱状图
GitZip for GitHub Chrome 下载仓库中的单个文件夹/文件

安装方式

以 Chrome 为例:

  1. 打开 Chrome 网上应用店
  2. 搜索插件名称
  3. 点击 添加到 Chrome
  4. 安装后刷新 GitHub 页面即可生效

⚠️ 注意:安装插件时请查看权限和评价,避免安装恶意插件。


附录D:如何开启 GitHub 深色模式

GitHub 支持多种主题,包括深色模式(Dark Mode)。

开启方法

方法一:通过个人设置(推荐)

  1. 点击右上角头像 → Settings
  2. 在左侧菜单中,找到 Appearance(外观)
  3. 选择你喜欢的主题:
    • Light:浅色模式(默认)
    • Dark:深色模式
    • Dark high contrast:高对比度深色模式
    • Light colorblind:浅色色盲友好模式
    • Dark colorblind:深色色盲友好模式
  4. 选择后自动生效

方法二:跟随系统设置

在 Appearance 设置中,选择 Sync with system(跟随系统)。GitHub 会自动使用你操作系统的主题设置。

浏览器扩展方式(备选)

如果你不想登录 GitHub 就使用深色模式,可以安装浏览器扩展:

  • Dark Reader(Chrome / Firefox / Edge):为所有网站提供深色模式,包括 GitHub

附录E:Git 常用命令速查表

以下是 Git 最常用的命令,按使用频率排序。

配置与初始化

命令 作用
git config --global user.name "名字" 设置用户名
git config --global user.email "邮箱" 设置邮箱
git config --list 查看当前配置
git init 在当前目录初始化一个新的 Git 仓库
git clone <URL> 克隆远程仓库到本地

日常操作(最重要)

命令 作用
git status 查看当前状态(最常用,随时查看)
git add <文件> 将文件添加到暂存区
git add . 添加所有修改的文件到暂存区
git commit -m "信息" 提交暂存区内容到本地仓库
git commit --amend -m "新信息" 修改最后一次提交的信息
git push 推送到远程仓库
git push origin <分支名> 推送到指定远程分支
git pull 拉取远程仓库的更新
git fetch 获取远程更新但不合并(更安全)

分支操作

命令 作用
git branch 查看本地分支列表
git branch -r 查看远程分支列表
git branch -a 查看所有分支(本地+远程)
git branch <分支名> 创建新分支
git checkout <分支名> 切换分支
git checkout -b <分支名> 创建并切换到新分支
git switch <分支名> 切换分支(新版命令)
git switch -c <分支名> 创建并切换(新版命令)
git merge <分支名> 将指定分支合并到当前分支
git branch -d <分支名> 删除本地分支
git push origin --delete <分支名> 删除远程分支

历史与差异

命令 作用
git log 查看提交历史
git log --oneline 一行显示一条提交(简洁)
git log --graph 图形化显示分支历史
git diff 查看工作区与暂存区的差异
git diff --staged 查看暂存区与上次提交的差异
git show <提交哈希> 查看某次提交的详细信息

撤销与恢复

命令 作用
git restore <文件> 丢弃工作区的修改(危险)
git restore --staged <文件> 将文件从暂存区移出
git reset HEAD~1 撤销最后一次提交(保留修改)
git reset --hard HEAD~1 撤销最后一次提交(丢弃修改,危险)
git reset --soft HEAD~1 撤销提交,保留修改到暂存区
git reflog 查看所有历史操作(找回丢失的提交)

远程仓库

命令 作用
git remote -v 查看远程仓库地址
git remote add <名称> <URL> 添加远程仓库
git remote remove <名称> 删除远程仓库
git push -u origin main 首次推送并建立关联

速记口诀

复制代码
git status 查状态
git add 加暂存
git commit 记快照
git push 上传送
git pull 拉更新
git branch 管分支
git checkout 换分支
git merge 来合并
git log 看历史

附录总结

本附录提供了:

  • 快捷键速查表:让你操作 GitHub 更快
  • 学习资源:Git 进阶、分支策略、协作规范
  • 浏览器插件:增强 GitHub 使用体验
  • 深色模式:保护眼睛
  • 命令速查表:日常 Git 操作随时查阅

教程结束语

恭喜你完成了《GitHub 从 0 到 1 使用教程》的全部学习!

从注册账号、设置个人主页,到发现好项目、理解 Star/Watch/Fork,再到网页端管理仓库、使用 Issues 和 Projects,接着学习 Git 命令、分支和 Pull Request 协作,最后掌握 Pages 建站、Actions 自动化,以及参与开源的完整流程。

你已经拥有了独立使用 GitHub 的全部能力。

接下来,请把这些知识用起来:

  1. 去完善你的 GitHub 主页
  2. 找一个 good first issue,完成第一次 PR
  3. 用 GitHub Pages 搭建个人博客
  4. 给你的项目加上自动化测试

GitHub 是一个海洋,广阔而深邃。本教程为你搭建了起航的船,剩下的风景,等你亲自去探索。

祝你编码愉快,开源路上见!🎉


教程完

相关推荐
最贪吃的虎19 小时前
GitHub推送又超时了?试试SSH
运维·ssh·github
四千岁1 天前
Obsidian + jsDelivr + PicGo = 免费无限图床:一键上传,全平台粘贴即发
前端·程序员·github
wusfe1 天前
适配 Anthropic 兼容 AI 提供商的环境配置快速切换工具
github
m0_694845571 天前
marimo搭建教程:替代Jupyter的交互式开发工具
服务器·ide·python·docker·jupyter·github
梦梦代码精1 天前
智能体编排 + MCP + 知识库,开源可商用!
人工智能·神经网络·gitee·开源·github·代码规范
前进的李工1 天前
SSH隧道实现Dify与Ollama跨服务器通信
开发语言·大模型·github·腾讯云·autodl·dify
汪海游龙1 天前
04.03 AI 精选:Google 发布 Gemma 4 开源模型
github
起个名字总是说已存在1 天前
github开源AI技能:UI UX Pro Max智能设计系统生成器
人工智能·ui·开源·github