#React

Ant Design 是一个广受欢迎的开源项目，为企业级 Web 应用提供 UI 设计系统和 React 组件库。它包含丰富的预制组件，支持 TypeScript，并提供完整的设计资源。该库具有国际化支持和灵活的主题定制功能，可用于现代浏览器、服务器端渲染和 Electron 应用。

react-file-viewer 是一个基于 React 的可扩展 Web 文件预览组件。支持图片、PDF、CSV、Excel、Word、视频和音频等多种文件格式。该组件集成简便，允许自定义错误处理和不支持文件类型的显示。适用于 React 16+ 版本，API 简洁，易于使用。开发者可以方便地扩展支持的文件类型，是实现 Web 文件预览功能的有力工具。

react-speech-recognition是一个基于Web Speech API的React钩子，能将麦克风捕获的语音实时转换为文本。它支持语音命令、连续监听和多语言识别，提供简单API控制麦克风和访问转录。为实现更广泛的浏览器兼容性，推荐配合语音识别polyfill使用。

reaflow是一个基于React的模块化图表引擎，用于构建静态或交互式节点编辑器。它集成了自动布局、节点/边/端口自定义、缩放平移控制、拖放连接和节点嵌套等功能。reaflow简单易用且高度可定制，适合开发复杂的node-based可视化应用。这个开源项目还支持节点/边选择、接近连接辅助、撤销/重做等功能，可满足各种复杂的图表编辑需求。对于需要开发node-based可视化应用的开发者来说，reaflow是一个值得考虑的选择。

shadcn-minimal-tiptap是专为Shadcn UI设计的Tiptap编辑器组件。这个组件提供简洁的文本编辑和格式化功能，支持HTML、JSON和纯文本输出。它易于集成，具有响应式设计，并通过多种属性实现灵活配置。对于Shadcn项目中需要实现富文本编辑功能的开发者而言，shadcn-minimal-tiptap是一个高效的解决方案。

Mockoops是一个基于React的开源项目，用于将屏幕录像转换成动画模拟视频。它提供多种响应式视频模板，支持实时预览和快速渲染。该工具采用服务器端渲染和长期缓存技术，适用于产品演示、教程制作等多种场景。Mockoops能够帮助创建者快速生成专业效果的动画模拟视频。

Onlook是一款基于浏览器的可视化编辑器，专门用于React和TailwindCSS应用的UI开发。该工具支持实时预览和代码生成，让开发者能够直观地构建界面，无需手动编写全部代码。Onlook提供多种集成方式，旨在简化开发流程，提升效率。这款编辑器适用于各类React项目，为开发者提供了更灵活的UI设计选择。

AutoForm 是一个开源的 React 组件，能够根据 Zod 模式自动生成 @shadcn/ui 表单。这个组件适合快速构建内部和低优先级表单，支持多种字段类型和自定义配置。它提供了简洁的 API 用于处理表单数据、验证和提交，并与 @shadcn/ui 组件保持原生集成。AutoForm 还支持字段依赖关系和自定义渲染，为开发者提供了灵活性和可扩展性。

MediaCMS是一款功能丰富的开源视频和媒体内容管理系统，适用于教育机构、组织内部和社区门户等场景。系统支持多种媒体类型、分类方式和发布工作流，具有响应式设计和高级用户管理功能。它提供增强型视频播放器、多种转码选项和自适应流媒体等特性，可快速搭建小型到中型的媒体门户网站。MediaCMS基于现代技术栈开发，提供REST API接口，满足定制化需求。

use-debounce 是一个轻量级 React 防抖库，提供简单 API 实现值和回调函数防抖。支持服务端渲染，兼容 underscore/lodash，具备取消和最大等待时间等功能。该库体积小于 1KB，适用于优化 React 应用中的频繁操作。通过防抖机制，可减少不必要的函数调用，提高应用响应速度，有效优化用户输入、滚动等操作，提升应用性能。

Eldora UI 是一个开源动画组件库，使用 React、TypeScript、Tailwind CSS 和 Framer Motion 构建。它提供可定制组件，用于现代 Web 应用开发，增强用户界面的交互性和视觉效果。该项目支持开源协作，欢迎社区参与开发。

zoom-chart-demo 是一个基于 Shadcn 构建的可缩放图表组件演示项目。它展示了如何创建简单yet功能强大的图表，支持缩放功能以增强数据可视化的灵活性。项目提供了清晰的安装和运行指南，方便开发者快速上手。主要组件位于 components/chart.tsx 文件中，为有意集成或定制类似图表功能的开发者提供了直观的参考。

