Habitica Wiki
Advertisement
Habitica Wiki
Coding 3 by phoneix faerie-d7idtti.png

铁匠对Habitica的成功来说至关重要。你的贡献是被需要和感激的!使用你的编程技能为网页版和移动应用程序做出贡献有好几种方式。要想了解可以做些什么,阅读这些页面和页面导向的链接是重要的第一步,然后加入Aspiring Blacksmiths (Habitica Coders)公会询问任何你可能想知道的问题。

也一定要阅读本地搭建Habitica获取关于准备开始的重要信息,然后阅读Using Your Local Install to Modify Habitica's Website and API学习如何更改代码的过程。

提供帮助的方式[]

网页端[]

下面是如何根据你想做出的贡献而找到要做的项目的提示。在所有情况下,先检查项目的当前状态,看看是否有其他人正在积极地处理它(例如,如果有一个pull request与之关联,那么说明有人已经提交了一个修复)。如果最近已经有其他人评论说他们正在处理某个Github issue或Trello card,请把工作留给他们。但是,如果距离他们最后的评论已经过去很久了,他们可能已经没有时间为Habitica做贡献了,那么你可以询问一下你是否可以接管它。。

在你开始工作之前,在GitHub issue或Trello card上发表评论来表明一下你有兴趣解决某个问题是很重要的,然后等待管理员的回复。这是因为有些问题和功能请求并不总是适合于更改(例如在代码重构期间)。即使是下面列出的GitHub Labels上的问题也是如此。根据问题或功能,最好描述一下你建议的方法,以便管理员能够评论它是否合适。

  • 我想从小事做起:查看the Github issue queue,并搜索标签为good first issue的项目,在那里你可以请求对问题做出贡献。
  • 我想在最需要我的地方帮忙:在Github issues中搜索标签为help wanted, priority: critical, 和priority: important的问题,并在开始解决之前申请做出贡献。解决一个有priority: critical 标签的BUG,你将会获得 致命碎虫锤。当我们努力完善最近的前端改动时,解决带有POST-REDESIGN标签的pull request将得到加速审查和贡献值。
  • 我想创建单元测试 & Karma测试!:欢迎,BUG清除者!进一步的信息请参阅"Creating and Running Automated Tests" section in "Using Your Local Install to Modify Habitica's Website and API"
  • 我想要 构建 东西!:为新英雄开路!关注issue queue,因为工作人员有时候会为那些已经批准实施的新的功能创建issue。如果你在那里找不到你感兴趣的东西,你可以浏览一下Trello feature queue,但是,首先要确定你选择的功能请求是否得到了员工的批准,这一点非常重要。一些功能建议并不适合被实现,实现了它们的pull request将不会被接受。

除了上面列出的标签外,网站的仓库中还使用了其他标签。你可以在GitHub Labels中了解到它们,但是上面列出的这些标签在寻找有用的问题去解决时最有帮助。

iOS移动应用[]

  • 如果你想对iOS应用程序有所贡献,Issue list包含了已经被请求添加的功能和已知bug的列表。你可以自由地浏览它们,找到你想要解决的问题。为了避免重复的工作,应该在你打算处理的问题下留下评论。如果你想要处理一个还没有在issue list中提出的功能特性,请先创建一个,以便讨论实现细节。

Android移动应用[]

  • 如果你想为Android应用程序做贡献,Issue list包含了已经被请求添加的功能和已知bug的列表。你可以自由地浏览它们,找到你想要解决的问题。为了避免重复的工作,应该在你打算处理的问题下留下评论。如果你想要处理一个还没有在issue list中提出的功能特性,请先创建一个,以便讨论实现细节。

BountySource[]

有些issue会有BountySource赏金,由工作人员或用户发布。如果你针对这些问题的修复被接受,你就可以索要这些赏金作为回报。在其他方面,对待这些问题与对待没有赏金的问题的方式是一样的,所以同样要遵循所有标准的指引(例如,首先要询问你是否可以处理这个问题)。

网站技术栈[]

Habitica网站所用的技术如下所示。你不需要熟悉所有的,甚至不需要熟悉大部分的,就能做出贡献!一些高质量学习材料的链接也包括在内。这些技术(那些在名称或者URL中带有“.js”或'JS'的)中有许多是基于编程语言JavaScript,你可以在这里学习

服务端[]

技术 更多信息
ExpressJS
Node.js 我如何开始Node.js开发

nodeschool -- 一个特别有用的入门级互动Node课程。

MongoDB 官方MongoDB文档

查看下方MongoDB章节以获得一些简短的提示。.

MongooseJS
Gulp 你可以在 Gulp GitHub 页面了解相关信息
GitGithub Pro Git -- 花点时间阅读这个极好的资源将帮助你更加熟悉Git。

