recently I saw some useful React tool libraries, summed up and shared them with you to avoid duplicating wheels. I hope it will be helpful to you ~ I. basic 1. React Infinite Scroller React Infinite Scroller is used to load content indefinitely in a React project. npm address: www.npmjs.com/package/rea... 2. react-dnd React DnD is a set of React high-level components created by React and Dan Abramov, the core author of Redux, that can help build complex drag-and-drop interfaces while keeping components separate. It is mainly used for drag and drop of components. npm address: www.npmjs.com/package/rea... 3. react-beautiful-dnd react-beautiful-dnd is a beautiful and easy-to-use React list drag-and-drop library. ​ npm address: www.npmjs.com/package/rea... 4. react-icons using react-icons, you can easily include popular icons in React projects. ​ npm address: www.npmjs.com/package/rea... 5. react-share react-share is a React social media sharing button and sharing library. ​ npm address: www.npmjs.com/package/rea... 6. create-react-app Create React App is a command line interface tool that allows you to quickly create and run React applications without any configuration. ​ npm address: www.npmjs.com/package/cre... 7. react-intl React Intl provides a React component and Mixin for internationalizing React Web applications. It provides a description of formatted date, number, and string messages. ​ npm address: www.npmjs.com/package/rea... 8. react-router react-router is a routing solution routing solution for React.js. It can easily synchronize your app and URL while providing first-class support for nesting, transformation, and server rendering. ​ npm address: www.npmjs.com/package/rea... 9. React Virtualized react-virtualized is a responsive component that renders large list and table data efficiently and can be used to solve long…

Why did the React team discard defaultProps ? in functional components come to a conclusion first, because it is not necessary. in functional components, we can declare default properties in the form of JS default parameters, as follows: function Foo({foo = 1, bar = "hello"}) { let props = {foo, bar}; //... } The advantage of this is that React 's defaultProps is a black box for most teams. if we put the behavior of the default property in the function component definition, it is more controllable from the point of view of code quality. so what was defaultProps designed for? React the team thinks defaultProps is very useful in classes. because props objects are passed to many different methods: life cycle, callback, and so on. Each function has its own context that requires an initial default value. This makes it difficult to implement using the JS default parameter, because you have to copy the same default value in each function. The following is an example: class Foo { static defaultProps = {foo: 1}; componentDidMount() { let foo = this.props.foo; console.log(foo); } componentDidUpdate() { let foo = this.props.foo; console.log(foo); } componentWillUnmount() { let foo = this.props.foo; console.log(foo); } handleClick = () => { let foo = this.props.foo; console.log(foo); } render() { let foo = this.props.foo; console.log(foo); return <div onClick={this.handleClick} />; } } to sum up, the role of defaultProps is that in class components, new default values can be used in each lifecycle and scope of methods. therefore, it has been implemented in subsequent updates of the React team: using…

recently, t3dotgg, a foreign netizen, suggested that React officially use Create React App to create a new project instead of in the document . It is recommended to use Vite to create a new project . Most netizens agree with this: React's new official document is about to be released (99% is now complete). However, Create React App is still recommended in the Beta version of the official document to create a new project. Two additional alternatives are provided: Vite , Parcel . looking at Create React App's Github repository, we can see that it has not been updated for 5 months, accumulating 1500 + issues . on January 31, Dan Abramov, a core member of the React team, responded to this suggestion, explaining the tradeoffs made by React team members and providing some options. Let's take a look at the details (you can skip to the final conclusion)! Evolution of Create React App when Create React App was released in 2016, the environment of the tool was decentralized. If you want to add React to an existing application, you need to add a & lt;script> tag or import from npm, and then adjust the existing build tool configuration. However, if you want to create a new application built only using React from scratch, there is no clear way to do this. before Create React App, you must install a bunch of tools and connect them together, provide correct presets to use JSX, make different configurations for development and production environments, provide correct settings for resource caching, configure linter, etc.,…