ESLint React为React生态系统提供了一系列精心设计的ESLint规则。这套规则适用于各种使用React作为UI运行时的库和框架，具有通用性强、默认配置合理等特点。项目提供了全面的插件包和独立插件模块，并支持多种配置预设，能够满足不同React开发场景的需求。通过最小化规则选项，ESLint React实现了高度的灵活性和可定制性。

HYLSE是一款面向前端开发的AI生成工具，专注于简化React和Tailwind组件的创建过程。它能快速生成高质量、可定制的UI组件，无需深厚设计背景。HYLSE旨在提高前端开发效率，为开发者提供便捷方式构建现代化、响应式的web界面，使设计过程更加简单高效。

Redux是一个轻量级的JavaScript状态管理库，用于创建行为一致且易于测试的应用。它通过单一状态树和纯函数reducer来管理应用状态，适用于客户端、服务器端和原生环境。Redux Toolkit作为官方推荐工具集，简化了Redux的使用流程，内置最佳实践，有效预防常见错误。Redux可与React等视图库搭配使用，也可独立应用于各种JavaScript项目中。

MobX 是一个轻量级的 JavaScript 状态管理库，基于函数式响应式编程原理。它能自动追踪状态变化并更新相关组件，简化了应用开发。MobX 支持简洁的代码风格，减少样板代码，并且不限制架构选择。这个库可以配合多种 UI 框架使用，尤其适合 React 项目。MobX 遵循 '所有可从应用状态派生的内容都应自动完成' 的核心理念，有效提升了开发效率和应用性能。

helux是一个功能全面的React状态管理库，集成了atom、signal、依赖收集、派生和观察等特性。它支持细粒度响应式更新，提供内置依赖追踪、loading管理和双向绑定等功能。helux采用TypeScript开发，确保类型安全，性能优异，适用于各种规模的React应用。这个库简化了状态管理流程，可提高开发效率，是构建现代React应用的有力工具。

本路线图全面涵盖Next.js产品工程师所需技能,包括核心概念、渲染技术、样式设计、性能优化和部署方案等。它为开发者提供清晰学习方向,适合不同经验水平的人员参考,助力掌握Next.js并提升产品开发能力。

Minimalist CV是一个基于Next.js和shadcn/ui的开源简历生成应用。它通过单一配置文件生成响应式简历，支持自动布局和多设备适配。该项目针对Next.js和Vercel进行了优化，提供打印友好的布局。用户可以通过本地部署或Docker方式使用，快速创建和定制个人简历。

next-mdx-remote是一个轻量级工具集，用于在Next.js应用中高效处理MDX内容。它支持在getStaticProps或getServerSideProps中加载MDX，并在客户端进行水合渲染。通过提供serialize函数和MDXRemote组件，开发者可以灵活处理各种来源的MDX文本，支持自定义组件、作用域和前置元数据解析。该库优化了性能，简化了MDX的使用流程，适合构建灵活的内容驱动型Next.js网站。

mdx-bundler是一款高效的MDX文件编译打包工具，采用MDX v3和esbuild技术，具有卓越性能。它支持处理多种来源的文件，包括本地、GitHub仓库和CMS系统。该工具支持按需打包，适用于Remix和Next.js等服务端渲染框架。相比传统MDX插件，mdx-bundler突破了构建时的限制，为内容管理提供了更灵活的解决方案。

Next.js是Vercel开发的React框架，集成最新React特性和Rust构建工具，支持创建全栈Web应用。框架提供性能优化、服务器端渲染和静态网站生成功能，广受全球大型公司青睐。Next.js具备完善的文档和活跃的社区，适合开发现代高效的Web应用。

Spoiled是一个React组件，通过CSS Painting API生成动画粒子云效果来隐藏文本或元素。支持多种显示模式和内容过渡动画，并可根据用户偏好调整。开发者能够控制FPS、密度和颜色等性能参数。适用于隐藏敏感内容，在不支持的浏览器上会降级为静态图像。

React Syntax Highlighter是一款功能强大的代码语法高亮组件。它基于lowlight和refractor构建，使用虚拟DOM动态渲染语法树，支持JavaScript和CSS样式。该组件提供多语言支持和主题选择，具有轻量级构建选项，支持行号显示和自定义渲染。React Syntax Highlighter已在mdx-deck、Kibana等多个知名项目中得到应用。

