Blog | Phodal - A Growth Engineerhttp://www.phodal.com/blog/2019-03-11T12:57:47+00:00BlogGitHub 获 star 指南2019-03-11T12:57:47+00:002019-03-11T04:29:40.321595+00:00Phodal Huanghttp://www.phodal.com/blog/author/root/http://www.phodal.com/blog/how-get-get-star-for-github/> 每天打开 GitHub Trending,都是各种面试指南,这样的生活真难受。如果你的项目是金子,那么请读读这篇文章。
GitHub 是一个非常有意思的地方,也常常变得非常有争议。有证据表明,GitHub 在某种程度上已经成为了简历的一部分。所谓的证据,便是培训班的人在帮助面试者美化 GitHub 页面——从 Vue 高仿各类项目,到淘宝买 star 来粉饰门面。作为一个面试官,我向来是非常讨厌这样的行为。那么作为一个正直的开发人员,他/她们也越来越需要通过 GitHub 去证明自己的能力。否则,总有一天**劣币驱逐良币**,导致 GitHub Trending 上的项目越来越不堪入目。
出于这样的目的,我想为那些有真金白银的小伙伴写一篇攻略。至于其他/她人的看法倒是不重要,帮助那些金子从水底浮出来,才是我们应该做的。要是有太多的过于水的项目,每天打开 GitHub Trending,都是各种面试指南,那生活还叫生活吗?那叫被面试强迫的生活。
## 为什么我们 star 一个项目
在 GitHub 获得 Star 的重点是,**碰触人们的 G 点**——人们只对和自己有关的事情感兴趣。或是证明自己是对这个感兴趣,或是觉得这个项目不错可以收藏,或者是觉得作者不容易鼓励一下作者。
当然了,我痛恨那些,投机取巧的人——在 GitHub 放置大量非自己创作的电子书、学术资料、课程,以获取 star。
获得 Star 的核心是:**你有人们想要的东西,你分享了人们想要的内容**。这些内容可以是代码、文档、文章、资料、指南,只要它能帮助到其他/她人,那么它便是有价值的。当然了作为 GitHub 本身来说,那些通过 Git 和版本管理可以控制的内容,才更适合于这个平台上。
所以,当你手上拥有了人们想要的东西时,那么你就可以使用这份指南,来帮助你构建出更成功的项目。
## 我的获 star 方式
作为一个 GitHub 上的“大 V”,我往往不需要花费太多的精力在项目宣传上。在 GitHub 上创建一个项目,然后 star 就来了……。有时候会比较“无耻”,等到某个项目做得稳定的时候,再给自己一个 star ,吸引更多的吃瓜群众。而后,写一系列的文章来介绍自己的项目。唉,做个开源项目不容易啊。
但是这些并不管用,因为有时候,我写的代码是大家丝毫不感兴趣的内容。如我最近写的 Serverless 密码管理器 MoPass:我在公众号上、博客上、知乎上写了文章来宣传这个项目,最后只吸引了一小部分人的注意——<= 25。毕竟,你觉得好的东西,那只是对你来说有用。对于其他/她人来说,这个密码管理器可能远远不如 1Password。
再举个成功的例子,最近我在思考:**新项目的检查清单**,即当我们来到或者开始一个项目的时候,我们需要做哪些事情,对应的还需要考虑什么因素。于是我在 GitHub 上创建了一个名为 New Project Checklist ([https://github.com/phodal/new-project-checklist](https://github.com/phodal/new-project-checklist) ) 的项目。我只是按自己的想法,在 README 上写下了要考虑的中英文因素,还没编写 Web 部分,就已经获得了 100+ 的 star。与此同时,因为 Web 部分还没完成,所以我还没在我的博客、专栏上进行宣传。
我只是写了一个 README,然后 star 就来了。但是,一般情况下,我们需要怎么做呢?
## GitHub 流量分析
实际了,当我们在说获得 star 的时候,我们说的是**为自己的项目做推广**。只是呢,获得 star 是其中的一个结果产物,也就是说,我们在宣传项目的过程中,获得了关注度。至于推广本身来说,不同的人会有不同的看法。
事实上,GitHub 获取 star 与我们日常了解的营销差不多,先将用户吸引到我们的 GitHub 页面,再让用户有关注的动力(这一点太难了)。
因此开始之前,我们先看张图就能知道怎么获取流量。如下是《GitHub 漫游指南》最近两周内的流量来源统计(GitHub 通过 Google Analysis 来统计):
![GitHub 漫游指南](http://github.phodal.com/img/github_traffic.png)
从上图中可以看出,流量主要来源于几部分:
- GitHub 项目的直接访问
- GitHub 的直接访问
- 来源于知乎等社交网站的
- 来自于 GitHub Pages 的访问
- 来自其它社交网站的访问
总的来说,在这一周里,累计有 1,266 次访问,其中有 735 个独立访客。看这数据不错,而实际上 star 率 就有点低。根据 Star History 网站(https://star-history.t9t.io ) 的统计,在过去的近两个月里,才涨了 38 个 star。
![GitHub 漫游指南 Star 历史](http://github.phodal.com/img/github-star-history.png)
从我的分析来看,大抵原因有两个:
1. 用户看的都是 GitHub Pages 上的内容
2. 从数量上来看,受众并不多
而我最近在玩的 New Project Checklist ([https://github.com/phodal/new-project-checklist](https://github.com/phodal/new-project-checklist) 的转化率看上去,还算可以:
![GitHub New Project Checklist](http://github.phodal.com/img/github-new-project-checklist.png)
在 999 个独立访客里,获得了 202 个 star,转化率差不多是 20%——大家真的对这个项目感兴趣。
所以,让我们再强调一下核心的部分:**你分享了人们想要的代码、内容**。否则,你带来了大量的流量,并不一定能转化为你想要的关注度。
## GitHub 获 star 指南技巧
对于一个创造而言,自然而然的希望自己的项目能有人用。可能一点点的吐槽,都能帮助项目以更好的方式前进。这也就是我为自己项目宣传的意义,在创建项目的时候,我们往往只会按照自己的需要来创建项目。而非其他/她人的需求。因此当有一些新的需求出现时,可能会稍微地影响项目演进的方向。这些方向有好有坏,有时候反而会对自己更有帮助。
好了,回到我们的正题上,怎么去获取 star?
### 技巧一:结合 SEO 技巧
当我们在为一个项目做宣传的时候,实际上我们做的事情类似于搜索引擎优化(Search Engine Optimization)。稍有不同的是,GitHub 在实践的过程中,帮助我们优化了很多细节。它可以让我们更关注于核心的要素。
实际上,在上一小节里,我们已经介绍了相关的内容。若是想获得来自于 Google 等搜索引擎的访问,那么要掌握的技巧有:
![Google New Project Checklist](http://github.phodal.com/img/google-new-project-checklist.png)
- 简单实用的项目名。项目名在 Google 搜索结果里是放在最前面的部分,它与 URL 同在。
- 写好项目的 ``Description``。不管怎样,你一定要为你的项目写好 Description,让看到的人知道它在做什么。
- 设置好相应的 ``topics``。GitHub 为项目设计了一个 Topics 页面,这些页面会被拉入相应的索引中,可以从 Google 等搜索引擎和 GitHub 中搜索到。
- 作为外链加入文章中。作为 SEO 技巧的一部分,你需要在你的博客和文章里,适当地引用你的 GitHub 项目,它会你的项目带来流量。
- 合适的外链标题。作为链接存在时,需要注意链接的标题(与项目主题一致),它会在某种程度上影响搜索结果。
这些只是一些基本的内容,算不上是技巧,但是做好基础很重要。
### 技巧二:完整、易读的 README
让我们再强调一下,好的 README 真的很重要,重要、重要!重要。
GitHub 是一个人的简历,**而开源项目的 README,就好像是一个项目的简历**。在这份简历里,你需要好好地写你的项目:
- **这个项目做什么?**?
- **它解决了什么问题**?
- **它有什么特性 — hello, world 示例**?
- **怎么使用这个项目**?
- **这个项目使用的是什么协议**,是否允许商用?
以我混迹在 GitHub 近 10 年的经验来看,老外**最喜欢吹这个项目有什么特性了**。与此同时,还会在这个项目上“画大饼”(Roadmap),即**这个项目未来将有什么功能**——为了实现这些功能,我们还需要你的关心、支持与厚爱。所以,如果你是在做一个惊天动地的项目,比如说你要实现一个自动化安装脚本,你可以在未来的功能里写上:
- AI 自动化安装(TODO)
这确实是个 TODO——即不吹,又吸引吃瓜群众。
### 技巧三:社交分享
作为一个混迹在各个社区的资深技术咨询师,分享相关的项目是我的一个常规操作。特别是,当看到一些人“无聊的聊天”,就会推荐上自己的新项目。当然,一般一个项目只会有一两次,频繁的分享便相当于 ** ,你懂的。
**更新状态**。当我在写一个大家感兴趣的开源项目时, 我会在我的社交账号上,如微博、知乎想法,定期的更新相关的状态。诸如:
![微博 MoPass](http://github.phodal.com/img/mopass-weibo.png)
万一有人感兴趣,就会随之而来——主要是我也不知道微博要怎么玩。
**推荐自己的项目**。作为一个在 GitHub 上有大量项目的开源作者,以及拥有大量文章的我。每次在微信群里,看到一些相关的问题,都会直接丢出我的开源项目。既装逼,又靠谱。
至于微信群的分享频率,要适度~,适量~。
### 技巧四:文章
既然我写了一个这么好的开源项目,那么最好的方式,还是写一篇文章介绍一下这个项目吧。blabla,写完了一篇项目的使用文档:
- **为什么需要这个项目?**
- **这个项目是什么?**
- **这个项目能解决什么问题?**
- **这个项目要怎么用啊?**
是不是写起来很简单?
未来在其它的文章中,有一些相关的话题,便可以稍微提及一些相关的项目。比如,在这篇文章里,我还介绍了好几个近期的项目。这些文章,除了在我的公从号上,还会发在我的博客(累计 100 万访问量)上,我的知乎专栏上,还有我的……上。它们结合起来,会形成一股强大的力量,即能吸引用户,又能在 SEO 上有一定的提升。
### 技巧五:把握 GitHub Trending
万一,我是说万一,你的项目上了 GitHub Trending。截个图,然后你可以再写一篇文章( 我的项目是如何上 GitHub Trending,毕竟上 Trending 很简单),发一条微博,写一个想法,录个小视频,大家快来看这是我的项目。
理论上上 GitHub Trending 会吸引来更多的用户——有大量的网站、自动化微博等,会每天去介绍这些新的上的 Trending 项目,没有意外的话,它会为你带来更多的流量——意味着更多的关注度。
### 不是技巧的技巧:持续性
事实上,如你所知,我在 GitHub 上获得大量 star 的原因,并不是说我有一个优秀的项目。而在于我在持续的更新,持续不断地在 GitHub 上做自己喜欢的项目,投入时间分享相关的技巧,还有一系列相关的开源项目。
我们一直在持续变好,打造一个自由的互联网世界,打造一个个自己喜欢的工具。
我们是极客,我们热爱编程,我们热爱分享。写在GitHub 的第 19999 个 star 时2016-12-17T14:44:56+00:002016-12-17T14:45:19.085429+00:00Phodal Huanghttp://www.phodal.com/blog/author/root/http://www.phodal.com/blog/github-star-19999/> Star 虽好,可不要贪杯哦。
> 两年前在做 Annual Review 订下一年的目标时,想着写一个开源框架。去年订下今年的目标时,仍然继续着这样的想法。今年又要制定下一年的目标,2333~~。
不久前,在 GitHub Ranking 上看到自己的 star 数(star 不是设计用于做“点赞”的,而是用来收藏的)时,发现已经快 20000 了。然后把自己的项目过了一遍,发现没有一个比较好的**代表性框架,**要么是应用,要么是电子书。
前 8 个项目里,除了 Growth 应用以外,其他的都是电子书内容——六本电子书加起来的 star 数有 **10619**,果然是骗 star 的。我只能尽力地去想想:为什么事情会变成这样了?
从创建开源框架说起
---
创建开源框架和创建创建开源项目是不一样的,前者你服务于开发者,后者你服务于用户。
两年前在做 Annual Review 的时候,想着未来的一年里可以做一个开源框架试试。那时刚毕业不久,对开源世界的各种游戏规则不是很了解:**开源并不是将代码提交上去,然后就会一下子火起来**。虽然我们可以在短期内赚上一些眼球,但是真正要将它采用到项目上的人不多。
当时,我遇到的最主要的问题是:**想参与到项目的人并没有遇到足够的能力**。你还需要花费大量的时间去教他们,鼓励 GitHub 新手并不是一件容易的事。有时我需要在接受他的 PR 后,再修改他的代码。并且人们提交 PR 可能是出于不同的原因。
然后,知道了开源世界还有一个游戏规则是:**谁的影响力大,谁就能产生更广泛的影响**。如 Virtual Dom 并不是 Facebook 首创的,但是却因为 FB 火的; 松本行弘在写下 mruby 的 README 时(印象中是这个项目),star 数就已经过 1k 了。这种例子数不胜数,要么是在推广上花了力气,要么个人、公司有着更大的影响力。
一年前,稍微改变了下策略:暂时以**培养人为主**,同时想着做一个合适的开源框架——只是在今年看来,前端领域已经没有合适的地方可以造轮子了。
在 GitHub 上有一个很常见的问题是,**大多部分项目的维护者就是发起人**——如果这个发起人发生意外了,那么这个项目怎么办。如果这是一个很火的项目,它就存在着巨大的风险;同时这可能也说明了,缺乏一套合理的机制。
你的开源项目不仅仅需要一个使用文档,还需要一个相关设计思想的文档、路线图、未来计划等等。
去年年底写总结的时候,想到可以 RePractise 文章为基础来培养人,于是就有了 Growth 的三个项目:
- 应用:[Growth](https://github.com/phodal/growth)
- 电子书:《[Growth:全栈增长工程师指南](https://github.com/phodal/growth-ebook)》
- 电子书:《[Growth:全栈增长工程师实战](https://github.com/phodal/growth-in-action)》
如今 Growth 已经有了过万的用户,每天活跃的用户数也接近 300 了。第一步看上去很成功,但是下一步怎么走呢?
下一个开源项目
---
后来我开始在思索一个问题,创建一个开源框架是必须的吗?
在编写 Growth 电子书的时候,我发现一个好的软件工程实践远远比一个易上手的框架重要多了。框架本身是易变的东西,过去你在用 Backbone,现在你在用 React.js;过去你在用 Angular.js,现在你在用 Vue。会不会使用某个框架,并不是区分你是不是一个有经验的开发者的标准。
一直将焦点关注于**学习不同的框架的使用**是有问题的,一个在校生可以轻松地比你了解某个框架的原理——你白天在工作,而他整天在学习。这时你很容易就失去竞争力了,你需要从框架之外了解更深层次的东西。**一个好的框架并不能让你写出一段好的代码**。
> 如果中国人的思想不觉悟,即使治好了他们的病,也只是做毫无意义。
这算是我为自己在 GitHub 下的 Markdown 的自辩吧——谁让我一直有写作的冲动呢。
不过我仍然还有一些想法,只是还没有抽出足够的时间去思考这样的事。
**GNU/Linux 的桌面**。这是几年前的一个想法了,当时 GNU/Linux 的那些操作系统上都没有一个好玩的桌面,不过感觉这个坑太深了,就没有进行了。
**家居智能中心**。我仍然对于大学学的知识有点念念不忘,虽然已经写了一本书,但是硬件还是相当的刺激。唯一的问题是:连房子都没有,怎么做智能家居。
**图形框架**。这是我之前在做一个图形界面的时候,发生没有一个合适的框架可以满足我的要求。然后我就在想,还是自己做一个吧。
不过,最好的开源项目就是自己平时用的。于是,我开始将写各种工作来提自己使用——如现在在用的这篇微信编辑工具:[mdpub](https://github.com/phodal/mdpub)。
最后,我做了一个简单的 HTML 5 动画来记录这一时刻,作为这一个里程碑的记念:
[https://phodal.github.io/20k/](https://phodal.github.io/20k/)
但愿明年的工资能赶上 star 数~Showdown 添加Star插件2015-04-04T08:32:02+00:002015-04-05T08:07:04.829997+00:00Phodal Huanghttp://www.phodal.com/blog/author/root/http://www.phodal.com/blog/markdown-add-star-plugin-with-showdown/在写一个markdown简历生成器的时候,需要用到star以及icons,这时就需要写一个简单的插件来生成评级。
![Showdown star plugin](/static/media/uploads/star.jpg)
用法:
var converter = new Showdown.converter({ extensions: ['star'] });
var result = converter.makeHtml('<level1> <br/> <level1.5> <br/> <level3> <br/> <level3.5>');
document.getElementById('show').innerHTML = result;
代码实现: [https://github.com/phodal/showdown-star](https://github.com/phodal/showdown-star)
##Showdown
> Showdown.js是一个javascript环境下markdown语法解释工具. 支持nodejs和各大主流浏览器.
官方给了几个插件的示例
var demo = function(converter) {
return [
// Replace escaped @ symbols
{ type: 'lang', filter: function(text) {
return text.replace(/\\@/g, '@');
}}
];
}
以及
var demo = function(converter) {
return [
// Replace escaped @ symbols
{ type: 'lang', regex: '\\@', replace: '@' }
];
}
这时看了看Showdown自带的几个插件发现还是挺简单的。
##Showdown Prettify 插件分析
源码如下所示
var prettify = function(converter) {
return [
{ type: 'output', filter: function(source){
return source.replace(/(<pre>)?<code>/gi, function(match, pre) {
if (pre) {
return '<pre class="prettyprint linenums" tabindex="0"><code data-inner="1">';
} else {
return '<code class="prettyprint">';
}
});
}}
];
};
看了一下原理就是用正则表达式去将``<pre>``替换成``<pre class="prettyprint linenums" tabindex="0"><code data-inner="1">``
##Showdown Star Plugin
于是,定义了下我们需要的星星类型:
1,1.5,2,2.5,3,3.5,4,4.5,5 一共有九种。
而在markdown中需要这样写<level1>,<level1.5>等等
我们所要做的便是:
1.用正则表达式匹配符合条件的level
2.将表达式中的``.``换为``-``
3.返回html
对应于代码便是:
var star = function(converter) {
return [
{ type: 'output', filter: function(source){
return source.replace(/(<level([0-9]*\.?[0-9]+)>)/gi, function(match, isLevel) {
var level = match.match(/<level([0-9]*\.?[0-9]+)>/i)[1];
level = level.replace(".", "-");
if (isLevel) {
return '<i class="star-icon icon-star star-' + level + '"></i>';
}
});
}}
];
};
除此我们还需要一堆CSS:
.star-icon {
background: url(../images/star.png) no-repeat;
background-size: 410% 100%;
-webkit-background-size: 410% 100%;
}
.icon-star {
display: inline-block;
width: 96px;
height: 18px;
}
.star-1 {
background-position: -76px 0;
}
.star-1-5 {
background-position: -260px 0;
}
.star-2 {
background-position: -57px 0;
}
.star-2-5 {
background-position: -241px 0;
}
.star-3 {
background-position: -38px 0;
}
.star-3-5 {
background-position: -222px 0;
}
.star-4 {
background-position: -19px 0;
}
.star-4-5 {
background-position: -203px 0;
}
.star-5 {
background-position: 0 0px;
}
用来定义不同的star,再绑定到Showdown中
window.Showdown.extensions.star = star;
便可以将之作为Showdown的plugin。
##其他
代码: [https://github.com/phodal/showdown-star](https://github.com/phodal/showdown-star)
</level([0-9]*\.?[0-9]+)></level([0-9]*\.?[0-9]+)></level1.5></level1></code></pre></pre></code></code></pre></code></pre></level3.5></level3></level1.5></level1>