Skip to content

Commit 829780d

Browse files
Ohh-889Ohh-889
committed
chore(projects): update readme
1 parent b7080ed commit 829780d

File tree

2 files changed

+126
-86
lines changed

2 files changed

+126
-86
lines changed

‎README.en-US.md

+82-63
Original file line numberDiff line numberDiff line change
@@ -1,74 +1,94 @@
1-
```html
21
<div align="center">
3-
<img src="./public/favicon.svg" width="160" />
4-
<h1>React SoybeanAdmin</h1>
2+
<img src="./public/favicon.svg" width="160" />
3+
<h1>React SoybeanAdmin</h1>
54
<span><a href="./README.en-US.md">English</a> | 中文</span>
65
</div>
7-
```
86

97
---
108

119
[![license](https://img.shields.io/badge/license-MIT-green.svg)](./LICENSE)
1210

1311
> [!NOTE]
14-
> If you find `React SoybeanAdmin` helpful, or if you like our project, please give us a ⭐️ on GitHub. Your support is our motivation to keep improving and adding new features! Thank you!
12+
> If you find `React SoybeanAdmin` helpful or like our project, please give us a ⭐️ on GitHub. Your support motivates us to keep improving and adding new features! Thank you for your support!
13+
14+
## Special Thanks
15+
16+
This project is based on the outstanding open-source project [Soybean Admin](https://github.com/soybeanjs/soybean-admin), developed by [Soybean](https://github.com/honghuangdc). It is a React implementation of the original project. Special thanks to Soybean for their contributions to open source and for providing an excellent solution for admin panel development. If you like this project, please also give a ⭐️ to the original [Soybean Admin](https://github.com/soybeanjs/soybean-admin).
1517

1618
## Introduction
1719

18-
[`React Soybean`](https://github.com/mufeng889/react-soybean-admin) is a sleek, elegant, and powerful admin template built with the latest frontend technologies, including React 18, ReactRouter V6, Vite 5, TypeScript, Redux/toolkit, and UnoCSS. It comes with rich theme configuration and components, strict code conventions, and an automated file-based routing system. Additionally, it integrates an online Mock data solution based on ApiFox. `React Soybean` provides a comprehensive one-stop admin management solution, with zero configuration needed, ready to use right out of the box. It also serves as a best practice for learning cutting-edge technologies quickly.
20+
[`React SoybeanAdmin`](https://github.com/mufeng889/react-soybean-admin) is a fresh and elegant admin panel template built on the React18 stack. It adopts the latest frontend technologies, including:
21+
22+
- 🚀 React 18 + ReactRouter V6 + Redux/toolkit
23+
- 🎨 Ant Design + UnoCSS
24+
- 📦 Vite 5 + TypeScript
25+
- 🔐 Role-based access control
26+
- 📱 Mobile-friendly adaptation
27+
- 🌍 Internationalization support
28+
- 🎯 Mock data integration
29+
- 📚 Comprehensive documentation
30+
31+
### Key Features:
32+
33+
- 💡 Strict coding standards and elegant architecture
34+
- ⚡️ Ready to use out of the box, no complex setup needed
35+
- 🛠️ Rich components and theme customization
36+
- 📋 Automated file routing system
37+
- 🔧 Excellent type support
38+
- 📱 Responsive design, perfectly adapted for mobile
39+
- 🎨 Optimistic UI: Automatically captures and displays friendly error messages for debugging and monitoring purposes within components.
40+
- 🚀 Advanced routing features: Extends React-Router V6 API for a more Vue-like experience, making routing management more flexible and efficient.
41+
- ⚡️ CLI tools: Built-in tools for Git commits, file deletions, releases, and more.
42+
43+
Whether you're learning the latest frontend technologies or developing enterprise-grade admin panels, React SoybeanAdmin is your ideal choice.
44+
45+
## Branches
46+
47+
- **`master` branch**: Latest stable version, based on React19 + ReactRouter V7.
48+
- **`v18-router6` branch**: Legacy version, based on React18 + ReactRouter V6.
49+
50+
Both branches will continue to receive bug fixes. If you need the older version, switch to the appropriate branch. The `v18-router6` branch will remain advanced and feature-rich for 3-5 years.
1951

2052
## Versions
2153

2254
### React Version
2355

24-
- **React 18 Version:**
56+
- **React18 Version:**
2557
- [Preview](https://github.com/mufeng889/react-soybean-admin/)
26-
- [Accelerated Access for China](https://react-soybean-admin.pages.dev/)
27-
- [GitHub Repo](https://github.com/mufeng889/react-soybean-admin)
28-
- [Gitee Repo](https://gitee.com/sjgk_dl/react-admin)
58+
- [Faster Access in China](https://react-soybean-admin.pages.dev/)
59+
- [GitHub Repository](https://github.com/mufeng889/react-soybean-admin)
60+
- [Gitee Repository](https://gitee.com/sjgk_dl/react-admin)
2961

3062
#### Documentation
3163

32-
- [Docs](https://react-soybean-docs.ohh-889.com/index-en?theme=dark)
64+
- [Docs](https://react-soybean-docs.ohh-889.com/index-cn?theme=dark)
3365

3466
### Vue Versions
3567

3668
- **NaiveUI Version:**
37-
- [Preview](https://naive.soybeanjs.cn/)
38-
- [GitHub Repo](https://github.com/soybeanjs/soybean-admin)
39-
- [Gitee Repo](https://gitee.com/honghuangdc/soybean-admin)
40-
69+
- [Preview](https://naive.soybeanjs.cn/) - A fresh and elegant admin panel built with Vue3 + NaiveUI.
70+
- [GitHub Repository](https://github.com/soybeanjs/soybean-admin) - Get the latest source code and contribute.
71+
- [Gitee Repository](https://gitee.com/honghuangdc/soybean-admin) - Faster access for China users.
72+
- Features:
73+
- Complete TypeScript support
74+
- Rich theme customization
75+
- Elegant coding style
76+
- Detailed documentation
4177
- **AntDesignVue Version:**
4278
- [Preview](https://antd.soybeanjs.cn/)
43-
- [GitHub Repo](https://github.com/soybeanjs/soybean-admin-antd)
44-
- [Gitee Repo](https://gitee.com/honghuangdc/soybean-admin-antd)
79+
- [GitHub Repository](https://github.com/soybeanjs/soybean-admin-antd)
80+
- [Gitee Repository](https://gitee.com/honghuangdc/soybean-admin-antd)
4581

4682
- **Legacy Version:**
4783
- [Preview](https://legacy.soybeanjs.cn/)
48-
- [GitHub Repo](https://github.com/soybeanjs/soybean-admin/tree/legacy)
49-
50-
## Features
51-
52-
- **Cutting-edge Tech Stack**: Built with the latest popular technologies, including React 18, ReactRouter V6, Vite 5, TypeScript, Redux/toolkit, and UnoCSS.
53-
- **Clean Project Structure**: Uses a pnpm monorepo structure that is clear, elegant, and easy to understand.
54-
- **Strict Code Conventions**: Adheres to the [SoybeanJS Guidelines](https://docs.soybeanjs.cn/zh/standard), integrating eslint, prettier, and simple-git-hooks to ensure code quality.
55-
- **TypeScript**: With strict type checking and built-in hooks for type inference, only simple type definitions are needed to enjoy robust TypeScript type hints, greatly improving code maintainability.
56-
- **Rich Theme Configuration**: Offers various built-in theme settings, perfectly integrated with UnoCSS.
57-
- **Built-in Internationalization**: Easily implement multi-language support.
58-
- **Enhanced Routing**: Extends the React-Router V6 API to offer a Vue-Router-like experience for flexible and efficient routing management.
59-
- **Automated File-based Routing**: Convention-based routing with auto-generated imports, declarations, and types. For more details, check out [Elegant Router](https://github.com/mufeng889/react-auto-route).
60-
- **Flexible Permission System**: Supports both frontend static routes and backend dynamic routes.
61-
- **Comprehensive Page Components**: Includes built-in pages like 403, 404, 500, as well as layout components, tab components, theme configuration components, and more.
62-
- **Command Line Tools**: Built-in efficient CLI tools for git commits, file deletion, publishing, and more.
63-
- **Mobile Adaptability**: Fully supports mobile devices with responsive layouts.
64-
- **User-friendly UI**: Automatically captures and displays errors with a friendly interface, helping users quickly locate and fix issues. It also supports in-component monitoring and reporting.
65-
66-
## Comprehensive Ant Design-style Documentation
67-
68-
- [Docs](https://react-soybean-docs.ohh-889.com/index-en?theme=dark)
84+
- [GitHub Repository](https://github.com/soybeanjs/soybean-admin/tree/legacy)
85+
86+
## Ant Design-Themed Comprehensive Documentation
87+
88+
- [Docs](https://react-soybean-docs.ohh-889.com/index-cn?theme=dark)
6989
![](https://ohh-1321526050.cos.ap-nanjing.myqcloud.com/docs-home.jpg)
7090

71-
## Sample Images
91+
## Demo Screenshots
7292

7393
![](https://soybeanjs-1300612522.cos.ap-guangzhou.myqcloud.com/uPic/soybean-admin-v1-01.png)
7494
![](https://ohh-1321526050.cos.ap-nanjing.myqcloud.com/mobile.png)
@@ -85,92 +105,91 @@
85105

86106
## Usage
87107

88-
**Environment Setup**
108+
### Prerequisites
89109

90-
Make sure your environment meets the following requirements:
110+
Ensure your environment meets the following requirements:
91111

92-
- **git**: You'll need git to clone and manage the project version.
112+
- **git**: For cloning and managing the project.
93113
- **NodeJS**: >=18.12.0, recommended 18.19.0 or higher.
94114
- **pnpm**: >= 8.7.0, recommended 8.14.0 or higher.
95115

96-
**Clone the Project**
116+
### Clone the Repository
97117

98118
```bash
99119
git clone https://github.com/soybeanjs/soybean-admin.git
100120
```
101121

102-
**Install Dependencies**
122+
### Install Dependencies
103123

104124
```bash
105125
pnpm i
106126
```
107127

108-
> Since this project uses pnpm monorepo management, please do not use npm or yarn to install dependencies.
128+
> Since the project uses pnpm monorepo management, please do not use npm or yarn to install dependencies.
109129
110-
**Start the Project**
130+
### Start Development Server
111131

112132
```bash
113133
pnpm dev
114134
```
115135

116-
**Build the Project**
136+
### Build Project
117137

118138
```bash
119139
pnpm build
120140
```
121141

122-
## How to Contribute
142+
## Contribution
123143

124-
We warmly welcome and appreciate all forms of contribution. If you have any ideas or suggestions, feel free to submit a [pull request](https://github.com/mufeng889/react-soybean-admin/pulls) or create a GitHub [issue](https://github.com/mufeng889/react-soybean-admin/issues/new).
144+
We warmly welcome and appreciate all forms of contributions. If you have any ideas or suggestions, please share them via [pull requests](https://github.com/mufeng889/react-soybean-admin/pulls) or GitHub [issues](https://github.com/mufeng889/react-soybean-admin/issues/new).
125145

126146
## Git Commit Guidelines
127147

128-
This project includes a `commit` command that allows you to generate commit messages that follow the [Conventional Commits](https://www.conventionalcommits.org/) standard. When submitting a PR, please use the `commit` command to create a commit message to ensure its compliance with our conventions.
148+
This project includes a `commit` command to generate commit messages following the [Conventional Commits](https://www.conventionalcommits.org/) standard. When submitting PRs, please use the `pnpm commit` command to create standardized commit messages.
129149

130150
## Browser Support
131151

132-
We recommend using the latest version of Chrome for the best development experience.
152+
For the best experience, use the latest version of Chrome.
133153

134154
| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/archive/internet-explorer_9-11/internet-explorer_9-11_48x48.png" alt="IE" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/) | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/) | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/) | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/) | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/) |
135-
| --- |
136-
137-
--- | --- | --- | --- |
138-
| not supported | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
155+
| --- | --- | --- | --- | --- |
156+
| not support | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
139157

140-
## Authors
158+
## Open Source Authors
141159

142160
[Ohh-889](https://github.com/mufeng889)
143161

144162
[Soybean](https://github.com/honghuangdc)
145163

146164
## Contributors
147165

148-
Thanks to the following contributors. If you wish to contribute to this project, please see [How to Contribute](#how-to-contribute).
166+
Thanks to the following contributors. If you want to contribute, please refer to [Contribution](#contribution).
149167

150168
<a href="https://github.com/mufeng889/react-soybean-admin/graphs/contributors">
151169
<img src="https://contrib.rocks/image?repo=mufeng889/react-soybean-admin" />
152170
</a>
153171

154172
## Community
155173

156-
`React Soybean` is a completely open-source and free project aimed at helping developers easily build medium to large-scale admin systems. We also offer WeChat and QQ groups for discussion and support. Feel free to ask questions within the groups.
174+
`React Soybean` is a completely free and open-source project, aiming to make developing medium-to-large admin systems easier. We also provide QQ and WeChat groups for user discussions. Feel free to ask questions in the group.
157175

158176
<div>
159177
<p>QQ Group</p>
160178
<img src="https://soybeanjs-1300612522.cos.ap-guangzhou.myqcloud.com/uPic/qq-soybean-admin-3.jpg" style="width:200px" />
161179
</div>
162180

163181
<div>
164-
<p>Add the following WeChat to be invited into the group</p>
182+
<p>Join the WeChat group via the QR code below</p>
165183
<img src="https://soybeanjs-1300612522.cos.ap-guangzhou.myqcloud.com/uPic/wechat-soybeanjs.jpg" style="width:200px" />
166184
</div>
167185

168186
<div>
169-
<p>Add the following WeChat to be invited into the group</p>
170-
<img src="https://ohh-1321526050.cos.ap-nanjing.myqcloud.com/ohh-889.jpg" style="width:200px" />
187+
<p>Scan below to join the WeChat group</p>
188+
<img src="
189+
https://ohh-1321526050.cos.ap-nanjing.myqcloud.com/ohh-889.jpg" style="width:200px" />
171190
</div>
172191

173192
## License
174193

175-
This project is licensed under the [MIT © 2021 Soybean](./LICENSE) license. It is intended for learning purposes only. For commercial use, please retain the author's copyright information. The author does not guarantee and assumes no responsibility for any risks arising from the use of the software.
176-
```
194+
This project is licensed under [MIT © 2021 Soybean](./LICENSE). It is intended for learning and reference only. For commercial use, please retain the original author's copyright information. The author does not guarantee or take responsibility for any risks associated with using the software.
195+

‎README.md

+44-23
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,51 @@
33
<h1>React SoybeanAdmin</h1>
44
<span><a href="./README.en-US.md">English</a> | 中文</span>
55
</div>
6-
```
76

87
---
98

109
[![license](https://img.shields.io/badge/license-MIT-green.svg)](./LICENSE)
1110

1211
> [!NOTE]
13-
> 如果您觉得 `React SoybeanAdmin`对您有所帮助，或者您喜欢我们的项目，请在 GitHub 上给我们一个 ⭐️。您的支持是我们持续改进和增加新功能的动力！感谢您的支持！
12+
> 如果您觉得 `React SoybeanAdmin` 对您有所帮助，或者您喜欢我们的项目，请在 GitHub 上给我们一个 ⭐️。您的支持是我们持续改进和增加新功能的动力！感谢您的支持！
13+
14+
## 特别鸣谢
15+
16+
本项目是基于 [Soybean](https://github.com/honghuangdc) 开发的优秀开源项目 [Soybean Admin](https://github.com/soybeanjs/soybean-admin) 的 React 版本实现。在此特别感谢 Soybean 的开源贡献,为中后台开发提供了优秀的解决方案。如果您喜欢本项目,也请给原作者的 [Soybean Admin](https://github.com/soybeanjs/soybean-admin) 点个 star ⭐️。
1417

1518
## 简介
1619

17-
[`React Soybean`](https://github.com/mufeng889/react-soybean-admin) 是一个清新优雅、高颜值且功能强大的后台管理模板，基于最新的前端技术栈，包括 React18,ReactRouter V6, Vite5, TypeScript, Redux/toolkit 和 UnoCSS。它内置了丰富的主题配置和组件，代码规范严谨，实现了自动化的文件路由系统。此外，它还采用了基于 ApiFox 的在线Mock数据方案。`React Soybean` 为您提供了一站式的后台管理解决方案，无需额外配置，开箱即用。同样是一个快速学习前沿技术的最佳实践。
20+
[`React SoybeanAdmin`](https://github.com/mufeng889/react-soybean-admin) 是一个基于 React18 技术栈的清新优雅中后台模版。项目采用了最新的前端技术栈:
21+
22+
- 🚀 React 18 + ReactRouter V6 + Redux/toolkit
23+
- 🎨 Ant Design + UnoCSS
24+
- 📦 Vite 5 + TypeScript
25+
- 🔐 基于角色的权限管理
26+
- 📱 移动端适配
27+
- 🌍 国际化支持
28+
- 🎯 Mock 数据方案
29+
- 📚 详尽的文档支持
30+
31+
项目特点:
32+
33+
- 💡 代码规范严谨,架构清晰优雅
34+
- ⚡️ 开箱即用,无需复杂配置
35+
- 🛠️ 丰富的组件和主题配置
36+
- 📋 自动化的文件路由系统
37+
- 🔧 完善的类型支持
38+
- 📱 响应式设计,完美适配移动端
39+
- 🎨 乐观`UI` 项目出现错误自动捕获错误,并显示友好界面,帮助用户快速定位和解决问题,还可以再组件内监控埋点上报。
40+
- 🚀 丰富的路由功能：基于 React-Router V6 扩展了路由 API，提供类似 Vue-Router 的便捷使用体验，让路由管理更加灵活高效。
41+
- ⚡️ 命令行工具：内置高效的命令行工具，git提交、删除文件、发布等。
42+
43+
无论是学习最新前端技术,还是开发企业级中后台项目,React SoybeanAdmin 都是您的不二之选。
44+
45+
## 分支
46+
47+
- `master` 分支: 最新稳定版本,基于 React19 + ReactRouter V7 版本
48+
- `v18-router6` 分支: 基于 React18 + ReactRouter V6 版本
49+
50+
有问题都是会进行修复,如果需要使用旧版本,请切换到对应分支。 v18-router6 在未来3-5年依然会是市面上较为先进 功能强大的版本
1851

1952
## 版本
2053

@@ -33,10 +66,14 @@
3366
### Vue版本
3467

3568
- **NaiveUI 版本:**
36-
- [预览地址](https://naive.soybeanjs.cn/)
37-
- [Github 仓库](https://github.com/soybeanjs/soybean-admin)
38-
- [Gitee 仓库](https://gitee.com/honghuangdc/soybean-admin)
39-
69+
- [预览地址](https://naive.soybeanjs.cn/) - 基于 Vue3 + NaiveUI 构建的清新优雅后台管理模板
70+
- [Github 仓库](https://github.com/soybeanjs/soybean-admin) - 获取最新源码，参与开源贡献
71+
- [Gitee 仓库](https://gitee.com/honghuangdc/soybean-admin) - 国内镜像仓库，访问更快捷
72+
- 特点:
73+
- 完整的 TypeScript 支持
74+
- 丰富的主题配置
75+
- 优雅的代码风格
76+
- 完善的文档说明
4077
- **AntDesignVue 版本:**
4178
- [预览地址](https://antd.soybeanjs.cn/)
4279
- [Github 仓库](https://github.com/soybeanjs/soybean-admin-antd)
@@ -47,22 +84,6 @@
4784
- [Github 仓库](https://github.com/soybeanjs/soybean-admin/tree/legacy)
4885

4986

50-
## 特性
51-
52-
- **前沿技术应用**：采用 React18, ReactRouter V6,Vite5, TypeScript, Redux/toolkit 和 UnoCSS 等最新流行的技术栈。
53-
- **清晰的项目架构**：采用 pnpm monorepo 架构，结构清晰，优雅易懂。
54-
- **严格的代码规范**：遵循 [SoybeanJS 规范](https://docs.soybeanjs.cn/zh/standard)，集成了eslint, prettier 和 simple-git-hooks，保证代码的规范性。
55-
- **TypeScript**： 通过支持严格的类型检查和内置多个 hook 的类型推导，仅需定义简洁的类型，即可享受便捷的 TypeScript 类型提示，显著提升代码的可维护性。
56-
- **丰富的主题配置**：内置多样的主题配置，与 UnoCSS 完美结合。
57-
- **内置国际化方案**：轻松实现多语言支持。
58-
- **丰富的路由功能**：基于 React-Router V6 扩展了路由 API，提供类似 Vue-Router 的便捷使用体验，让路由管理更加灵活高效。
59-
- **自动化文件路由系统**：约定式路由,自动生成路由导入、声明和类型。更多细节请查看 [Elegant Router](https://github.com/mufeng889/react-auto-route)。
60-
- **灵活的权限路由**：同时支持前端静态路由和后端动态路由。
61-
- **丰富的页面组件**：内置多样页面和组件，包括403、404、500页面，以及布局组件、标签组件、主题配置组件等。
62-
- **命令行工具**：内置高效的命令行工具，git提交、删除文件、发布等。
63-
- **移动端适配**：完美支持移动端，实现自适应布局。
64-
- **良好UI**：在发生错误的时候自动捕获错误，并显示友好界面，帮助用户快速定位和解决问题，还可以再组件内监控埋点上报。
65-
6687
## 符合Ant Design风格的保姆级文档
6788

6889
- [地址](https://react-soybean-docs.ohh-889.com/index-cn?theme=dark)

0 commit comments

Comments
 (0)