转自:一秒钟把Github项目变成前端网站

后面加了一些自己的东西

一秒钟把Github项目变成前端网站

GitHub Pages大家可能都知道,常用的做法,是建立一个gh-pages的分支,通过setting里的设置的GitHub Pages模块可以自动创建该项目的网站。
这里经常遇到的痛点是,master遇到变更,经常需要去sync到gh-pages,特别是纯web前端项目,这样的痛点是非常地痛。
Github官方可能嗅觉到了该痛点,出了个master当作网站是选项,太有用了。

选择完master branch之后,master自动变成了网站。master所有的提交会自动更新到网站。

精准分享关键代码

比如你有一个文件里的某一行代码写得非常酷炫或者关键,想分享一下。
可以在url后面加上
#L行号
比如,点击下面这个url:
https://github.com/AlloyTeam/AlloyTouch/blob/master/alloy_touch.js#L240
你便会跳到alloy_touch.js的第240行。

那么问题来了?如果我是一段代码,即多行代码想分享呢?也很简单:url后面加上
#L开始行号-L结束行号
比如,AlloyTouch的运动缓动和逆向缓动函数如下面代码段所示:
https://github.com/AlloyTeam/AlloyTouch/blob/master/alloy_touch.js#L39-L45

其实也不用记忆你直接在网址后面操作,github自动会帮你生成url。比如你点击39行,url变成了
https://github.com/AlloyTeam/AlloyTouch/blob/master/alloy_touch.js#L39
再按住shift点击45行,url变成了
https://github.com/AlloyTeam/AlloyTouch/blob/master/alloy_touch.js#L39-L45
然后你这个url就可以复制分享出去了,点击这个url的人自动会跳到39行,并且39-45行高亮。

通过提交的msg自动关闭issues

比如有人提交了个issues https://github.com/AlloyTeam/AlloyTouch/issues/6
然后你去主干上改代码,改完之后提交填msg的时候,填入:

fix  https://github.com/AlloyTeam/AlloyTouch/issues/6

这个issues会自动被关闭。当然不仅仅是fix这个关键字。下面这些关键字也可以:

  • close
  • closes
  • closed
  • fixes
  • fixed
  • resolve
  • resolves
  • resolved

通过HTML方式嵌入Github

如下面所示,user和repo改成你想要展示的便可以

<iframe src="//ghbtns.com/github-btn.html?user=zengxiangliang&repo=three_text&type=star&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="110" height="20" style="position: absolute;top:20px;right:150px;"></iframe>
<iframe src="//ghbtns.com/github-btn.html?user=zengxiangliang&repo=three_text&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="110" height="20" style="position: absolute;top:20px;right:40px;"></iframe>

插入之后你便可以看到这样的展示:

gitattributes设置项目语言

如上图所示,github会根据相关文件代码的数量来自动识别你这个项目是HTML项目还是Javascript项目。
这就带来了一个问题,比如AlloyTouch最开始被识别成HTML项目。
因为HTML例子比JS文件多。怎么办呢?gitattributes来帮助你搞定。在项目的根目录下添加如下.gitattributes文件便可,
https://github.com/AlloyTeam/AlloyTouch/blob/master/.gitattributes
里面的:

*.html linguist-language=JavaScript

主要意思是把所有html文件后缀的代码识别成js文件。

查看自己项目的访问数据

在自己的项目下,点击Graphs,然后再点击Traffic如下所示:

里面有Referring sites和Popular content的详细数据和排名。如:Referring sites

其中Referring sites代表大家都是从什么网站来到你的项目的,Popular content代表大家经常看你项目的哪些文件。

trending排行榜

上面教大家设置语言了,下面可以看看怎么查看某类型语言的每日排行榜。比如js每日排行榜:

https://github.com/trending/javascript?since=daily

https://github.com/trending/html?since=daily

https://github.com/trending/css?since=daily

其他

  • issue中输入冒号 : 添加表情
  • 任意界面,shift + ?显示快捷键
  • issue中选中文字,R键快速引用

最后

好了,我就会这么多,也是我经常使用的技巧。欢迎补充实用的技巧~~我会持续更新上去...

