Web 开发者技能树 [移动版] 预览:陪你成为顶尖开发者~

2016-12-30 09:45:56 +08:00
 phodal

上周六陪我们家 @花仲马 去看一部狗血的电影《摆渡人》。在这期间,我又想到我伟大的技能树可以单独地出一个版本。于是,我就简单地先撸了一个 Demo 版本。

原型仍然还是原生的那个原型:https://github.com/phodal/sherlock,还是基于以前的 Skilltree 。

只是现在变成了移动版,除了可以当成一个 Android 应用、 iOS 应用,它还将作为 PWA 应用运行——这意味着,你可以在带有 Chrome 浏览器上安装离线这个应用。

先将自己的技能树的功能一个个的迁移了过来:

  1. 使用之前的 Sherlock 项目生成的 SVG
  2. 在 SVG 上添加事件绑定
  3. 准备并展示相应的数据
  4. 添加 TODO Lists 功能
  5. 完成 TODO 事项便点亮技能

由于是预览版,所以打开方式还是一样的:

  1. 点击技能进行详情页
  2. 在详情页里拥有相关资料的介绍,并且可以点亮技能

PWA 打开方式

步骤如下:

  1. 你需要安装一个 Google 的 Chrome 浏览器。
  2. 打开 「 Growth 技能树」的地址:https://phodal.github.io/motree/
  3. 待页面加载完后,点击右上角的菜单,选择「添加到主屏幕」

然后你就可以运行应用~~。

Android 用户也可以从 Google Play 上下载该应用:https://play.google.com/store/apps/details?id=ren.growth.skilltree

项目地址:https://github.com/phodal/motree

那么,你希望拥有什么功能呢?

2383 次点击
所在节点    分享创造
0 条回复

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/331159

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX