V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
Tyangs
V2EX  ›  程序员

最近 Headless 组件库很火呀,我也整了个绝对 Headless 的 React 组件库

  •  
  •   Tyangs · 2023-08-09 09:31:50 +08:00 · 3162 次点击
    这是一个创建于 471 天前的主题,其中的信息可能已经有所发展或是发生改变。

    先贴 Repo: https://github.com/Tyangs/react-purecomps

    在我几个月前打算离职的一段时间,天天刷推和 GitHub ,看大家都在推 Headless 组件库,如 Headless UIRadix UI 等,灵光一现有了个好点子,当天下班回家码了一下,写出了 ↑ 这个完美的 Headless React UI 库。

    优势:

    欢迎大家使用

    21 条回复    2023-08-09 15:58:30 +08:00
    lilei2023
        1
    lilei2023  
       2023-08-09 10:09:02 +08:00
    你这是来说相声的么?
    musi
        2
    musi  
       2023-08-09 10:14:40 +08:00
    脱裤子放屁?
    dyllen
        3
    dyllen  
       2023-08-09 10:18:29 +08:00
    什么是 Headless 组件?
    NessajCN
        4
    NessajCN  
       2023-08-09 10:24:38 +08:00
    你可以把每个 export 单独放个文件,这样说起来可以加一句 import 单个组件提升性能呢
    ztc
        5
    ztc  
       2023-08-09 10:24:39 +08:00
    @dyllen
    Headless 组件是一种解耦的软件构建方法,主要用于 Web 开发和内容管理系统( CMS )。在这种方法中,一个组件被设计为只关注其核心功能,而不负责用户界面( UI )的呈现。这使开发人员能够更加灵活地将组件集成到不同的前端应用程序、框架或平台中。

    Headless 组件的特点包括:

    1. **无关 UI:** Headless 组件专注于其功能,而不关心如何呈现这些功能给用户。这意味着开发人员可以使用相同的功能来构建不同的用户界面,例如网站、移动应用程序、桌面应用程序等。

    2. **API 驱动:** Headless 组件通常通过 API (应用程序编程接口)进行操作和交互。这使得组件可以在不同的环境中与其他组件或系统进行通信。

    3. **灵活性:** 使用 Headless 组件,开发人员可以选择适合他们需求的前端技术栈,无需受限于特定的 UI 框架或库。

    4. **性能优化:** 由于不需要处理复杂的 UI 呈现,Headless 组件通常具有较低的资源消耗,可以更好地优化性能。

    5. **多平台支持:** Headless 组件可以轻松地在不同的平台和设备上重复使用,例如将内容展示在网站和移动应用程序上。

    Headless 组件在内容管理系统( CMS )领域尤其流行,因为它们允许编辑者和内容管理员使用一个单一的内容后台来管理内容,然后将内容通过 API 提供给不同的前端渠道。

    总之,Headless 组件是一种强调功能而非 UI 的开发方法,通过解耦和灵活性,使开发人员能够更好地构建和集成不同的应用程序和系统。
    Vegetable
        6
    Vegetable  
       2023-08-09 10:26:55 +08:00
    很认真的把题干抄了一遍
    AoEiuV020JP
        7
    AoEiuV020JP  
       2023-08-09 10:28:59 +08:00
    > 当天下班回家码了一下
    是不是上班写的代码下班回家 commit ,
    version
        8
    version  
       2023-08-09 10:55:44 +08:00
    搞不明白.前端各种新东西.都是 "Hello, World".
    复杂一些的组件跟我说.要收费
    otakustay
        9
    otakustay  
       2023-08-09 11:02:57 +08:00
    你都 headless 了,为啥还绑定 react……
    justdoit123
        10
    justdoit123  
       2023-08-09 11:10:49 +08:00
    你都 headless 了,为啥还绑定 react…… + 1
    loading
        11
    loading  
       2023-08-09 11:18:17 +08:00
    我认为就是抄概念,特别是在 web 实现方面,我不觉得 headless 的 input 比原生的 input 有有时,还有再记一套文档。
    loading
        12
    loading  
       2023-08-09 11:20:52 +08:00
    看着酷炫,不还是 css 写得好。
    zhouyg
        13
    zhouyg  
       2023-08-09 11:26:03 +08:00
    你这表单没有校验功能啊
    ck65
        14
    ck65  
       2023-08-09 11:47:48 +08:00
    难道就我一个人觉得 LZ 在反串?毕竟项目简介第一个字是「🤡」
    royalknight
        15
    royalknight  
       2023-08-09 12:01:42 +08:00
    我看了下,感觉实现的不错,还充分考虑了不同框架。后续或许可以应用到别的框架中
    connection
        16
    connection  
       2023-08-09 14:11:02 +08:00
    你都 headless 了,为啥还绑定 react…… + 1
    momocraft
        17
    momocraft  
       2023-08-09 15:19:46 +08:00
    这不是 headless 这是什么都 less
    Tyangs
        18
    Tyangs  
    OP
       2023-08-09 15:27:55 +08:00
    我应该在标题上加个 🤡
    Tyangs
        19
    Tyangs  
    OP
       2023-08-09 15:34:19 +08:00
    @NessajCN 你是懂的
    Tyangs
        20
    Tyangs  
    OP
       2023-08-09 15:39:20 +08:00
    @otakustay Headless 跟绑定框架不冲突呀

    我理解的 Headless UI 是提供完整的基础能力,而不给定风格样式,让使用方能享受库提供的能力,而样式则完全自定义,更能满足 C 端 or 二次封装的场景。

    当然,我的库是 🤡,大家不用太认真
    Tyangs
        21
    Tyangs  
    OP
       2023-08-09 15:58:30 +08:00
    @version 对于收费的工具(组件 也算是工具),如果不是你发自内心愿意付钱的,可以先想想它能不能给你赚钱(带来价值),比如最近火爆的各种 AI 相关工具。

    像我 GPT 4 不能给我带来收益,我就老老实实地用 3.5 了
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3145 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 10:44 · PVG 18:44 · LAX 02:44 · JFK 05:44
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.