github使用技巧的更多相关文章

  1. github搜索技巧小结

    欢迎访问我的GitHub https://github.com/zq2599/blog_demos 内容:所有原创文章分类汇总及配套源码,涉及Java.Docker.Kubernetes.DevOPS ...

  2. Github搜索技巧-如何使用github找到自己感兴趣的项目

    Github现在不仅仅作为一个版本控制工具,更是一个开源的仓库,里面不但有优秀的开源代码,电子书,还有一些五花八门的项目,有些国家的法律也放在上面,作为程序员如何找到自己感兴趣的项目就非常重要了! 欢 ...

  3. Github搜索技巧-如何使用github找到自己感兴趣的项目(转载)

    Github现在不仅仅作为一个版本控制工具,更是一个开源的仓库,里面不但有优秀的开源代码,电子书,还有一些五花八门的项目,有些国家的法律也放在上面,作为程序员如何找到自己感兴趣的项目就非常重要了! 欢 ...

  4. Github搜索技巧整理

    Github官方网址:https://github.com/ 一.详细官方文档:https://help.github.com/en/github/searching-for-information- ...

  5. GitHub小技巧-定义项目语言

    GitHub是根据项目里文件数目最多的文件类型,识别项目类型.后端项目难免会包含前端的资源,有时候就会被标记成前端语言,因为项目里 css 等文件比较多, 被误识别成css项目. GitHub不提供指 ...

  6. Github使用技巧总结

    <config> PyCharm与GitHub配置使用总结 <readme> 在github的readme添加图片 github readme写法 GitHub上README. ...

  7. github小技巧之Creating a pull request 创建 pull 请求

    创建一个 pull 请求是为了协作更改存储库.这些变化会产生一个分支,它确保主分支保持干净整洁. 与commits提交是不同的,提交是fork之后的一种操作. 在你可以打开一个 pull 请求之前,您 ...

  8. 少有人知的 GitHub 使用技巧

    GitHub 大家常上吧?可是使用 GitHub 的各种小窍门你就不一定知道了.本文将各种使用 GitHub 的小窍门分享给大家. diff时忽略空格 有些修改只是增减了空格,在URL中添加?w=1就 ...

  9. Github搜索技巧

    按仓库名称.说明或自述文件内容搜索 通过 in 限定符,您可以将搜索限制为仓库名称.仓库说明.自述文件内容或这些的任意组合. 如果省略此限定符,则只搜索仓库名称和说明. 限定符 示例 in:name ...

随机推荐

  1. 容器--TreeMap

    一.概述 在Map的实现中,除了我们最常见的KEY值无序的HashMap之外,还有KEY有序的Map,比较常用的有两类,一类是按KEY值的大小有序的Map,这方面的代表是TreeMap,另外一种就保持 ...

  2. JMeter专题系列(六)集合点

    JMeter也有像LR中的集合点: JMeter里面的集合点是通过添加定时器来完成. 注意:集合点的位置一定要在Sample之前. 集合点:虽然我们的“性能测试”理解为“多用户并发测试”,但客观上来说 ...

  3. Atitit. 构造ast 语法树的总结attilax oao 1. Ast结构树形12. ast view (自是个160k的jar )22.1. 多条语句ast结构22.2. 变量定义 int b,c; 的ast结构22.3. 方法调用meth1(a=1,b=2,c=3);  的ast结构23. 误解的问题33.1. 语法书子能是个二叉树,实际上多叉树越好..33.2. 非要不个ast放到个s

    Atitit. 构造ast 语法树的总结attilax oao 1. Ast结构树形1 2. ast view (自是个160k的jar )2 2.1. 多条语句ast结构2 2.2. 变量定义 in ...

  4. Thinkcmf:页面常用函数

    Thinkcmf:页面常用函数 全站seo: 文章列表: {$site_seo_title}        <!--SEO标题--> {$site_seo_keywords}   < ...

  5. 【再探backbone04】单页应用的基石-路由处理

    前言 首先发一点牢骚,互联网公司变化就是快,我去一个团队往往就一年时间该团队就得解散,这不,公司居然把无线团队解散了,我只能说,我那个去!!! 我去年还到处让人来呢,一个兴兴向荣的团队说没就没了啊!我 ...

  6. 【转】Linux 初始化 init 系统 [sysvinit systemd upstart]

    http://www.ibm.com/developerworks/cn/views/linux/libraryview.jsp?sort_by=&show_abstract=true& ...

  7. IOS开发基础知识--碎片16

    1:Objective-C语法之动态类型(isKindOfClass, isMemberOfClass,id) 对象在运行时获取其类型的能力称为内省.内省可以有多种方法实现. 判断对象类型 -(BOO ...

  8. Android项目实战(十三):浅谈EventBus

    概述: EventBus是一款针对Android优化的发布/订阅事件总线. 主要功能是替代Intent,Handler,BroadCast在Fragment,Activity,Service. 线程之 ...

  9. iOS-多线程之GCD(原创)

    前言 GCD 全称 Grand Central DisPath NSOperation便是基于GCD的封装 基础知识 1.GCD的优势 (1)为多核的并行运算提出了解决方案 (2)GCD会自动利用更多 ...

  10. 学习Maven之Cobertura Maven Plugin

    cobertura-maven-plugin是个什么鬼? cobertura-maven-plugin是一个校验单元测试用例覆盖率的工具,可以生成一个测试覆盖率报告,可以给单元测试用例编写提供参考. ...