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

搞前后端分离实验,顺便撸了只博客~

  •  
  •   thonatos ·
    thonatos · 2014-11-29 23:00:21 +08:00 · 4279 次点击
    这是一个创建于 3631 天前的主题,其中的信息可能已经有所发展或是发生改变。
    \(^o^)/,
    上次撸到前后端分离的问题,
    决定要测试下淘宝“中途岛”方式,
    然后就来做实验了了,话说不了解情况的参考上一次的内容:

    地址: https://www.v2ex.com/t/149090#reply84

    No1.实现)

    话说就是参考上次的图来做,所以结构请参考上一篇文章了,不过顺便说一下吧。。

    1.入口:nginx(80端口)

    2.反代:内网的一台nodejs服务器(端口3000?or whatever you like ~)
    node服务器暂时用expressjs来做,入口就是简单的页面了

    
    3.请求: http/https方式请求数据
    团队内的系统接口没什么数据,就撸了github的数据,
    github请自行搜索,还顺路看到一个基于它的组件,有兴趣的去看看~
    http://mikedeboer.github.io/node-github/

    4.渲染:
    撸github的数据就是为了顺便弄博客嘛,那就用marked把撸到得md文件转成html吧,对了,github给的数据是base64的,要转换一下:
    var _raw = new Buffer(result.content, result.encoding).toString('utf8');
    var _html = marked(_raw);

    No2.博客)
    太懒无解,平时虽然一直开着浏览器,但是真不想开wp写博客(好久没更新了,回头关了得了~),hexo是挺好用的,不过,反正做实验已经写了一部分,不如再写一点了得了,这博客大概是这样:

    1.在github上建一个专门放博客内容的repo,记录一下放在程序的配置里。

    2.服务器部署好程序,访问时抓取github上某一个repo下得content,
    遍历size大于0是目录了,做成分类目录,反之就是文件了,循环一下做成文章列表页面。

    3.本地pull下来,无聊时候打开Mou假装写文档吧(....)

    4.写完push一下就完事了~

    No3.演示)

    很蛋疼的用别人的文章做下演示吧,好丑,不要介意 T.T

    列表页:
    
    文章页:
    
    轻喷~
    第 1 条附言  ·  2014-11-30 05:50:00 +08:00
    好吧,我实在是很蛋疼,测试好了~

    Demo):
    http://to-fuck.me/

    About):
    文档存储在github,
    https://github.com/thonatos/Mt.Notes.And.Documents

    Server):
    服务器是在国外弄到国外的Vps上了,这样拿数据速度快一点~

    貌似没什么技术含量,不过为建爬虫做好了准备有木有,T.T,为种子站做好准备了!

    Future):
    作为前端狗,自然要加入很多蛋疼的功能,请留意console哦~
    21 条回复    2014-12-02 20:08:28 +08:00
    jkjoke
        1
    jkjoke  
       2014-11-29 23:02:04 +08:00
    没找到喷点,虽然看不懂但是觉得很厉害
    thonatos
        2
    thonatos  
    OP
       2014-11-29 23:05:28 +08:00
    @jkjoke

    赤果果的羞辱啊,本地测试真慢,拿墙外的数据真是醉了~
    儿时伟大的梦想,感觉有希望完成了!
    thonatos
        4
    thonatos  
    OP
       2014-11-29 23:16:58 +08:00
    @Jason_C

    又是一个博客么。。。这算小广告(⊙_⊙)?嚒,好像还没写完吧,要做个什么呢~
    Jason_C
        5
    Jason_C  
       2014-11-29 23:21:53 +08:00
    @thonatos 不仅仅是博客,我们写框架,如果你对前后端分离有兴趣,先可以去研究下我们这个,反正我是伪前端~
    thonatos
        6
    thonatos  
    OP
       2014-11-29 23:40:17 +08:00
    @Jason_C

    好,有时间仔细去研究一下,加油喽~
    Jaylee
        7
    Jaylee  
       2014-11-29 23:54:59 +08:00
    说写了一个什么东西,一叫『撸』,逼格立马高了不少。
    thonatos
        8
    thonatos  
    OP
       2014-11-30 00:35:05 +08:00
    @Jaylee

    说的好有道理,我竟无言以对?
    kmvan
        9
    kmvan  
       2014-11-30 00:37:14 +08:00
    没demo网址吗?
    thonatos
        10
    thonatos  
    OP
       2014-11-30 00:46:59 +08:00
    @kmvan

    还没push上去,还要想想分类目录怎么处理,还没想明白~
    还在本地测试,大概是这样:





    loading
        11
    loading  
       2014-11-30 06:40:37 +08:00 via Android
    我看你的demo地址就知道你病得很重。
    thonatos
        12
    thonatos  
    OP
       2014-11-30 06:55:28 +08:00 via Android
    @loading

    ……我能说脏话嘛!靠,域名转移中,就这一个空的域名了好吧,这可是我为未来种子站准备的!
    jimwoo
        13
    jimwoo  
       2014-11-30 13:17:32 +08:00
    干嘛用的??
    wsph123
        14
    wsph123  
       2014-11-30 14:45:41 +08:00 via iPhone
    好demo!
    thonatos
        15
    thonatos  
    OP
       2014-11-30 15:37:35 +08:00 via Android
    @jimwoo

    demo大概是一个伪博客的样子,差不多是半个爬虫,不过目前是用Github Api来拿文章,比较适合蛋疼且够懒的人,——如我,以后写博客就在本地写完push一下就好。。

    不过,实际上,这是在用“中途岛”方式进行前后端分离的试验,算是在给后端减少工作量……只是,貌似不加工资的样子?←_←

    @wsph123

    这域名,真的是极好的,╮(╯▽╰)╭
    wsph123
        16
    wsph123  
       2014-11-30 15:46:34 +08:00
    为什么demo OAQ 看不到哪里有前后端分离OAQ


    前后端分离我这也做过很多尝试,有机会可以交流交流~
    xxghost
        17
    xxghost  
       2014-11-30 15:48:53 +08:00
    域名不错
    thonatos
        18
    thonatos  
    OP
       2014-11-30 16:51:48 +08:00 via Android
    @wsph123

    数据接口呀,是在Github上……怎么会看不到-_-||。

    好啊,回头一起交流交流,么么哒
    wl591475365
        19
    wl591475365  
       2014-12-01 10:10:13 +08:00
    @thonatos

    这件事和farbox的原理好像差不多
    thonatos
        20
    thonatos  
    OP
       2014-12-01 11:16:52 +08:00 via Android
    @wl591475365

    第一次听到那个名字,去看了下介绍,有点类似,不过……我是顺便弄的。
    Saber
        21
    Saber  
       2014-12-02 20:08:28 +08:00
    这域名略吊。。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1012 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 21:52 · PVG 05:52 · LAX 13:52 · JFK 16:52
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.