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

后端程序员用 Vue 写的导航页面

  •  
  •   yuanfnadi · 2018-03-06 17:48:56 +08:00 · 4248 次点击
    这是一个创建于 2439 天前的主题,其中的信息可能已经有所发展或是发生改变。

    demo

    优点: 纯静态。

    所以的图片使用 SVG。整个页面用 webpack 打包。包括全部图标仅仅 150kb。

    可以配置一个 yml 就可以自动的生成整个 HTML,再也不用重复性的写 HTML。

    已经写好 Dockerfile 打包放入 nginx 容器。仅仅 16.4MB 。

    https://github.com/DiamondYuan/diamond-navigation

    第 1 条附言  ·  2018-03-08 00:13:00 +08:00
    用了微信的 weui+vue 的 v-for。一下子就搞完了移动端的页面。
    不得不说。vue 真的是超级好用。太适合后端狗了。一下子就可以搞一个自己看得下去的移动网站。
    20 条回复    2018-03-08 14:38:58 +08:00
    yuanfnadi
        1
    yuanfnadi  
    OP
       2018-03-06 17:52:46 +08:00
    https://github.com/geekape/geek-navigation

    类似于整个项目。但是不需要手动写 HTML。只需要改一下 yml 文件就可以了。
    fangch
        2
    fangch  
       2018-03-07 12:49:42 +08:00 via iPhone
    有人收藏 没有人评论说支持一波👍
    wspsxing
        3
    wspsxing  
       2018-03-07 15:10:42 +08:00
    我也写了个导航,也是 Vue 实现(最初是原生 js),静态的可以编辑并导入导出 json 配置的简单页面(css 苦手)。
    挂在 Github Page 上就开始用了: https://biluohc.github.io/Cloud-home-Page/#/
    Github: https://github.com/biluohc/Cloud-home-Page

    多谢楼主的想法,看了楼主的后感觉可以加一个书签的页面,然后用侧栏分类。
    wspsxing
        4
    wspsxing  
       2018-03-07 15:19:08 +08:00
    对了,我没有适配移动端,uc 目前显示的勉强可以看,其它的我不知道 QAQ.
    ixx
        5
    ixx  
       2018-03-07 18:10:58 +08:00
    @wspsxing 看你的想法应该和我有类似需求推荐看一下 [简页]( http://jianpage.com) http://jianpage.com
    ixx
        6
    ixx  
       2018-03-07 18:13:05 +08:00
    Demo 地址打不开 看了 github 里的介绍样子和 创造狮导航很像
    wspsxing
        7
    wspsxing  
       2018-03-07 18:20:30 +08:00 via Android
    @ixx 嗯,多谢啦。
    请问这个定制的是要注册吗?然后要不要付费?然后可用性依赖你的服务器?
    notreami
        8
    notreami  
       2018-03-07 18:21:33 +08:00
    导航,我更喜欢,直接 js,jquery 都不用
    yuanfnadi
        9
    yuanfnadi  
    OP
       2018-03-08 00:10:43 +08:00
    @wspsxing 你可以看一下我现在的移动端。喜欢的话自己改一下 yml 就好了。
    wspsxing
        10
    wspsxing  
       2018-03-08 03:45:54 +08:00 via Android
    @yuanfnadi 嗯,感谢,等以后有空 copy 下布局,哈哈。其实我觉得那个简页的移动端布局不错,相对移动端的小屏幕紧凑实用。
    我是个标准的选择强迫症,三大框架都入门了,最开始是 angular,然后是 react,最后是 vue。angular 就体积太大了,移动端加载慢,感觉是还可以,react 的 redux 思想听起来还不错,然而用起来艹蛋的很,一旦使用了,你写的 react 应用重心偏移,噪声巨大,而且我非常怀疑这种手动分发字符串 key 的效率(反正知乎移动端在我这破手机上滚动不时卡的一动不动),代码大部分都是它相关的,还有 n 种异步 redux 中间件,恶心的要死,彻底弃坑,我从里面学到了生命周期钩子,单项数据流,redux 的概念。最后是 vue,感觉是某种程度上的取二者之长,既可以双向绑定,又有生命周期,又有 rederFunction,vuex,体积也占优。另外感觉 cycle.js 也不错,mvi 模型非常纯净易懂,问题是也是手动分发 key。
    wspsxing
        11
    wspsxing  
       2018-03-08 03:50:07 +08:00 via Android
    以上是我这后端对前端的浅薄思考。
    另外感觉不少坑都是 js 的,因为 js 的某些特性,代码写的怪怪的(比如对象深拷贝,vue 更新数组)。。
    HELLONAV
        12
    HELLONAV  
       2018-03-08 07:44:45 +08:00 via Android
    厉害了我的哥
    MrRabbit
        13
    MrRabbit  
       2018-03-08 09:21:05 +08:00
    Star & Fork & Follow
    哇 拉拉人
    Heanes
        14
    Heanes  
       2018-03-08 10:02:29 +08:00
    厉害了,我也在加强前端
    ixx
        15
    ixx  
       2018-03-08 10:07:07 +08:00
    @wspsxing 定制需要注册,不收费,因为会存储数据所以会有部分功能依赖后台服务器
    HELLONAV
        16
    HELLONAV  
       2018-03-08 10:37:57 +08:00 via Android
    @MrRabbit 拉拉人是什么鬼
    yuanfnadi
        17
    yuanfnadi  
    OP
       2018-03-08 10:50:40 +08:00
    @HELLONAV ller。看我头像
    HELLONAV
        18
    HELLONAV  
       2018-03-08 11:06:27 +08:00 via Android
    @yuanfnadi 原来如此,看来我老了
    HELLONAV
        19
    HELLONAV  
       2018-03-08 12:06:52 +08:00 via Android
    你那个 wiki 的我打开为什么提示疑似木马!!!
    deletemyself
        20
    deletemyself  
       2018-03-08 14:38:58 +08:00
    类似 ZBuilder?
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2832 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 30ms · UTC 02:15 · PVG 10:15 · LAX 18:15 · JFK 21:15
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.