git-it -- nodeschool 课程中的这一有趣的交互式的部分将有助于学习Git 和Github。(向下滚动查看更多信息。)

ESLint HabitRPG项目的Eslint配置

客户端[]

技术 更多信息
Bootstrap
SCSS (SASS)
Vue.js Vue.js为站点提供响应式的前端。Habitica的管理员推荐这些学习资源:


测试[]

技术 更多信息
Mocha

逆向工程需求文档[]

2019年6月,Brasília大学的学生因为一个项目分析了Habitica。他们的目标是逆向工程Habitica的网站,以开发需求工件。这个部分显示了两个他们开发的丰富的图片。丰富的图片是一种通过图表探索和表达情境的方式,并显示它的流程。虽然这些图片不是官方的Habitica文档,但是它们可以帮助新的代码贡献者理解这个站点,并帮助开发特性和修复bug。点击每个图片查看放大版。

这些图片来自他们的Wiki项目 https://requisitos-habitica.netlify.com.

A Rich Picture showing the general flow of Habitica and how Habitica uses its gamification system to solve the problem of boredom when working on tasks.

A Rich Picture showing the Habitica's Inventory system.

在本地运行环境中工作[]

铁匠应该创建一个本地运行的Habitica实例,用于测试和开发。创建本地实例的过程可能比较困难,因此我们收集了每个操作系统的步骤:本地搭建Habitica

使用本地安装进行更改和pull requests的过程在Using Your Local Install to Modify Habitica's Website and API中有描述。

MongoDB[]

为学习如何使用MongoDB,我们建议阅读官方MongoDB文档或其他更可靠的线上资源,但是这里有一些基本命令的示例,可以帮助新开发人员快速理解使用MongoDB。你可以在MongoDB命令行接口(CLI)或使用例如Robo 3T IDE'的GUI工具运行这些语句。

在下面的命令中, $ 符号代表着Unix, Windows或Git Shell提示符,> 符号代表着Mongo CLI shell提示符。只在你的命令行中键入 $ 或 > 后出现的文本。

以下是语句是访问Mongo shell,然后选择你本地安装的Habitica数据库:

   $ mongo
   > show dbs
   > use habitrpg

或者,直接在启动shell的时候指定数据库:

   $ mongo habitrpg

查看数据库中的“集合” ("users", "groups"等):

   > show collections

查看“users”集合中一个用户的完整“document” (用户的User ID为12345678-b5b9-4bb4-8b82-123456789abc):

   > db.users.find({_id: '12345678-b5b9-4bb4-8b82-123456789abc'})[0]

只查看用户文档中的 preferences 对象:

   > db.users.find({_id: '12345678-b5b9-4bb4-8b82-123456789abc'})[0].preferences

使用带有 $set的 update 方法为用户更改一个值:

   > db.users.update({_id: '12345678-b5b9-4bb4-8b82-123456789abc'}, {$set: {'profile.name':'New Display Name'}})

Using Your Local Install to Modify Habitica's Website and API 提供了用于特定目标的高级示例,这些示例可能在测试你的代码更改时会对你有用。

可翻译字符串 (本地化文件)[]

可翻译字符串出现在 website/common/locales/en 路径下的文件中。每个字符串都由一个key和一段文字组成,例如:

   'clearAll': 'clear all items',

不要编辑 website/common/locales 下其他目录中的文件,因为所有的翻译都在Weblate中管理

你应该每次都在本地安装中测试你对字符串的编辑和修改。永远不要想当然地认为,即使是简单的字符串添加操作也会像预期的那样工作。

添加可翻译字符串[]

要添加新的可翻译字符串,请在Vue或JavaScript文件中使用 t 函数将其写入。例如:

   env.t("newKey")
   i18n.t('newKey')

为示例查找要修改的文件中的现有字符串。

然后,在 website/common/locales/en目录下,编辑相应的json文件,添加新字符串如下:

       'newKey': 'String Title',

如果json文件中已经有关于相同主题的字符串,那么最好将新字符串添加到与现有字符串相同的位置,以便保证类似的字符串能被放在一起。

如果没有类似的字符串,则将你的字符串添加到文件的末尾。先将逗号添加到之前曾是文件中的最后一个字符串的末尾。不要在你添加的字符串后面加逗号。

修改可翻译字符串[]

现有的字符串在必要时可以随时更改。

除非有充分的理由,否则不要更换key。例如,如果你需要将字符串“'clear all items”(清除所有物品)更改为“delete all items”(删除所有物品),你不用将其对应的key也从“clearAll”更改为“deleteAll”,因为原始key的含义仍然是准确的。

