Note
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!
This project is based on the outstanding open-source project Soybean Admin, developed by Soybean. 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.
React SoybeanAdmin is a fresh and elegant admin panel template built on the React18 stack. It adopts the latest frontend technologies, including:
- 🚀 React 18 + ReactRouter V6 + Redux/toolkit
- 🎨 Ant Design + UnoCSS
- 📦 Vite 5 + TypeScript
- 🔐 Role-based access control
- 📱 Mobile-friendly adaptation
- 🌍 Internationalization support
- 🎯 Mock data integration
- 📚 Comprehensive documentation
- 💡 Strict coding standards and elegant architecture
- ⚡️ Ready to use out of the box, no complex setup needed
- 🛠️ Rich components and theme customization
- 📋 Automated file routing system
- 🔧 Excellent type support
- 📱 Responsive design, perfectly adapted for mobile
- 🎨 Optimistic UI: Automatically captures and displays friendly error messages for debugging and monitoring purposes within components.
- 🚀 Advanced routing features: Extends React-Router V6 API for a more Vue-like experience, making routing management more flexible and efficient.
- ⚡️ CLI tools: Built-in tools for Git commits, file deletions, releases, and more.
Whether you're learning the latest frontend technologies or developing enterprise-grade admin panels, React SoybeanAdmin is your ideal choice.
masterbranch: Latest stable version, based on React19 + ReactRouter V7.v18-router6branch: Legacy version, based on React18 + ReactRouter V6.
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.
- React18 Version:
-
NaiveUI Version:
- Preview - A fresh and elegant admin panel built with Vue3 + NaiveUI.
- GitHub Repository - Get the latest source code and contribute.
- Gitee Repository - Faster access for China users.
- Features:
- Complete TypeScript support
- Rich theme customization
- Elegant coding style
- Detailed documentation
-
AntDesignVue Version:
-
Legacy Version:
Ensure your environment meets the following requirements:
- git: For cloning and managing the project.
- NodeJS: >=18.12.0, recommended 18.19.0 or higher.
- pnpm: >= 8.7.0, recommended 8.14.0 or higher.
git clone https://github.com/soybeanjs/soybean-admin.gitpnpm iSince the project uses pnpm monorepo management, please do not use npm or yarn to install dependencies.
pnpm devpnpm buildWe warmly welcome and appreciate all forms of contributions. If you have any ideas or suggestions, please share them via pull requests or GitHub issues.
This project includes a commit command to generate commit messages following the Conventional Commits standard. When submitting PRs, please use the pnpm commit command to create standardized commit messages.
For the best experience, use the latest version of Chrome.
 |
 |
 |
 |
 |
|---|---|---|---|---|
| not support | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
Thanks to the following contributors. If you want to contribute, please refer to Contribution.
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.
QQ Group
Join the WeChat group via the QR code below
Scan below to join the WeChat group
This project is licensed under MIT © 2021 Soybean. 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.