React 生态
1. 状态管理
Redux JavaScript 状态容器,提供可预测化的状态管理
MobX 通过函数响应式编程使得状态管理变得简单和可扩展
Redux Thunk Redux的异步处理中间件
Redux Saga Redux中间件,用于管理应用程序 Side Effect(副作用,例如异步获取数据,访问浏览器缓存等)
Dva 一个基于 redux 和 redux-saga 的数据流方案
2. UI组件库
Ant design 基于 Ant Design 设计体系的 React UI 组件库,主要用于研发企业级中后台产品
Ant design mobile 基于 Ant Design 设计体系的 React UI 移动端组件库
MaterialUI 世界最受欢迎的基于质感设计的React UI库
React toolbox 一套使用CSS模块功能实现Google的Material Design规范的React组件
React Virtualized 一个能渲染大型列表和表格的React解决方案
Fabric UI 微软开源的UX框架的集合,用于创建共享代码,设计和交互行为的精美的跨平台应用程序
React desktop 基于React的JavaScript库,旨在将本机桌面体验带入网络,其中包含许多macOS Sierra和Windows 10组件。react-desktop与NW.js和Electron.js完美结合,但是可以在任何JavaScript驱动的项目中使用
Zent 有赞 PC 端 WebUI 规范的 React 实现,提供了一整套基础的 UI 组件以及一些常用的业务组件
react-icons 基于React封装的丰富的图标库
Ant-Motion 蚂蚁动画库
3. 工具类
react-copy-to-clipboard 基于React的复制到剪切板组件
qrcode.react 基于React的生成二维码的组件
nprogress 适用于YouTube,Medium等的顶部进度条组件
react-syntax-highlighter 基于React的代码高亮组件
react-contextmenu 右键菜单组件
emoji-mart 基于React的表情库
react-highlight-words 基于React的关键字高亮
react-countup 数字自增动画
react-document-title 动态改变网页title
react-masonry-component react瀑布流组件
react-media react @media 解决方案
react-slick react 跑马灯
short-number 数字转中文
rc-animate react动画组件
react-custom-scrollbars 滚动
particles-bg粒子效果背景
pubsub-js发布订阅插件
react-zmage 基于react可缩放图片控件
Viewer 图片查看器
react-json-view JSON格式化组件
4. 数据可视化
AntV 包含 G2、G6、F2、L7 以及一套完整的图表使用和设计规范, 提供强大的数据可视化需求
G2Plot 基于G2封装的开箱即用的可视化组件库
recharts 使用React和D3构建的自定义的图表库
Viser 支持多种主流框架的可视化库
bizcharts 图表库
jspdf pdf生成器
5. 动画/动效果
Halogen 使用React的加载动画集合
react-move 漂亮的,数据驱动的React动画,只需3.5kb(gzip)
react-spring 一个基于弹簧物理学的动画库
Ant Motion 提供了单项,组合动画,以及整套动画解决方案
scenejs 基于JavaScript和CSS时间轴的动画库
react-text-loop 文字轮播动画
react-typed 打字机效果
react-motion spring 动画的提出者,不支持 hooks api
react-spring 灵感来源于 react-motion,支持 hooks,功能强大
framer-motion 支持 hooks,功能强大,同时增加了很多声明式属性,api 简洁友好
作者:CS_Joe
链接:https://juejin.cn/post/6934657845094776845
来源:稀土掘金
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
6. 拖拽/排序
react-beautiful-dnd 漂亮,可移植性 列表拖拽库react-dnd 可帮助我们构建复杂的拖放界面,同时保持组件的分离
react-moveable 支持自由拖拽, 缩放, 参考线的灵活强大的拖拽库
react-grid-layout 强大的网格拖拽排序缩放库
mixitup 强大的列表卡片排序动画库
7. 图像处理
react-image-crop 强大的图片裁切库
react-sparklines 基于数据自动生成趋势线
dom-to-image 基于dom生成图片的canvas库
react-img-editor 图片编辑器
canvas2image canvas生成图片
8. 编辑器相关
tinymce 富文本编辑器
braft-editor 富文本编辑器
powerNice markdown/富文本编辑器
GGEditor 可视化图编辑器
react-codemirror2 代码编辑器
jsoneditor json编辑器
h5-dooring H5页面编辑器
9. 地图相关
openlayers 地图插件
google-map-react 谷歌地图插件
react-amap 高德地图插件
@uiw/react-baidu-map 百度地图
10. 脚手架
Create React App 初学者必备React傻瓜式脚手架
Next.js 构建服务端渲染的React脚手架
umi 企业级前端应用框架
dvajs 数据流整合框架
webpack3_react 兼容IE9+且提供完整的React全家桶解决方案
1. 状态管理Redux JavaScript 状态容器,提供可预测化的状态管理MobX 通过函数响应式编程使得状态管理变得简单和可扩展Redux Thunk Redux的异步处理中间件Redux Saga Redux中间件,用于管理应用程序 Side Effect(副作用,例如异步获取数据,访问浏览器缓存等)Dva 一个基于 redux 和 redux-saga 的数据流方案
2. UI组件库Ant design 基于 Ant Design 设计体系的 React UI 组件库,主要用于研发企业级中后台产品Ant design mobile 基于 Ant Design 设计体系的 React UI 移动端组件库MaterialUI 世界最受欢迎的基于质感设计的React UI库React toolbox 一套使用CSS模块功能实现Google的Material Design规范的React组件React Virtualized 一个能渲染大型列表和表格的React解决方案Fabric UI 微软开源的UX框架的集合,用于创建共享代码,设计和交互行为的精美的跨平台应用程序React desktop 基于React的JavaScript库,旨在将本机桌面体验带入网络,其中包含许多macOS Sierra和Windows 10组件。react-desktop与NW.js和Electron.js完美结合,但是可以在任何JavaScript驱动的项目中使用Zent 有赞 PC 端 WebUI 规范的 React 实现,提供了一整套基础的 UI 组件以及一些常用的业务组件react-icons 基于React封装的丰富的图标库
3. 工具类react-copy-to-clipboard 基于React的复制到剪切板组件qrcode.react 基于React的生成二维码的组件nprogress 适用于YouTube,Medium等的顶部进度条组件react-syntax-highlighter 基于React的代码高亮组件react-contextmenu 右键菜单组件emoji-mart 基于React的表情库react-highlight-words 基于React的关键字高亮
4. 数据可视化AntV 包含 G2、G6、F2、L7 以及一套完整的图表使用和设计规范, 提供强大的数据可视化需求G2Plot 基于G2封装的开箱即用的可视化组件库recharts 使用React和D3构建的自定义的图表库Viser 支持多种主流框架的可视化库
5. 动画/动效果Halogen 使用React的加载动画集合react-move 漂亮的,数据驱动的React动画,只需3.5kb(gzip)react-spring 一个基于弹簧物理学的动画库Ant Motion 提供了单项,组合动画,以及整套动画解决方案scenejs 基于JavaScript和CSS时间轴的动画库react-text-loop 文字轮播动画
6. 拖拽/排序react-beautiful-dnd 漂亮,可移植性 列表拖拽库react-dnd 可帮助我们构建复杂的拖放界面,同时保持组件的分离react-moveable 支持自由拖拽, 缩放, 参考线的灵活强大的拖拽库react-grid-layout 强大的网格拖拽排序缩放库mixitup 强大的列表卡片排序动画库
7. 图像处理react-image-crop 强大的图片裁切库react-sparklines 基于数据自动生成趋势线dom-to-image 基于dom生成图片的canvas库react-img-editor 图片编辑器
8. 编辑器相关braft-editor 富文本编辑器powerNice markdown/富文本编辑器GGEditor 可视化图编辑器react-codemirror2 代码编辑器jsoneditor json编辑器h5-dooring H5页面编辑器
9. 地图相关google-map-react 谷歌地图插件react-amap 高德地图插件@uiw/react-baidu-map 百度地图
10. 脚手架Create React App 初学者必备React傻瓜式脚手架Next.js 构建服务端渲染的React脚手架umi 企业级前端应用框架webpack3_react 兼容IE9+且提供完整的React全家桶解决方案