happypeter/onestep

haoqicat.com 代码

haoqicat.com 源码

• client 浏览器主站
• admin 后台管理系统
• api 服务器端代码

onestep's Issues

github style ABOUT pages

v0.5 发布啦。。。

代码状态

77b582b

完成功能

1. 发评论，点击课表的下一个视频都 ajax 化了

存在问题

1. ajax 本身固有的 url 不更新带来的问题，考虑使用 Pjax，在未来

v0.7，发布啦。。。

代码状态

7412dca

实现功能

1. 很牛的博客 #40
   1. 可以上传图片，并且图片宽度可以调整到适当

测试

1. 帐户

   ID: admin
   PW: 111111
   

然后到 http://www.hpcasts.com/write_blog 就可以开始写了

TODOs

• #23
• #20
• #64
• #411
• #651

SEO

http://www.googlekeywordtool.com/

For Courses#index

http://www.youtube.com/user/dell1032?feature=watch

Looks nice.

V0.1 发布啦。。。

代码状态

b5eb49c

完成的功能

• 用户可以注册并登陆 #5
• 用户可以在首页上看到课程列表，并可以新建课程 #13
• 打开具体某一门课程，可以看到课程详情，并可以播放课程 #18

反馈并迭代

@limingth @asmcos @luckyyang 大家多批评，大家的智慧会体现在下周我们要发布的 V0.2 版中

v0.3 发布啦。。。

代码状态

a31cb2c

完成的功能

#25

• 采用了 twitter bootstrap，页面布局可以自适应手机屏幕
• 更新了网站主页，配合市场宣传
• 主要都是前端，其他基本没动

反馈与迭代

大家帮忙看看手机上显示会不会有问题

i18n

unicorn+nginx in development environment

Add user auth

This time rails3.1 gives us has_secure_password, things get much sweeter!

http://railscasts.com/episodes/250-authentication-from-scratch-revised?autoplay=true

v0.4 发布啦。。。

代码状态

2e4ab0d

完成的功能

#31

• 只有 admin 可以创建和管理课程了，普通用户只能观看并发评论。（ ID：admin PW: 111111)
• courses#show 页面有了更好的外观

ours intro

项目介绍的初稿，收集意见

http://luckyyang.github.com/blog/2012/12/03/wo-men-yao-cheng-wei-yi-ge-shi-yao-yang-de-gong-si/

设计在线编程教学系统的一些技巧

http://worrydream.com/LearnableProgramming/

http://devbootcamp.com/ 牛啊

又是 rails 社区的

http://devbootcamp.com/

v0.8，发布啦。。。

URL structure

Mainly working on #12

now we have

hpcasts.com/0123-course-name
hpcasts.com/blog/1-site-news

A course shall belong to a category, or has tags

tags or category, this is a question?

Video Links for testing

下面是一些测试用的视频，大家可以创建一门新课测一下。

http://media.happycasts.net/course-name/intro.mov
http://media.happycasts.net/course-name/v1.mov
http://media.happycasts.net/course-name/v2.mov
http://media.happycasts.net/course-name/v3.mov

Responsive design

http://twitter.github.com/bootstrap/scaffolding.html#responsive

you don't have to write media query yourself, cause bootstrap provides .visible-phone and the like.

onestep, why the name?

one step one time, learning should be fun!

onestep is just the codename, but I love it, this give me a feeling of solid work.

网站美工设计

from @asmcos 这周我准备花钱找个美工制作hpcasts首页面。如何？

add admin roles

There is a super admin named admin

then common users have a "afmin" fileld in db, if it's not Null ( say 1 )
then user.admin? return true.

On top of that I can use cancan

前端设计宏观

我的意思就是，照抄 github，除非必要，github 上怎么写，我们就怎么写。

但是：

1. 颜色主题要换，github 用蓝色较多，我们可以改用绿色
2. 再从其他各种网站上抄各种元件。要求就是要和 github 的全白 background 配合好。

google analytics 和单页访问计数

http://www.youtube.com/watch?v=XZDUWd_ezcI

GA tutotial

基本需求

From @asmcos

我希望在公益网站首页添加 《千人免费学》 公益活动。
内容：
1. 展现各个学习课程；
2. 点击可以进入到每个课程；
3.课程页面，包含：授课老师，课程资源（教材，视频，网络资源），学生（已经学习的，将要学习的），课程讨论问答

每次发评论，视频都会自动播放，很讨厌

Bootstrap things

check also issue #25

没有封面图的课程应该显示默认图片

