玩转全球最大同性交友网站--- 开源社区GitHub

1. 你是否有过这样的需求?

  • 刚接触github,被一堆菜单选项搞得头大, 不知道怎么玩
  • 想做一个网站,发布到公网, 让所有的人都可以访问到
  • 希望全面知晓github一个开源项目的结构,也能像其他大神一样,把github 玩转
  • 跟着韩老师,学起来=> 韩老师视频

2. GitHub介绍

你需要的前置知识:GitHub 的基本操作

  • GitHub 是一个面向开源及私有软件项目的托管平台, 官网: https://github.com/
  • 被称为 “程序员的维基百科全书”被戏称 “全球最大同性交友网站”
  • 以 Git 为唯一的版本库格式进行托管,故名 GitHub
  • 注意: Git是一个版本管理工具,GitHub 是一个软件项目的托管平台(社区/网站)
  • GitHub 于 2008上线,除了 Git 代码仓库托管以外(界面方式),还提供订阅、讨论组、在线文件编辑器、协作图谱、代码片段分享(Gist)等功能。
  • 托管版本数量也是非常之多,知名开源项目 Ruby on Rails、jQuery、python 、Vue等。
  • 2018 年 ,微软宣布,通过 75 亿美元的股票交易收购代码托管平台 GitHub

3. GitHub实战: 创建repository发布到公网,所有人能访问

  • 效果:网站 https://xjsgithub.github.io/ 就会看到 好大的一只鲸鱼

在这里插入图片描述

3.1 步骤1 : 按照规范创建一个repository,【提示使用电子邮件,先创建一个github账号】,访问github,推荐使用谷歌浏览器, vpn,格式是 username.github.io

在这里插入图片描述

在这里插入图片描述


在这里插入图片描述


在这里插入图片描述

3.2 步骤2: 下载github desktop,并和 github账号关联

在这里插入图片描述

3.3 步骤3:创建本地 repository仓库

  1. 直接进 sign in to github.com
  2. 输入密码后,就可以登录,选择创建 repository

在这里插入图片描述


在这里插入图片描述

在这里插入图片描述

3.4 步骤4: 选择 username.github.io 的窗口,进行clone

在这里插入图片描述


在这里插入图片描述


在这里插入图片描述


在这里插入图片描述


在这里插入图片描述


在这里插入图片描述

3.5 步骤5: 将本地仓库上传到 GitHub

  1. clone后,进入到项目对应的文件夹(空的),将你的项目源码文件拷贝到这里
  2. 会看到github desktop 有新的文件,先commit到本地仓库,然后在进行publish branch(进上传到 github.com),这时你会看到github.com 你的username.github.io 有源文件加入了

在这里插入图片描述

在这里插入图片描述

3.6 步骤6: 访问网站 https://xjsgithub.github.io/ 就会看到 好大的一只鲸鱼

在这里插入图片描述

4. 申请顶级域名,并指向 https://xjsgithub.github.io/

4.1 在阿里云、腾讯云、 GoDaddy或者 freenom 去申请域名,指向 https://xjsgithub.github.io/

4.2 在GitHub上设置你自己的域名即可

5. 看一个实际开源项目 jQuery

5.1 界面 https://github.com/jquery/jquery

在这里插入图片描述

  • github上的项目文档是 markdown编写
  • Watch: 关注项目变化,如被别人提交了 pull request、发起了issue等等,在你的通知中心,收到一条消息
  • Star: 类似微信朋友圈的点赞, 支持,让该项目更有热度.
  • Fork: 得到一份原项目的拷贝,如果后续原项目改变,需要自己去处理同步
  • Branch: 分支
  • Tag: 标签

5.2 项目不同版本比较 https://github.com/jquery/jquery/compare

在这里插入图片描述

  • 项目的url/compare 可以对不同版本比较,如图
  • 比如可以看到有多少个文件的变化,有多少次commit
  • 提示:直接使用 git工具也可以进行版本比较

5.3 issues

在这里插入图片描述

  • issues ---- 评论/话题,对项目提出各种讨论,比如Bug、Build 、help wanted等,有各种问题都可以提
  • 状态 Open : 讨论中
  • Closed:关闭,如已经解决
  • issues 可以增加开发者和使用者的交流,也可以创建一个issue

5.4 pull requests

在这里插入图片描述

  • 简称pr,你如果要往该项目贡献代码,你可以在Github上发起一个Pull Request
  • 如果被审核(code review)通过并正式合并,这样你就为项目做贡献了

5.5 Actions

在这里插入图片描述

  • GitHub Action 是 GitHub 推出的一个 CI\CD 服务
  • CI\CD 其实是:持续集成、持续交付、持续部署
  • 一般我们把GitHub当做代码仓库或者版本管理工具来用,有 GitHub Action 以后,能做的事情就更多,比如在 master 分支上提交了一段代码, GitHub Action 可以自动部署到指定的服务器上去,还可以把代码做成镜像,将镜像自动提交到镜像仓库里

5.6 Projects

在这里插入图片描述

  • GitHub 上的项目板【需要权限】
  • 帮助组织工作和排列工作的优先级。
  • 项目板可以灵活地创建适合需求的工作流程。
  • 项目板包括议题、拉取请求和注释,在选择的列中分类为卡片
  • 拖放或使用键盘快捷键对列中的卡片重新排序,在不同列之间移动卡片,以及更改列的顺序

5.7 Wiki

在这里插入图片描述

  • 维基百科(Wikipedia)
  • 可以把项目的方方面面进行说明,支持markdown

5.8 insights

在这里插入图片描述

  • 项目的总体浏览相关统计信息
  • Contributors: 看到用户在相应日期中发送提交、添加代码、删除代码的大致数量
  • commits: 显示了一年收到的提交大致数量。可以判断某个仓库是否在积极更新
  • Code Frequency(频率):显示了该仓库中代码行数的增加量和删除量。
  • Network(分支网络): 显示包括克隆仓库在内的所有分支的提交。
  • Fork: 服务端的代码仓库克隆情况

5.9 settings

在这里插入图片描述

  • 对仓库进行任何设置。用户必须有更改权限的设置(一般是自己的repository)才看到这个页面
  • 修改仓库名称
  • Features: 更改Wiki和Issue的相关设置。如果想关闭某些功能,只要取消勾选相应复选框即可。
  • Merge Button: 设置合并代码方式
  • GitHub Pages: 每个Github账户都可以开一个自己的静态网站(域名为 username.github.io)
  • Danger Zone: 用户可以将仓库改为私有或是变更仓库的所有者,甚至删除仓库本身。这里操作一定要谨慎

相关文章

kindeditor4.x代码高亮功能默认使用的是prettify插件,prett...
这一篇我将介绍如何让kindeditor4.x整合SyntaxHighlighter代...
js如何实现弹出form提交表单?(图文+视频)
js怎么获取复选框选中的值
js如何实现倒计时跳转页面
如何用js控制图片放大缩小