Overview:
React Admin is a management system architecture based on React 17.x and Ant Design 4.x. It provides a visual interface for managing system resources. The system supports online preview and documentation viewing, with a component library called ra-lib. The installation requires Node v12.14.0 and either yarn 1.22.10, tyarn, cnpm, or npm. For development, the environment variable needs to be set, and the cross-env package is recommended for Windows platforms. For quick preview, a mock mode can be enabled by running “REACT_APP_MOCK=true yarn start”. The system also supports development and testing proxies, which can be modified in the src/setupProxyConfig.json file. In terms of production build, the system supports less and css for styling. The css files under the src/less directory are processed as css modules, while regular css files are not. The system incorporates the classnames package for styling, allowing the use of classnames syntax in the className attribute. The theme variables can be modified in the theme.less file. Code formatting is done using Prettier, which helps maintain code consistency among the team members. Git commit triggers code formatting based on Prettier, ensuring that the committed code follows the specified conventions.
Features:
- React 17.x and Ant Design 4.x for a modern and user-friendly UI
- Online preview and documentation viewing
- Support for mock mode for quick preview
- Development and testing proxies for managing and switching between different environments
- Styling support for less and css, with css modules for css files under the src/less directory
- Use of classnames package for easier styling in the className attribute
- Easy modification of theme variables in the theme.less file
- Code formatting using Prettier for consistent code style among team members
Installation:
To install React Admin, follow these steps:
- Make sure you have Node v12.14.0 installed.
- Choose one of the package managers: yarn 1.22.10, tyarn, cnpm, or npm.
- Run the following command to install the necessary dependencies:
yarn install
or
tyarn install
or
cnpm install
or
npm install
- Set the environment variable. For Windows platforms, use the cross-env package:
cross-env REACT_APP_MOCK=true yarn start
Modify the development and testing proxies in the src/setupProxyConfig.json file to manage and switch between different environments.
To build the production version, run the following command:
yarn build
or
tyarn build
or
cnpm run build
or
npm run build
Summary:
React Admin is a powerful management system architecture based on React and Ant Design. It provides a range of features such as online preview, documentation viewing, mock mode, development and testing proxies, and advanced styling options. The installation process is straightforward, and the code formatting using Prettier helps maintain code consistency among team members. With its modern UI and easy customization options, React Admin is a great choice for building management systems.