每次去检查 img url 是否是 200 太慢了，用 File.exists(‘file/patch') 又太死板了。

参照 https://github.com/daqing/rabel 的 has_avatar? 函数

A course has many videos

http://jqueryair.com/levels/5 has "chapter list" for each video, nice but not as nice as lynda.com style.

Why not we just have many micro videos, and organize them with a book-like index.

If each video is short, it's also to update some, if some errors occur.

ajaxify 课程表点击事件

当用户点击某门课时，整个页面刷新，太晃眼。弄成只有播放器部分刷新才爽。

一些 ui 设计的参考资源

Cool UI design, shared by @asmcos

http://www.wendyshijia.com/

Blog

github 是这种格式的 link:

 https://github.com/blog/1311-html-pipeline-chainable-content-filters

由于咱们这里的博客以中文为主，所以就这样吧：

http://hpcasts.com/blog/2

Logo

http://openclipart.org/detail/168617/silhouette-of-horse-by-keistutis

I love horses

a lynda.com course on logo design

http://www.lynda.com/Illustrator-tutorials/designing-a-logo-hands-on-workshop/673-2.html

if you are going the invite people to test your site, it has to look alright

CSS kongfu!

capistrano

部署工具

Udemy.com

@asmcos said it's quite we want.

v0.2 发布啦。。。

代码状态

2f0cb7c

完成的功能

#21

• 用户新建课程之后，课程页面会显示“课程表为空”
• 这时可以添加第0个视频，这个是“课程内容简介”
• 接下来可以添加正课： 第一节，第二节...
• 这样课程表就生成了，点击哪一节课，那节课的标题就会高亮，同时播放器会播放这节课

反馈与迭代

下面是一些测试用的视频，大家可以创建一门新课测一下。

http://media.happycasts.net/course-name/intro.mov
http://media.happycasts.net/course-name/v1.mov
http://media.happycasts.net/course-name/v2.mov
http://media.happycasts.net/course-name/v3.mov

有一个问题是，在极端糟糕的网络条件下，播放器会只缓冲，不播放。大家在自己的机器上帮我看一下，有没有视频打不开的情况？
@limingth @asmcos @luckyyang

URL 的结构

github ： github.com/username/projectname
lynda.com: lynda.com/category/classname
udemy: udemy.com/classname

Which is the best for us?

Bootstrap the whole site

Yes!

网站总体结构

by @asmcos

我们做3级页面？
一级：首页，
二级：展示某门课程：例如，rails入门blog, 5天 ，ruby基础的3次课程，rails基础3次课程，数据库，模板，。。。。
三级：展示 ruby基础的3次的第一次，安装和使用

image upload

http://rabelapp.com/t/177

gem 'carrierwave', "~> 0.6.2"
gem 'carrierwave-upyun', '~> 0.1.6'
gem 'rmagick'
gem 'mime-types'

Admin 可以创建课程

• 创建课程本身有相应的 web 界面，但是上传图片视频还是要通过命令行来做。

Anybody can create comments on each course

Lynda.com does not have commeting area, and udemy has reviews, not for each of the video, for the whole course.

video player

No light-box, user must be able to write comments while watching the video.

用户个人主页

it will be like github

url/happypeter

if user try to signup using my shit in route.rb, like they want to use logout as his username,
the site will tell him "Username is a reserved word", like github does.

For courses#show

视频录成宽屏（16：9）还是标屏（4：3）

一下是一些知名网站的做法：

lynda.com use 16:9
railscasts.com user 120:75，最早也用 4:3，现在用宽屏，不过比 16：9 窄一点
teamtreehouse 16:9
优酷： 16：9
codeschool.com: 标屏 4：3

hpcasts.com 的商业模式

by @asmcos

最近我邀请了4、5位好友为hpcasts.com录制视频。
大家会问到：hpcasts.com将来做成什么样？商业？非商业？如果是商业如何盈利？

我把我的想法说说，大家讨论讨论。

hpcasts.com 是提供视频学习的社区。
不仅仅是视频，还有在线编程，在线答题、答疑。

学习内容包含如下：
（1）按照级别分类
基础、中级、高级。也是所谓的从入门到精通。
（2） 按照老师分类
海外IT专家（主要是华人）、国内IT专家、高校老师、普通IT工程师
（3）内容分类
IT基础知识，编程语言，独立项目

费用：
（1） 收费比例
20% 内容 免费
80% 内容 收费

（2）收费方式
包月每个月100-200元，观看任何视频

老师收益：
按照月收入结算；
总收入减去 运营比例（30%）剩下70% 分配给全站老师。
每位老师的费用按单月视频观看量平均分配。

观看量的计算方法：
视频播放5分钟以上才计算次数；
每位学生 重复观看同一视频的只能算1次。

Deploy Rails on Ubuntu server 12.04 with Nginx, Unicorn, Mongodb, Mongoid

https://gist.github.com/3696537

v0.6 发布啦。。。

代码状态

5387079

完成功能

1. 课表的 ajax 去掉了
2. 博客 #40
3. 图片上传到 upyun.com #41

测试

1. 写博客： http://www.hpcasts.com/write_blog
2. 发图： http://www.hpcasts.com/upyun_images/new