锤子前端

Now vibe coding, so learning hammer FE ?

锤子前端

  3. 锤子前端

    重要提醒：警惕 Node.js 已停止维护的版本 —— Matteo Collina 指出，Node.js 生态正处于一个“关键时刻”，v18 及更早版本已经进入 End-of-Life 阶段

    重要提醒：警惕 Node.js 已停止维护的版本 —— Matteo Collina 指出，Node.js 生态正处于一个“关键时刻”，v18 及更早版本已经进入 End-of-Life 阶段。他详细解释了这对还在用老版本的用户意味着什么，并建议大家直接跳过 Active LTS v20，直接升级到 v22，这样更有利于未来的兼容和安全。

  4. 锤子前端

    #CSS CSS 动画中部分关键帧（Partial Keyframes）的使用技巧和优势

    #CSS CSS 动画中部分关键帧（Partial Keyframes）的使用技巧和优势。

    https://www.joshwcomeau.com/animation/partial-keyframes/
    Joshwcomeau
    Partial Keyframes • Josh W. Comeau
    Partial Keyframes • Josh W. Comeau
    CSS Keyframe animations are so much more powerful than most developers realize. In this tutorial, I’ll show you something that completely blew my mind, a technique that makes our keyframe animations so much more reusable and dynamic! 🤯

    CSS

  7. 锤子前端

    vite 7 beta 发布！

    vite 7 beta 发布！
    Vite 7.0.0-beta.0 聚焦于底层升级（如 Node 版本、打包器切换）、插件能力增强、配置项稳定化与现代化构建目标，带来更强的扩展性和更高的开发效率。对于插件作者、工具链开发者尤为重要，建议关注 API 变化与依赖环境升级。

    https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md#700-beta0-2025-06-02
    GitHub
    vite/packages/vite/CHANGELOG.md at main · vitejs/vite
    vite/packages/vite/CHANGELOG.md at main · vitejs/vite
    Next generation frontend tooling. It's fast! Contribute to vitejs/vite development by creating an account on GitHub.

  8. 锤子前端

    #文章 #CSS 通过使用OKLCH颜色空间来改善颜色管理

    #文章 #CSS 通过使用OKLCH颜色空间来改善颜色管理。文章首先介绍了Tailwind的优势，包括小体积、高性能和内置代码分割等。接着，文章解释了动态主题的概念及其重要性，强调了个性化对用户参与度和满意度的积极影响。

    https://evilmartians.com/chronicles/better-dynamic-themes-in-tailwind-with-oklch-color-magic
    evilmartians.com
    Better dynamic themes in Tailwind with OKLCH color magic—Martian Chronicles, Evil Martians’ team blog
    Better dynamic themes in Tailwind with OKLCH color magic—Martian Chronicles, Evil Martians’ team blog
    We make Tailwind CSS play nice with CSS variables, OKLCH colors, and dynamic themes. Get reliable, predictable theming.

    文章CSS

  9. 锤子前端

    #文章 #CSS OKLCH是一种新的色彩模型，解决了传统色彩模型（如RGB和HSL）在色彩表达上的局限性，提供了更一致、连贯、可访问且感知上均匀的色彩体验

    #文章 #CSS OKLCH是一种新的色彩模型，解决了传统色彩模型（如RGB和HSL）在色彩表达上的局限性，提供了更一致、连贯、可访问且感知上均匀的色彩体验。文章详细介绍了OKLCH在CSS中的应用，以及一系列工具，如OKLCH色彩选择器、Harmonizer、apcach和Polychrom等，这些工具帮助设计师和开发者更好地使用OKLCH模型，实现更高效、更直观的色彩设计和开发。

    https://evilmartians.com/chronicles/exploring-the-oklch-ecosystem-and-its-tools
    evilmartians.com
    Exploring the OKLCH ecosystem and its tools—Martian Chronicles, Evil Martians’ team blog
    Exploring the OKLCH ecosystem and its tools—Martian Chronicles, Evil Martians’ team blog
    Explore a powerful set of tools built around the OKLCH color model—Harmonizer for accessible palettes, Polychrom for Figma contrast checking, apcach for color contrast calculations, and more. Perfect for frontend developers and designers building consistent…

    文章CSS

  10. 锤子前端

    #React #文章 Epic React 的博客文章，对于useSyncExternalStore的完整概述和用法

    #React #文章 Epic React 的博客文章，对于useSyncExternalStore的完整概述和用法

    https://www.epicreact.dev/use-sync-external-store-demystified-for-practical-react-development-w5ac0
    Epic React
    useSyncExternalStore: Demystified for Practical React Development
    useSyncExternalStore: Demystified for Practical React Development
    Stop UI tearing in React! useSyncExternalStore safely syncs external data. Get best practices for this advanced hook (like stable functions) at EpicReac...

    React文章

  11. 锤子前端

    #React #文章 本文探讨了如何将搜索参数作为路由状态的一部分进行管理，强调了 TanStack Router 通过在路由层定义搜索参数模式，实现了类型安全、可验证且响应式的搜索参数处理，解决了传统方法中搜索参数管理的碎片化和不一致性问题

    #React #文章 本文探讨了如何将搜索参数作为路由状态的一部分进行管理，强调了 TanStack Router 通过在路由层定义搜索参数模式，实现了类型安全、可验证且响应式的搜索参数处理，解决了传统方法中搜索参数管理的碎片化和不一致性问题。

    https://tanstack.com/blog/search-params-are-state
    Tanstack
    Search Params Are State | TanStack Blog
    Search Params Are State | TanStack Blog
    Search params are global, serializable, and shareable — but in most apps they're hacked together with string parsing and brittle utils. They deserve to be treated as first-class state.

    React文章

  12. 锤子前端

    #AI #3D #文章 #React 结合React Three Fiber、Three.js和Rapier，创建一个基于物理的第三人称角色控制器

    #AI #3D #文章 #React 结合React Three Fiber、Three.js和Rapier，创建一个基于物理的第三人称角色控制器。

    https://tympanus.net/codrops/2025/05/28/building-a-physics-based-character-controller-with-the-help-of-ai/
    Codrops
    Building a Physics-Based Character Controller with the Help of AI | Codrops
    A behind-the-scenes look at building a physics-based character controller using AI, React Three Fiber, Three.js, and Rapier.

    AI3D文章React

  16. 锤子前端

    #React #文章 专治焦点管理问题，flushSync的用武之地

    #React #文章 专治焦点管理问题，flushSync的用武之地。

    https://www.epicreact.dev/mastering-focus-management-in-react-with-flush-sync-f5b38
    Epic React
    Mastering Focus Management in React with `flushSync`
    Mastering Focus Management in React with `flushSync`
    Master focus management in React with flushSync. Learn why batching matters, when to use flushSync, and how to create accessible, keyboard-friendly UIs.

    React文章

  17. 锤子前端

    #文章 本文详细介绍了如何使用 OpenAuth、React Router 和 SST 构建一个完整的用户认证系统，涵盖登录、回调处理、会话管理、新用户注册以及保护路由的实现，并提供了部署和测试的步骤

    #文章 本文详细介绍了如何使用 OpenAuth、React Router 和 SST 构建一个完整的用户认证系统，涵盖登录、回调处理、会话管理、新用户注册以及保护路由的实现，并提供了部署和测试的步骤。

    https://seanpaulcampbell.com/blog/openauth-react-router/
    Sean Campbell's Blog
    OpenAuth with React Router
    A guide to using OpenAuth with React Router for Authentication

    文章