next-intl 是一个为 Next.js 提供全面国际化支持的库。它支持 ICU 消息语法，实现日期、时间和数字的本地化格式化，具备类型安全特性，并提供基于 hooks 的 API。该库与 Next.js 原生集成，兼容 App Router、服务器组件和静态渲染，同时支持国际化路由。next-intl 为开发者提供完整工具集，助力实现精确的应用程序语言本地化。

Sonner 是一个专为 React 设计的开源 Toast 通知组件。它提供简洁的 API，支持自定义样式，易于集成到 React 项目中。开发者只需安装并添加 <Toaster /> 组件，即可在应用中使用 toast() 函数显示通知。Sonner 优化了性能和用户体验，轻量级设计确保快速加载，是构建现代化响应式界面的理想选择。

react-force-graph是一个用于创建交互式力导向图的React组件库。它支持2D、3D、VR和AR四种可视化模式，适用于大规模数据集。该库采用canvas/WebGL渲染，d3-force-3d作为物理引擎，提供缩放、平移、节点拖动等交互功能。丰富的自定义选项使其能满足各种复杂网络数据的可视化需求。

react-resizable-panels是一个React组件库，用于构建可调整大小的面板布局。它支持多种输入方式，包括鼠标、触摸和键盘，符合Web无障碍标准。该库特点包括简洁的API、布局持久化和服务器端渲染支持。开发者可以利用其详细文档和示例快速实现灵活的用户界面布局。

React Simple Chatbot是一个开源的React组件，用于创建对话式聊天界面。该组件通过简单配置即可定义对话流程，并支持样式自定义和功能扩展。开发者可利用它快速构建客服、信息查询等聊天机器人应用。虽然项目不再维护，但其API和示例仍具参考价值。推荐考虑使用react-chatbotify等替代方案。

Reshaped是一个多用途开源设计系统，提供React组件包和Figma库。该项目包含多种项目设置示例，支持不同构建工具和框架，追求与主流技术的广泛兼容性。Reshaped遵循贴近原生浏览器技术的原则，为开发者提供灵活的设计工具。开发者可通过npm安装Reshaped React包，也可在官网获取Figma库和源代码环境许可。

AI Prompt Genius是一个Chrome扩展程序，用于创建和管理AI提示库。该工具基于React和Tailwind CSS开发，具有简洁的界面。用户可以方便地整理和使用AI提示，提升AI交互效率。扩展支持Google账号同步，实现跨设备使用。AI Prompt Genius适合AI爱好者和专业人士，有助于更有效地运用AI技术。

Electron React Boilerplate是一个集成Electron、React、React Router、Webpack和React Fast Refresh的开发框架，用于构建跨平台桌面应用。该项目提供详细文档、活跃社区支持和持续维护。开发者可快速克隆仓库、安装依赖并开始开发。框架支持生产环境打包，适合构建专业桌面应用。

remix-graphql 是一个为 Remix 框架设计的 GraphQL 工具包。它提供了处理 loader 和 action 请求、设置本地 schema 和解析器、执行远程 API 查询，以及在资源路由中创建 GraphQL API 等功能。该工具简化了 GraphQL 在 Remix 中的集成过程，有助于提升开发效率。

Veaury是一款支持Vue3和React互操作的开源工具库。它提供上下文共享、跨框架Hooks和纯模式等功能,可用于混合开发、项目迁移和第三方组件集成。Veaury简化了Vue和React组件的互操作过程,为跨框架开发提供了便利。

audio-player 是一个开源的 React/NextJS 音频播放器组件，具备多曲目播放、标签筛选和搜索功能。该组件支持自定义颜色方案，提供播放列表显示和自动播放等配置选项。适用于 Node.js 18.x 或 20+ 环境，在 React 18.2.0 和 NextJS 14.1.0 上通过测试。开发者可通过 npm 安装，轻松集成专业音频播放功能到项目中。

gpt-frontend-code-gen是一个基于对话的前端开发工具，可快速生成和迭代React组件。该项目支持Chakra UI和ShadcnUI组件生成，提供实时预览功能，并允许通过持续对话修改组件。支持自定义APIKey和BaseUrl配置，兼容多种大语言模型。项目可通过Docker一键部署，适用于快速原型设计和UI迭代，有助于提高前端开发效率。