V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
• 请不要在回答技术问题时复制粘贴 AI 生成的内容
daidr
V2EX  ›  程序员

把自己新的个人博客前端写完了

  •  7
     
  •   daidr · 2023-10-13 12:14:59 +08:00 · 8022 次点击
    这是一个创建于 440 天前的主题,其中的信息可能已经有所发展或是发生改变。

    之前用的是 WordPress ,一直想自己实现一套博客系统。 现在前端差不多写完了,第一次用 Nuxt.js ,也用了很多新的特性,前前后后忙了挺久,不过现在后端依旧是 WordPress ,前端部署在 Vercel ,自己感觉还行。就想着发出来给大家看看。

    https://im.daidr.me

    121 条回复    2023-10-18 00:50:22 +08:00
    1  2  
    dandycheung
        1
    dandycheung  
       2023-10-13 12:21:36 +08:00 via Android   ❤️ 1
    非常棒!
    ryan4yin
        2
    ryan4yin  
       2023-10-13 12:22:00 +08:00   ❤️ 1
    牛的,动画效果很惊艳!
    tushan
        3
    tushan  
       2023-10-13 12:34:11 +08:00
    挺好看的效果
    zentst
        4
    zentst  
       2023-10-13 12:34:16 +08:00   ❤️ 1
    实验室的列表采用横版展示,看后面的内容需要拉左右滚动条,滚动条又小,很不方便,个人感觉可以鼠标放上面时,可以用滚轮滚动;或者说根据需要显示左右按钮,点按钮切换。
    daidr
        5
    daidr  
    OP
       2023-10-13 12:41:35 +08:00
    @zentst #4 之前试过滚动条,感觉很难实现浏览器自带的那种 smooth 效果,之后我再探索一下😣
    滚动的话,按住 shift+滚轮,浏览器是支持横向滚动的
    lambdaq
        6
    lambdaq  
       2023-10-13 13:15:44 +08:00
    牛的
    Raikiriww
        7
    Raikiriww  
       2023-10-13 13:25:14 +08:00
    很好看
    CHTuring
        8
    CHTuring  
       2023-10-13 13:35:24 +08:00
    好厉害
    g1vemep0wer
        9
    g1vemep0wer  
       2023-10-13 13:42:32 +08:00
    可以加友链吗 https://www.xiaojun.im/
    sechi
        10
    sechi  
       2023-10-13 13:44:29 +08:00
    太强了!
    wenjy
        11
    wenjy  
       2023-10-13 13:45:11 +08:00
    准备开源吗
    ChrisDev
        12
    ChrisDev  
       2023-10-13 13:46:55 +08:00
    邀请你在 1024.dev 上分享你的博客文章链接。博客、GitHub 项目、工具、任何的社区帖子等等只要是跟开发者相关都可以!
    sechi
        13
    sechi  
       2023-10-13 13:47:04 +08:00   ❤️ 1
    @wenjy 翻了一下 op 的 github ,发现已经开源了。https://github.com/daidr/douLog 替 op 发一下
    zjyg1993
        14
    zjyg1993  
       2023-10-13 13:51:05 +08:00
    好牛的个人博客,很细节!
    wenjy
        15
    wenjy  
       2023-10-13 13:52:09 +08:00
    @sechi 先 star 支持一下
    enpitsulin
        16
    enpitsulin  
       2023-10-13 13:57:50 +08:00
    牛牛牛 好看
    daidr
        17
    daidr  
    OP
       2023-10-13 14:04:10 +08:00
    @g1vemep0wer #9 可以哦,我一会儿加上
    Dukec
        18
    Dukec  
       2023-10-13 14:05:19 +08:00
    好看的,期待开源。
    justlazydog
        19
    justlazydog  
       2023-10-13 14:06:57 +08:00
    后端就喜欢看前端的项目
    yechentide
        20
    yechentide  
       2023-10-13 14:07:08 +08:00 via iPhone
    好漂亮!少见的设计能力强的程序员!献上 star 了!
    g1vemep0wer
        21
    g1vemep0wer  
       2023-10-13 14:07:35 +08:00
    @daidr 🥳我也把你加上,我的简介啥的首页那些就是 https://www.xiaojun.im/
    lynan
        22
    lynan  
       2023-10-13 14:17:04 +08:00
    很棒!
    jethroX
        23
    jethroX  
       2023-10-13 14:25:36 +08:00
    太酷啦!我怎么就想不到这种酷炫的动画呢!
    AchieveHF
        24
    AchieveHF  
       2023-10-13 14:25:43 +08:00
    秀儿
    kylix
        25
    kylix  
       2023-10-13 14:27:32 +08:00
    挺好,已收藏
    zk8080
        26
    zk8080  
       2023-10-13 14:28:36 +08:00
    太强了
    allele
        27
    allele  
       2023-10-13 14:41:24 +08:00
    确实不错,支持一下
    daidr
        28
    daidr  
    OP
       2023-10-13 14:46:27 +08:00
    @g1vemep0wer #21 加上啦
    yl20181003
        29
    yl20181003  
       2023-10-13 14:47:57 +08:00
    动画效果很秀
    gps949
        30
    gps949  
       2023-10-13 14:52:31 +08:00
    太棒了!
    当前在干什么的那个,是咋做的?
    daidr
        31
    daidr  
    OP
       2023-10-13 14:54:23 +08:00
    @gps949 #30 是最近在写的一个小玩具,等过段时间完善了会开源的
    gps949
        32
    gps949  
       2023-10-13 14:55:37 +08:00
    @daidr 🐂🍺期待一下
    RoccoShi
        33
    RoccoShi  
       2023-10-13 14:56:22 +08:00
    厉害啊, 这个动画效果
    Moyyyyyyyyyyye
        34
    Moyyyyyyyyyyye  
       2023-10-13 14:59:46 +08:00
    🐂🍺
    lihexinkai
        35
    lihexinkai  
       2023-10-13 15:04:51 +08:00
    我一直很好奇为什么你们的 ui 都那么好看
    g1vemep0wer
        36
    g1vemep0wer  
       2023-10-13 15:05:24 +08:00
    @daidr 已➕
    powinds
        37
    powinds  
       2023-10-13 15:08:46 +08:00
    动画效果真不错,支持
    gps949
        38
    gps949  
       2023-10-13 15:20:34 +08:00   ❤️ 1
    @daidr
    当前状态那个,提些小建议供参考:
    - 在播放音歌曲不知道你调的是哪个 app 的?要是支持点击在本地也能打开同样的歌曲(甚至跳转到同样进度)就好了。
    - 还有当前在浏览网页也能点击跳转就好了。
    - 当然这些可能会需要设置成可开关的来根据不同的人的需要保护隐私。
    - 还可以考虑展示当前所在地( IP 、GPS )之类的。
    - 还可以考虑支持像 github 那样设置状态、签名。
    - 还可以考虑支持“气泡博客”(即可以即时发送一段文字或照片,作为临时状态显示一小短时间)
    坐等这部分开源,到时候记着开 donate 😄
    gps949
        39
    gps949  
       2023-10-13 15:21:33 +08:00
    @gps949
    在播放歌曲那个,甚至还可以考虑支持流同步到网页作为背景音乐?
    sp670
        40
    sp670  
       2023-10-13 15:25:42 +08:00
    一看域名就好熟悉,结果还真是您本人,用了您的看板娘插件好多年了
    kmaster
        41
    kmaster  
       2023-10-13 15:26:07 +08:00
    太帅了!
    daidr
        42
    daidr  
    OP
       2023-10-13 15:29:02 +08:00
    @gps949 #38 mark 了,感谢建议🫡

    目前是使用 winRT API 拿系统 Media Manager 的数据,所以理论上是能够获取对应软件信息的,不过跳转感觉是一个比较复杂的功能,浏览器可能很难实现
    在研究如何获取浏览器 URL 了,可能会有白名单来进行一些高级的定制

    所在地和状态签名都在实现中了

    这个玩具前天才开始写,目前也还有很多问题需要解决
    daidr
        43
    daidr  
    OP
       2023-10-13 15:29:38 +08:00
    @sp670 #40 哈哈,感觉是很久之前了,当时才刚接触前端
    gps949
        44
    gps949  
       2023-10-13 15:31:50 +08:00
    @daidr
    才写两天这效果已经很爆炸了。
    但看你说 winRT API 我心凉了😂岂不是 macOS 或者移动端就不好支持了?
    tlerbao
        45
    tlerbao  
       2023-10-13 15:34:04 +08:00
    男生?
    daidr
        46
    daidr  
    OP
       2023-10-13 15:39:39 +08:00
    @gps949 #44 这感觉问题不大,我想 Mac 也有相应的接口能获取媒体信息😂

    关于移动端,目前我是简单拼了一个快捷指令,用来同步 Apple 专注模式
    daidr
        47
    daidr  
    OP
       2023-10-13 15:40:24 +08:00
    @tlerbao #45 对哦
    62742a40
        48
    62742a40  
       2023-10-13 15:41:32 +08:00
    前端挺有意思的,现在学前端还来得及吗
    mlyykk
        49
    mlyykk  
       2023-10-13 15:44:19 +08:00
    效果很有意思哦
    gps949
        50
    gps949  
       2023-10-13 15:47:15 +08:00   ❤️ 1
    @daidr 我倒没想着可以同步移动端在操作的软件。可能移动端能实现个前面说的那种“气泡微博”就行吧,想说点啥或者看到点啥可以快速方便地发到页面状态上。可以考虑通过走移动端 app 的共享接口,或者走企微机器人之类的
    MissCute
        51
    MissCute  
       2023-10-13 15:47:34 +08:00
    赞赞赞!!!!
    jazzsama
        52
    jazzsama  
       2023-10-13 15:49:38 +08:00
    厉害
    inhzus
        53
    inhzus  
       2023-10-13 15:52:11 +08:00
    好好看的动画效果啊!
    fao931013
        54
    fao931013  
       2023-10-13 16:07:05 +08:00
    颜色很舒服
    throns
        55
    throns  
       2023-10-13 16:12:29 +08:00   ❤️ 1
    最近看到的“搭建博客容易,坚持写博客难!”,深以为然。希望楼主能坚持写博客。
    encro
        56
    encro  
       2023-10-13 16:20:15 +08:00
    @fao931013

    只有我觉得蓝色太亮了不太方便阅读吗?


    @daidr

    效果非常 nice 。。。
    tietou
        57
    tietou  
       2023-10-13 16:32:28 +08:00
    搞的这么炫酷呀
    nobody111
        58
    nobody111  
       2023-10-13 16:36:19 +08:00
    助手的可还行 哈哈哈哈哈。
    nobody111
        59
    nobody111  
       2023-10-13 16:37:20 +08:00
    友链里面看见不少熟悉的头像(
    daidr
        60
    daidr  
    OP
       2023-10-13 16:38:35 +08:00
    @nobody111 #59 哈哈
    daidr
        61
    daidr  
    OP
       2023-10-13 16:39:05 +08:00
    @encro #56 目前我自己看着蓝色和浅绿色会比较瞎眼,之后我调调
    KING754
        62
    KING754  
       2023-10-13 16:42:11 +08:00
    和你的比起来.我的就是个垃圾.
    suyuyu
        63
    suyuyu  
       2023-10-13 16:45:14 +08:00
    @g1vemep0wer #9 哥们这个是自己写的吗
    suyuyu
        64
    suyuyu  
       2023-10-13 16:47:41 +08:00
    @g1vemep0wer #9 在你的 github 找到了
    cyrbuzz
        65
    cyrbuzz  
       2023-10-13 16:48:41 +08:00   ❤️ 2
    后排提示,文章列表到文章详情也有一个很棒的动画,需要 Chrome111 以上,楼主用了一个试验性的属性,又学到一个新知识,https://developer.chrome.com/docs/web-platform/view-transitions/。
    MENGKE
        66
    MENGKE  
       2023-10-13 16:57:03 +08:00
    🐮太好看了。比我的好太多了


    https://mengke.me
    daidr
        67
    daidr  
    OP
       2023-10-13 17:06:39 +08:00
    @cyrbuzz #65 哈哈哈,观察很仔细,最近刚加的,之前这块没有动画😂
    lxiian
        68
    lxiian  
       2023-10-13 17:07:41 +08:00
    牛啊 op ,动效真好看啊
    EHemingway
        69
    EHemingway  
       2023-10-13 17:14:00 +08:00
    过渡很流畅,阿妹 z 啊,你服务器啥配置
    daidr
        70
    daidr  
    OP
       2023-10-13 17:17:04 +08:00
    @EHemingway 前端在 vercel ,后端 1h2g 腾讯云
    LavaC
        71
    LavaC  
       2023-10-13 17:23:38 +08:00
    是希望达到的动手能力🫡
    EHemingway
        72
    EHemingway  
       2023-10-13 17:24:34 +08:00
    thx 解答,优化的很棒
    teeengmod26
        73
    teeengmod26  
       2023-10-13 17:27:16 +08:00
    厉害,像你这样做一个博客,需要掌握哪些知识?
    9921
        74
    9921  
       2023-10-13 17:29:17 +08:00
    我怎么打不开网站
    leeshong27
        75
    leeshong27  
       2023-10-13 17:34:33 +08:00
    Wien
        76
    Wien  
       2023-10-13 17:37:25 +08:00
    给校友点赞
    GodIsJasonBourne
        77
    GodIsJasonBourne  
       2023-10-13 17:39:46 +08:00
    duang duang duang 加特技,真炫!我有一种这就是未来前端 UI 模范的想法。快去申请专利!挣它一笔。
    hanierming
        78
    hanierming  
       2023-10-13 17:40:00 +08:00
    动画太秀了
    hanierming
        79
    hanierming  
       2023-10-13 17:41:17 +08:00
    提一个小小的建议,首页滚动鼠标的时候能自动跳到文章列表,首页动不了总感觉怪怪的
    liuooooo
        80
    liuooooo  
       2023-10-13 17:41:47 +08:00
    动画很棒👍
    aino
        81
    aino  
       2023-10-13 17:49:11 +08:00
    前端架构师水平
    daidr
        82
    daidr  
    OP
       2023-10-13 17:50:20 +08:00
    @9921 #74 😨有可能是被污染了,我博客 Vercel+Cloudflare 双重 defuff ,最近好像劫持很严重
    root71370
        83
    root71370  
       2023-10-13 17:58:33 +08:00
    可以给 halo 授权个主题吗, 太牛了看着
    daidr
        84
    daidr  
    OP
       2023-10-13 18:00:20 +08:00
    @root71370 #83 是说要做个差不多的 halo 主题么,当然可以,随便做,博客代码是 MIT License
    Guidoo
        85
    Guidoo  
       2023-10-13 18:39:24 +08:00
    请问下 我-头像右上角 xx 正在... 怎么做的?
    daidr
        86
    daidr  
    OP
       2023-10-13 18:43:34 +08:00
    @Guidoo #85 是一个我正在写的小玩具,等全部搞完后会开源的
    43n5Z6GyW39943pj
        87
    43n5Z6GyW39943pj  
       2023-10-13 18:47:54 +08:00
    过渡写得很好呀
    MaxFang
        88
    MaxFang  
       2023-10-13 18:59:09 +08:00
    反馈一个问题,文章列表页面点击进入详情页面的时候,感觉闪了一下,动画有点不自然。
    Guidoo
        89
    Guidoo  
       2023-10-13 19:04:57 +08:00
    @daidr 牛的,期待开源
    5I4v7N4CPSlF03tx
        90
    5I4v7N4CPSlF03tx  
       2023-10-13 19:11:50 +08:00 via Android
    年轻真好啊
    daidr
        91
    daidr  
    OP
       2023-10-13 19:30:53 +08:00
    @MaxFang 应该是 loading 闪了一下,我一会儿修修
    yjd
        92
    yjd  
       2023-10-13 19:48:25 +08:00
    smartUp 手势 页顶,页底竟然不起作用。
    BaseException
        93
    BaseException  
       2023-10-13 20:28:55 +08:00
    好佩服自研博客 前端开发的很炫酷的人! respect 🫡
    uncat
        94
    uncat  
       2023-10-13 20:32:52 +08:00
    反馈:

    在 Dark Reader 插件( Chrome )下,页面右侧有样式问题
    Archeb
        95
    Archeb  
       2023-10-13 20:39:16 +08:00
    看到楼主之前的横板主题,想起来我以前也做过一个横板的(而且支持平滑鼠标滚轮的)主题,不过现在我又换回普通的单栏了,哈哈。

    https://github.com/Archeb/Candy2
    jlak
        96
    jlak  
       2023-10-13 20:50:54 +08:00 via iPhone
    这 3d 旋转是特效库还是纯手撸?
    daidr
        97
    daidr  
    OP
       2023-10-13 20:54:01 +08:00
    @jlak 手动算的,用 css transform
    jianzha52
        98
    jianzha52  
       2023-10-13 21:55:02 +08:00
    厉害!
    yafoo
        99
    yafoo  
       2023-10-13 22:26:10 +08:00 via Android
    的确漂亮
    daidr
        100
    daidr  
    OP
       2023-10-13 22:43:51 +08:00
    @Archeb #95 好看😀
    不过横向滚动在 PC 上真的好难处理
    1  2  
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1020 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 30ms · UTC 20:37 · PVG 04:37 · LAX 12:37 · JFK 15:37
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.