V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
edfward
V2EX  ›  分享创造

Web 开发入门作 - 带关键词的 Reeder 网页版

  •  2
     
  •   edfward · 2016-01-06 06:38:58 +08:00 · 3510 次点击
    这是一个创建于 3243 天前的主题,其中的信息可能已经有所发展或是发生改变。

    已经研究僧了,想来自己还没做过什么 web 相关项目于是把上学期的某课程作业延伸一下当自己的 side project 。

    这是什么

    readkeyrss-en

    readkeyrss-zh

    ...没看错,这就是我照着 Reeder for Mac 默认 Reeder 主题像素级拷贝的一个网页简化版。很多贴心细节都没实现目前也就是看看像那么个样子(颜色确实是我从 Reeder 上取出来的...)。大大的勾勾是用来 mark as read 的,另外要说和 Reeder 有什么不一样的话是第二栏每篇文章标题下的不是概要,而是提取的关键词

    为什么做这么个东西

    1. 学习 web 开发。认真接触 javascript 也就是最近两学期内的事情,而且是一入门就接触大框架 angular 啊 react 啊,自己反而对基础的 js 都不太熟悉。所以这次就没用什么框架——好吧其实还是用了 jQuery 。顺便稍微系统地学习一下 CSS 相关(比如这次稍微了解了 flexbox 和 animation )。后端自己有经验,不过没有从零开始写过东西,这次也是来打怪升级的。
    2. 我是 Reeder 脑残粉, mac 版和 iOS 版都在用。但是比较恼火的是在 mac 上很难快速的 mark 掉不怎么感兴趣的文章(特别是订阅了一些更新很频繁的站点的时候)。所以有个想法是如果每篇文章有自己的关键词(或者文章总结)的话,我也许一眼望过去就能划掉那些自己觉得没什么意思的文章。这也是做这么一个东西的初衷。

    技术栈

    附上了 github 链接,求加星星交友。

    ReadKeyRSS,页面前端, ES6 + babel + webpack 。用了 jQuery 。

    ReadKeyServer,后端, repo 里介绍比较详细, golang ,用 gin 作服务器,go-pkg-rss 处理 RSS/Atom 。存储层是 Redis 。

    ReadKeyWord,关键词提取服务器,目前就支持中文和英文。中文是 HanLP 自带的基于 TextRank 的关键词提取算法(也是我老老实实选择 Java 开发的原因),英文是一个叫 RAKE(Rapid Automatic Keyword Extraction) 的算法的 python 实现,当成 Jython 程序整合进了这个服务器。基于 Spark web framework(此 spark 非彼 spark )。

    之所以用关键词而不用文章总结是觉得后者更难吧...

    网址在哪儿

    自己本来有个 512MB 的 digitalocean 机器,部署了发现好慢啊...忽然发现 AWS 里自己有上学期老师送的 100 刀 credit ,但是 1 月底就过期了。于是架了一台 m4 large ,争取花完钱。所以这次就当是内测,也希望大家提意见(因为问题肯定很多...)。

    地点是 54.172.65.245:8080,用户系统是直接用的 Auth0 ,要不然感觉自己写起来会很麻烦说不定还会写错...支持 google github 和用户名密码登录。

    以及添加 RSS/Atom 的时候需要具体 RSS/Atom 的地址,比如 http://zhihu.sellmoe.com/feed http://www.engadget.com/rss-full.xml 可以, http://www.engadget.com 就不行...这也是个 todo 。

    比较紧急的 Todo

    • 自己用了一两天后觉得很需要 mark all as read 的功能...
    • 关键词效果似乎不是太好,打算认认真真研究下那两个算法并比较一下。可能需要跟踪一下学术界 state of the art 的进展。
    10 条回复    2016-01-06 19:07:57 +08:00
    edfward
        1
    edfward  
    OP
       2016-01-06 06:41:13 +08:00
    以及添加 RSS/Atom 的时候需要具体 RSS/Atom 的地址,比如 http://zhihu.sellmoe.com/feed http://www.engadget.com/rss-full.xml 可以, http://www.engadget.com 就不行...这也是个 todo 。
    jucelin
        2
    jucelin  
       2016-01-06 08:40:23 +08:00
    RSS 里有 html ,但显示就直接显示了 HTML ,然后就是一大团
    edfward
        3
    edfward  
    OP
       2016-01-06 08:48:08 +08:00
    @jucelin 诶你指的是?我的确是直接把 RSS 的内容直接当 HTML 显示了
    heaton_nobu
        4
    heaton_nobu  
       2016-01-06 09:00:23 +08:00
    提个建议:按钮如果用 span 的话, css 里起码要把 cursor 设为 pointer
    edfward
        5
    edfward  
    OP
       2016-01-06 09:05:46 +08:00
    @jucelin 大概明白你的意思了,是内容显示为转义后的 HTML 了是吧(比如 <p&rt; 这种)。不过我手动试了试一些 blog (随机抽自 [Quora - What are the best programming blogs?]( https://www.quora.com/What-are-the-best-programming-blogs) 和 [知乎 - 优秀程序员的博客有哪些?]( https://www.zhihu.com/question/19934502) 发现并没有这样的问题)。
    edfward
        6
    edfward  
    OP
       2016-01-06 09:07:52 +08:00
    @heaton_nobu 好神奇!学习了...! CSS 简直博大精深!(感觉自己是个乡巴佬...
    jucelin
        7
    jucelin  
       2016-01-06 11:55:15 +08:00
    edfward
        8
    edfward  
    OP
       2016-01-06 13:17:59 +08:00
    @jucelin 检查了一下发现是 go-pkg-rss 在处理用 RSS1.0 Content Module http://purl.org/rss/1.0/modules/content/ 的 feed 的时候会把 content 那个 XML 节点转义然后存下...
    https://github.com/jteeuwen/go-pkg-rss/blob/31df4852b3d06032f59342013e6362526be0cd72/rss.go#L199

    大概我得用个 adhoc 的手段反转义回来...
    edfward
        9
    edfward  
    OP
       2016-01-06 13:58:41 +08:00
    @jucelin 用 regular expression 修了一下貌似可以了...



    判断 content 是不是满足那个 XML 节点的格式然后反转义。晚点再部署回服务器:)
    谢谢你找的这个 bug !
    movtoy
        10
    movtoy  
       2016-01-06 19:07:57 +08:00
    额,这个主题我打算抄袭了。。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   967 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 28ms · UTC 20:12 · PVG 04:12 · LAX 12:12 · JFK 15:12
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.