front

zod

9 Best Practices for Using Zod in 2025
Structuring Zod Schemas Efficiently
Best Practices for Zod Schema Organization

react

Code Radiance react
深度解析：什么是 TanStack-ification？是工具革新还是行业标准？

hooks

轻松掌握 React Hooks：避免不必要的重新渲染

context

auth : React Context API：无需 Redux 的状态管理
 何时不应使用 React Context、Zustand、Redux 或其他任何工具

react-form-hook

React Hook Form complete guide: validation, TypeScript & more
使用 Zod + React Hook Form 创建多步骤表单：真正有效的模式

DevTools to help debug react forms.

tanstack-router

tanstack-table

虚拟化、分页和无限滚动：选择正确的策略
 让我们使用 React、TanStack Table 和 Tailwind CSS 创建数据表系列文章
 Master the Grid: The Ultimate TanStack React Table Guide (Tips & Best Practices)
Building a Customizable and Interactive Data Table in React with TanStack Table and Shadcn Library in Typescript
Mastering React Query + TanStack Table: A Complete Guide to Building Real-World Data Tables
TanStack Table: From Basic Tables to Advanced Features
Build a Multifeatured Table With TanStack Table
React 中的 TanStack 表格 – 完整指南

tanstack-query

TanStack 查询：包含所有最佳功能的终极完整指南
 From Axios to TanStack Query: Modern API Requests in React
前端开发实战笔记：为什么从 Axios 到 TanStack Query，是工程化演进的必然？

zod

axios

使用自定义 Axios Hooks 精通 React 中的 API 调用
 axios Authentication
React 中的 Axios：TypeScript 完整指南
 Best Practices for Using Axios to Make HTTP Requests to a Spring Backend in a React Application
Axios：简明实用指南(附示例)
使用 Axios 进行 React JWT 身份验证：处理访问令牌和刷新令牌
 精通 Axios 拦截器：构建坚不可摧的 API 客户端
 理解 Bearer Token：Node.js API 简明指南
 Axios: Setup, Configuration, and Structuring
Axios POST requests: Handling errors, authentication, and best practices

localstorage xss 攻击: JWT身份验证详解(访问令牌和刷新令牌)
Axios & Error handling like a boss
React Native JWT authentication using Axios interceptors
Token Refresh with Axios Interceptors for a Seamless Authentication Experience
2025 Guide to Axios in React: Build Better Web Apps!

ky

React 中的 Axios 与 Ky：为什么更轻量级、更智能的 HTTP 请求近在咫尺
 Ky.js: A Delightful Alternative to Axios
Why Ky is the Best Alternative to Axios and Fetch for Modern HTTP Requests

状态管理

How to Pass Initial Props to Zustand State Without Losing Your Mind Why choose Zustand over Jotai?
Jotai Comparison
State Management in 2025: When to Use Context, Redux, Zustand, or Jotai

Valtio

使用 Valtio 简化 React 中的状态管理

Zustand

zustand update states
Zustand + Axios 存储 Token 最佳实践
 Authentication store with zustand

Build Better React Apps with Zustand and Axios
How to use Zustand
Modern React Development with TypeScript, Zustand, Axios, and ESLint
Using Zustand in Your Next React Project

Zustand and TanStack Query: The Dynamic Duo That Simplified My React State Management
Zustand + React Query: A New Approach to State Management
Building a Production-Grade React Auth Starter (JWT, Refresh Tokens, Zustand, TanStack Query)

youtube:
5 Zustand BEST Practices in 5 Minutes
Combining Zustand with React Query

Inside the Store (set and get)

When you create a store, these functions are passed to the initializer to manage internal logic. [1, 2]

set: Used to update the state. It shallowly merges the current state with the new values you provide.
get: Used to read the current state value without triggering a re-render. This is helpful for logic that depends on the current value before updating.

Outside the Store (setState and getState)

If you need to interact with the store outside of React components (e.g., in a utility function or a regular JS file), you use the Store API. [1]

getState(): Returns a snapshot of the current state at that moment.
setState(): Updates the state from outside the hook system. [1, 2, 3]

markdown

Building a Blog in TanStack
Markdown 也能类型安全? 用 TanStack Start 和 Markdown 构建博客的最佳方式！ | Josef Bender
如何使用 Markdown 创建静态页面和博客文章
 Content Collections
渲染 Markdown

fullstack

How to Use TypeScript for Full-Stack Web Development
How to Structure Large-Scale React Applications for Maintainability

toast

页面弹出通知(一般在右下角)
Sonner — The Toast Library That Made My UI Feel Alive

i18n

multi-step

The Fastest Way to Build Multi Step Forms
multi-step-form builder
stepperize: Multi-step flows made simple
Simplifying Multi-Step Processes in React
https://reui.io/components/stepper

参考

TkDodo’s blog
构建可用于生产环境的 React + Vite + TypeScript 样板：架构、选择和 DX 深度解析
 A Reminder App application built with a modern technology stack offering a 10x developer experience (DX)
Full-Stack Reminder Application react-vite-boilerplate
https://oneuptime.com/blog/tag/best-practice
https://blog.logrocket.com/real-time-frontends-break-scale/

JSON Web Tokens (JWT) 和刷新令牌：完整的后端指南