React Admin
基于 Ant Design React 的管理系统架构
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
- React
React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components
- Ant Design
Ant Design is a React UI library that provides a set of pre-designed components and design resources for building high-quality, responsive web applications.
- Templates & Themes
A template or theme refers to a pre-designed layout or structure that provides a basic framework for building a specific type of application or website. It typically includes good design, placeholder content and functional features, allowing developers to customize and fill in the details according to their specific needs.
- Eslint
ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.
- Redux
Redux is a state management library for JavaScript apps that provides a predictable and centralized way to manage application state. It enables developers to write actions and reducers that update the state in response to user interactions, server responses, and other events, and can be used with a variety of front-end frameworks and back-end technologies.