key通常不进行更改的原因是它们可以被Habitica代码中的多个地方引用,所以一旦更改所有这些代码片段都需要更新;除非有充分的理由,否则这是不可取的。此外,当一个key被更改,翻译人员要在没有原始翻译可以作为对照的情况下重做翻译。请注意,当有理由更改key时,仍然不应该为英语以外的语言修改locales目录。

图像[]

有关为Habitica创建新图像的信息,请参见艺术家指南

当图像已经拟定好并且获得了工作人员的批准后,一个issue将会被创建以用来请求将图像添加到Habitica。
然后铁匠需要将其添加到库中。大部分图像需要复制到 website/client/assets/路径中合适的子目录下。

在添加新图像或现有图像的新版本之后,运行 npm run sprites来重新编译图像的spritesheet。

有时,这个命令会导致创建一个新的spritesheet,在这种情况下使用git add来添加新文件。
你可以在 website/client/assets/images/sprites/website/client/assets/css/sprites/下找到它们。

其他有用的命令[]

下面是各种有用的命令。

搜索代码[]

你经常想要搜索所有包含一些关键字或字符串的文件,以确定在添加/编辑某些特性时需要编辑哪些文件。使用 grep 命令(在您的操作系统上搜索关于grep的信息)或 git grep命令(git文档将教你如何使用它)。

偏好设置[]

Habitica为用户提供了自定义网站行为的偏好设置。如果需要,可以添加新的设置。请不要添加只有一小部分用户可能会使用的设置,或微不足道的个性化设置。相反,选择一个大多数用户可能喜欢的行为。 过多的偏好设置会使设置屏幕看起来杂乱无章,并增加了外观的复杂性。如果你不确定是否需要添加一个偏好设置,你可以在相关的GitHub issue或pull request中讨论它

当有必要添加一个新的用户偏好设置时,可以将其添加到website/server/models/user/下的文件中。通常,数据库会自动获取新设置并根据需要将其添加到用户帐户。如果需要手动修改数据库,管理员可以这样做。

"给开发者的信息" 普通Wiki页面上的部分[]

在一些wiki页面的底部,有一些称为给开发者的信息的部分。这些部分包含了与页面内容相关的对铁匠有用的提示。

信息隐藏在一个剧透样式的显示/隐藏切换按钮后面,所以对于非技术用户来说,这一部分不会使页面变得混乱。

这些部分使用 {{InfoForDevs Start}} and {{InfoForDevs End}} 模板来确保按钮和其他文本的格式的正确性。要查看这是如何实现的,请在源代码编辑器中打开任何带有给开发者的信息部分的页面。

要查看此部分的所有页面列表,请使用"What links here" 工具查看链接至 'Start' 模板的页面.

要想默认不隐藏所有给开发者的信息部分:

  • 创建一个Wikia帐户,如果你还没有的话。
  • 编辑你的个人Wikia css文件,位于 http://habitica.fandom.com/wiki/User:这里填写你的用户名/wikia.css
  • 将这几行添加到CSS文件中:
   /* 强制使所有"给开发者的信息" 区域一直可见 */
   .habitrpg-InfoForDevs {
       display:block !important;
   }
   .habitrpg-InfoForDevs-hideIfDev {
       display:none;
   }

User:LadyAlys/wikia.css中你可以看到一个例子。

贡献者等级进阶[]

你很幸运!铁匠不需要做任何特别的事情,比如完成一个贡献者等级请求(就像抄写员被要求做的那样),以获得贡献者等级。铁匠的贡献者等级将由管理员在审查和接受铁匠的提交内容时授予。管理员将跟踪记录铁匠的贡献积分,以便未来对贡献者等级升级。

铁匠的前一个或两个贡献者等级非常容易获得,你可能会发现完成一个pull request就足够获得它们了。更高的等级需要更多的工作,可能需要几个成功的pull request。每一个pull request完成时管理员将进行记录,当已经作出足够的贡献时会奖励一个等级。

一般来说,当一个PR被合并时,管理员会在PR和Hall of Heroes里写一些类似“我给了你x等级”(I've given you Tier x)或者“已记录到你的下一个贡献者等级中”(Noted toward your next contributor tier)之类的话。如果他们写了一些类似于后者的东西,这意味着仅靠这一次的PR还不足以得到一个等级,或不足以提升你的等级至下一级,如果你已经有了其他一部分积分。如果管理员没有对你的PR作出有关贡献者等级积分的任何评论,提出到PR中来询问它!管理员有时确实会忘记,但他们总是喜欢温和的提醒,因为对贡献者的工作给予赞扬是很重要的。

另请参阅[]

Advertisement