react plug-ins include: 1. Redux, which provides predictable state management; 2. MobX, which makes state management simple and scalable through function reactive programming; 3. Redux Thunk, asynchronous processing of Redux Middleware; 4. Dva, a data flow solution based on redux and redux-saga; 5. Ant design, a React UI component library; 6. react-icons, a rich icon library based on React; 7. Viser, a visualization library .
#The operating environment of this tutorial: Windows7 system, react18 version, Dell G3 computer.
In order to improve the efficiency of developing React projects, here is a summary of some commonly used plug-ins for React projects.
1. State management
-
Redux: JavaScript state container, providing predictable state management
MobX: Making state management simple and scalable through functional reactive programming
Redux Thunk: Asynchronous processing middleware for Redux
Redux Saga: Redux middleware, used to manage application Side Effects (side effects, such as asynchronous acquisition of data, access to browser cache, etc.)
- ##Dva: A data flow solution based on redux and redux-saga
2. UI component library
- Ant design: React UI component library based on Ant Design design system, mainly used to develop enterprise-level middle and back-end products
- Ant design mobile: React UI mobile based on Ant Design design system End component library
- MaterialUI: The world’s most popular React UI library based on texture design
- React toolbox: A set of functions using CSS modules React components that implement Google's Material Design specification
- React Virtualized: A React solution that can render large lists and tables
- Fabric UI: A collection of Microsoft's open-source UX frameworks for creating beautiful cross-platform applications that share code, design, and interactive behavior
- #React desktop: A React-based JavaScript library designed to bring this Bringing the desktop experience to the web with many macOS Sierra and Windows 10 components included. react-desktop integrates perfectly with NW.js and Electron.js, but can be used in any JavaScript-driven project
- Zent: Youzan PC-side WebUI specification React implementation, provides A complete set of basic UI components and some commonly used business components
- react-icons: A rich icon library based on React encapsulation
3. Tool class
##react-copy-to-clipboard: React-based copy to clipboard component qrcode.react: React-based component for generating QR codes nprogress: Top progress bar component suitable for YouTube, Medium, etc. react-syntax-highlighter: React-based code highlighting component react-contextmenu: right-click menu component emoji -mart: React-based emoticon library react-highlight-words: React-based keyword highlighting
4. Data Visualization
AntV: includes G2, G6, F2, L7 and a complete set of chart usage and design specifications, providing powerful data visualization needs G2Plot: An out-of-the-box visual component library based on G2 packaging recharts: Custom charts built using React and D3 Library Viser: A visualization library that supports multiple mainstream frameworks
5, animation/motion effects
Halogen: A collection of loading animations using React react-move: Beautiful, data-driven React animations, just 3.5kb (gzip) react-spring: An animation library based on spring physics Ant Motion: Provides single and combined animations , and a complete set of animation solutions scenejs: Animation library based on JavaScript and CSS timeline react-text-loop: text carousel Animation
6, dragging/sorting
react-beautiful-dnd:Beautiful , Portability list drag and drop library react-dnd: helps us build complex drag-and-drop interfaces while keeping components separated react-moveable: A flexible and powerful drag library that supports free dragging, scaling, and reference lines react-grid-layout: A powerful grid drag, sort, and zoom library mixitup: powerful list card sorting animation library
7, image processing
react-image-crop: Powerful image cropping library react-sparklines: Automatically generate trend lines based on data dom-to-image: A canvas library that generates images based on DOM react-img-editor: Image editor-
8. Editor related
braft-editor: Rich text editor
powerNice:markdown/rich text editor
GGEditor:Visual diagram editor
react-codemirror2: Code editor
jsoneditor:json editor
h5-dooring:H5 page editor
9. Map related
10. Scaffolding
Create React App: A must-have React fool-proof scaffolding for beginners
Next.js: Build Server-side rendered React scaffolding
umi: Enterprise-level front-end application framework
webpack3_react: Compatible with IE9 and provides a complete React family bucket solution
[Related recommendations: Redis video tutorial]
The above is the detailed content of What plugins are there for react?. For more information, please follow other related articles on the PHP Chinese website!
Statement:The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn