随着春节的临近,忙碌了一年的小伙伴们,是不是都已经踏上了回乡的列车?我呢也终于在春节前,完成了 HelloGitHub.com 的重构。
HelloGitHub.com 是我在 2017 年的时候用 Flask+jQuery 开发的网站,最初的想法很简单就是为了方便管理和发布《HelloGitHub 月刊》,上线后这一用就是 5 年。
随着编程技术的不断发展,当年构建网站用的技术栈已经有些过时了,再加上之前网站的内容是围绕月刊而不是开源项目构建,很难再开发更多的功能,很大程度上限制了它的发展。所以我在 2022 年初的时候,决定彻底重构 HelloGitHub 网站,将它做成一个围绕开源项目的社区,用户可以在里分享、评论、打分开源项目,就像开源项目的豆瓣。
经过一年的努力,全新的 HelloGitHub.com 社区终于顺利上线,我是越用越顺手、越看越喜欢,虽然她入世未深还有很多不足之处,但俗话说的好”丑媳妇总得见公婆“,而且这不是快过年了嘛,也是时候介绍给大家认识了。
下面,就让我带大家走进这个专注于开源领域、类开源版豆瓣的开源社区——HelloGitHub
我建立 HelloGitHub 的初衷很简单,就是想让优秀的开源项目被更多人发现和喜欢,随着开源的蓬勃发展,优秀的开源项目如雨后春笋般层出不穷。每月一期的 HelloGitHub 月刊,每期收录的项目从第一期不到 20 个,现在已经提高到了近 40 个,但是就算是这样还是有很多优秀的开源项目,会因为月刊的篇幅有限而无法入选。
既然月刊限制了推荐开源项目的数量,那我就将月刊页面打散做成信息流的样子。这样虽然月刊收录的项目有限,但那些没有收录到月刊的开源项目,也能出现在 HelloGitHub 网站的首页,让更多人看到。
所以,我就把 HelloGitHub 网站的「首页」改成了信息流,这里不仅有月刊中的项目,还有未能入选月刊但同样优秀的开源项目。这样一来,用户不仅可以看到更多的开源项目,同时也可以让没能入选月刊的开源项目,获得流量和关注。
为了做出上述的功能,我需要将原本核心的月刊表和开源项目表进行重新设计。因为,之前 HelloGitHub 的数据都是围绕月刊,像 Star 数、链接等开源项目的信息,只能算是月刊内容的扩展项。现在要倒过来将月刊内容变成开源项目的扩展内容。
这就相当于把月刊打散,最小单位从月刊改成开源项目,从而实现围绕开源项目的首页信息流,以及根据标签过滤开源项目、搜索等功能。
接下来,随着项目的独立「开源项目详情页」也就顺势而生,用户可以在这里查看更多关于该项目的信息,比如:项目评分、是否包含中文、主要的编程语言、是否活跃和开源协议等。
除此之外,还可以执行点赞、收藏、分享、访问项目、评论、评分等操作。
用户是社区的核心,用户对开源项目的评价是这个社区的价值所在。经过一番思考和调研,我又重新设计和修改了一版「详情页」,突出了用户最常用的访问项目操作,最关心的评分,并将点赞、评分等操作变得更加醒目。
如果将 GitHub 上的开源项目信息比作产品成分表,那么 HelloGitHub 上的标题、附加描述、用户点赞、评论和评分就是产品包装。我认为大多数开源项目作者都是程序员,他们喜欢醉心于项目的研发,但不愿花力气去想宣传语、写文案、做推广。
既然如此,我就想出了一个组合:你负责用代码改变世界,HelloGitHub 来为你带上奖章。所以我做了「网站徽章」的功能,用户可以通过一键复制代码,将项目在 HelloGitHub 获得的点赞数展示出去,并且点击该徽章后可直接进入到开源项目的详情页,开源项目的潜在用户不仅可以方便地查看其它使用者的评价,还可以留下自己对开源项目的看法。
我经常说“不懂编程的人也可以为开源做贡献”,在 HelloGitHub 一个点赞、一个评论、一个分享,都是在为你喜欢的开源项目做贡献。
这次网站改版的幅度有些大,导致有的老用户刚进来有些懵,找不到之前用的功能了。其实旧功能一个都没有少,我只是将他们的入口整齐地放在了 header。
不仅如此,我还对旧网站的月刊、编程语言排行榜、文章等模块做了移动端适配。
以及一些细节优化,比如:月刊内的目录、期数选择、增加了详情页的入口等。
网站还增加了黑暗模式,需要登录后才能看到切换黑暗模式按钮,就在用户头像的旁边。
除此之外,这里还展示了用户等级和贡献值,下面介绍下获得贡献值的 2 种方式:
分享项目的按钮分别在首页「提交项目」和月刊「推荐」,现在分享开源项目时只要输入想要分享的项目链接,就能立刻检测出项目是否被推荐过,不仅可以有效地防止项目重复推荐,还可以避免最后提交时才发现项目已经推荐过,白写推荐语的悲剧。
重头戏来了,通过「我的主页」可以进入到个人首页,这里有你的贡献值动态、评论记录、收藏的项目,而且收藏夹不仅可以自己看,还可以支持「公开收藏夹」从而让更多人看到你精选的开源项目集。
至此,HelloGitHub 社区的功能就介绍完毕了,下面聊一聊网站背后的技术栈、开发过程和贡献者们。
HelloGitHub 一共由 4 个项目组成:
2022 年初,我下定决心要重构 HelloGitHub.com 的时候,做的第一件事是重启管理后台的 Taichi 项目,因为这样不会影响还在运行的网站。目标是将管理后台的功能做成前后端分离,并且实现用它制作并发布月刊。
Taichi 创建于 3 年前是网站的管理后台,用的还是老版的 Antd Pro V2,基本处于荒废的状态。一开始我和猴子在旧的项目上开发,进度十分缓慢。后来项目新来了一位叫 我是油条 的前端同学,贡献了几个功能后,开始吐槽项目的 antd pro 太老了,想要升级一下。
我同意了,但讲真的我根本没抱什么希望,思想上的巨人行动上的矮子我见多了,结果当天下午他就用 V5 将 Taichi 重写了一遍。虽说我被啪啪啪地打脸,但还是开心地笑出了猪声。这个沉寂了多年项目,终于要开足马力往前冲了!
后面的三个月,我就专心写产品文档和接口,油条负责写前端,在 6 月份的时候,我如愿以偿地在 Taichi 上面制作并发布了《HelloGitHub》第 75 期月刊。
再次感谢我是油条让我在有生之年可以用 Taichi 出月刊。
用新的管理后台发完月刊后,我又马不停蹄开始了新的项目:Geese 社区前端。
因为新社区也要做成前后端分离,再加上我想将部分页面(月刊)做成服务器端渲染(SSR),所以最终就选择了基于 React 的 Next.js 框架。然后原子 CSS 框架在国外比较火,我一想反正我也不会 CSS,用哪个都得现学,索性就用最新、最流行的吧!所以最后项目的采用了 TypeScript+Next.js+Tailwind CSS 技术栈。
万事开头难,我花了一周时间,边看 Next.js 和 Tailwind 的文档边搭建项目。
我自己一个人开发实在是太慢了,所以 7 月份的时候,我写了篇文章《求助!网站重构需要帮手》寻求帮助,众多大神纷纷伸出援助之手,有人贡献代码、有人修复 bug、有人帮忙部署。六个月后的 Geese 共有 400+ commit,7 位贡献者,感谢各位的帮助,你们每一位都是我的英雄!
这里要特别感谢 RJM1996(如故)和 zhangzhonghe(被雨水过滤的空气)两位贡献者,他们完成了项目收藏、评论、月刊等核心功能。没有你们的参与和支持,我无法顺利完成 Geese。
最后说一下数据这块,后端和爬虫这块由我一个人开发完成,没什么可说的。
主要的困难在数据处理这块,为了更好地介绍开源项目,我为项目增加了更多的相关信息,比如:标题、标签、官网和文档链接等。这些都需要人工一个个处理,这个时候我们熟悉的小鱼干就来帮忙啦!但架不住项目太多,目前还差 1500 多个项目没处理。
这些未处理的项目,因为信息不全所以没有详情页,这就是为什么明明有的项目在月刊中,但是就是搜索找不到的原因。现在网站一期的功能已经开发完,后面我会全力梳理已有的开源项目,争取在 3 月份的时候全部搞定!
另外,因为登陆从之前的 GitHub 授权换成了微信授权,这是两套完全不同的用户系统,无法自动关联。所以老网站的用户数据需要人工迁移过来,如果有用户想要将旧网站的收藏夹数迁移到新社区,请联系我。
随着,全新的 HelloGitHub.com 上线,网站也从之前单一的展示月刊内容,升级到了支持用户互动的开源社区。这是一个新的高度也是新的挑战,因为我没有运营过社区,就像五年前我没有做过站长一样。我有些忐忑,不停地刷新着网站,仿佛一切又回到了五年前,过往种种浮上心头:不破不立、相辅相成、群策群力,我的眼神逐渐变得坚定。
不忘初心,方得始终。HelloGitHub 会牢记初心,一如既往地给大家带来有趣、优秀的开源项目。
最后,感谢大家一路走来的支持和陪伴,提前祝大家春节快乐,我们年后见!
以上就是本文的所有内容,如果您觉得这篇文章写得还不错,就请给我点一个赞,您的支持就是我更新的动力。
随着春节的临近,忙碌了一年的小伙伴们,是不是都已经踏上了回乡的列车?我呢也终于在春节前,完成了 HelloGitHub.com 的重构。 HelloGitHub.com 是我在 201