feathers

haoqicat.com 项目功能点

五六年前，haoqicat.com 其实是有个创世发布会的，当时有李笑来，rails girls 中国的创始人文洋，oneapm 的董事长何晓阳，还有一大批 rails 圈的创业者出席。当时是在中关村贝塔咖啡，我的 slide 上是这么写的：

好奇猫是一个视频课程的 Github

现在看来这个主意依然很棒。所以这次再版设计，我还是想坚持这个思路。

品牌色

用 cyan: #00bcd4

很多网站像商场的橱窗，华丽透明，是为了刺激人的消费欲望。咱们的网站是学习用的，要沉静。要想山腰上的木屋，青山小河是我们的意念灵感。取自然不取人工，取微风细叶，不取雷电猛兽。可汗学院在这一点上就很好。

github 的做法: http://primercss.io/

当前任务

• GIthub 的核心是 repo ，好奇猫的核心是 course 。
• GitHub 上每一个 repo 有一个 issues 作为讨论区，好奇猫上也专门为每一个课程创建 issues (讨论卡)式的讨论区。
• 要有“每日更新”页面，上面显示每天更新了几个小节的视频，每节视频都要有链接。
• 视频相关功能
  • 视频要能用空格暂停，要能连续播放，要能方便的播放下一节
  • 课程的更新历史要非常的突出，尤其是最近更新时间
  • 点击画面能够 toggle 暂停，播放
• 付费模式：
  • 会员订阅，每月7美刀，微信支付

搜索功能

暂时参考 egghead.io 的搜索体验。除了标题，还应该按照摘要来搜索，目前好奇课程中暂时没有摘要，可以把介绍视频的“技术点介绍”部分的文字稿作为摘要。摘要和标题内容，是允许访客搜索得到的。

基础数据结构

界面可以灵活变化，但是基础数据结构想变太难，所以一定要思考好。评论和用户信息管理这个先不聊，注意聊核心，就是文档内容的数据格式。

首先每个视频是有一个 id 的，也就是 course-name/video-name ，这个是全好奇猫的 uid 。uid 之下，可以有视频链接，有评论，有用户购买信息，这些都暂时不管，唯一关心文字稿这一项。

最近六年来，文字稿都是 markdown ，这个选择现在可以继续坚持。唯一的差异就是 markdown 中会插入：

bf66d53--update index.html

代码 commit 号，和 commit 信息，用两个中划线隔开。未来保存的唯一原始数据，就是保存到 git 仓库中的这样的 markdown 文稿，这个haoqi-markdown格式其实跟所有旧 markdown 也是完全兼容的，旧 markdown 中只不过就是没有 commit 号而已。

haoqi-markdown* （简称 hqm ）格式暂时是纯手写，未来可能用 web 界面去生成，但是都没有关系，保存后的文本就是 hqm ，其他的临时数据库信息都不用备份保存。

hqm 中有了 commit 号，配合课程 github 仓库。那么未来的转出格式就有无限的想象空间了，而且可以随时调整。

• 数据库设计

未来想法

• 所谓 Github ，当时很大的一个意思是可以让第三方的人参与进来
  • 这个依然是好主意，不过暂时可以先放一放
• 视频课程，每一个关注一个主题，所以，未来可以多弄一些学习路线图式的页面，或者直接录一些学习路线图式的大课程。

代码托管

目前所有代码都是免费获取的，存放到 github/happypeter/demo-haoqi 中

如果要封闭： https://developer.github.com/v3/repos/collaborators/#add-user-as-a-collaborator

所有代码托管到 github 仓库还是最棒的。

老用户登录

• 老用户进来，点登录可以看到两种登录方式：手机+密码 ，用户名+密码
• 老用户输入用户名后，弹出界面，立刻让大家绑定手机和重置密码
• 逐步淘汰：用户名+密码的登录方式

新用户登录

• 新用户点注册
• 只需要手机和密码
• 注册成功后可以到用户个人中心去设置用户名（包括头像等信息）
• 但是用户名只做昵称用，不做登录用

当然，上面指的只是过渡期，未来的第一登录方式是微信登录。

课程改版

• 课程应该可以提交新版，叫做 v2 ，v3
• 所有版本都应该可以在课程链接（ e.g haoqicat.com/antd ）上直接看到
• 最新版是直接展示的，老版本可以在页面上找到链接，例如 v1
• 用户一旦付费购买了老版本，新版本也自动免费获取的

付费服务

• 用户可以购买一门课程，例如费用5元，可观看期是一年
• 会员: 42块钱购买一个月，微信连续包月30块钱每月

支付选项

• 目前只支持微信支付

底层设计

• 文字稿放到 github 的仓库中，静态编译到 html 页面中
• 免费课程的文字稿有编辑按钮，指向 github 仓库对应页面