Giter Site home page Giter Site logo

mufeng889 / react-soybean-admin Goto Github PK

View Code? Open in Web Editor NEW
118.0 4.0 22.0 1.52 MB

一个运用 React18, react-router-dom v6,Redux/toolkit,Vite5, TypeScript, Antd和 UnoCSS的清新优雅、高颜值且功能强大的React后台管理模板。A clean, elegant, beautiful and powerful react-admin template, based on React18, Vite5, TypeScript, react-router-dom v6, Antd,Redux/toolkit and UnoCSS.。

Home Page: https://react-soybean.ohh-889.com

License: MIT License

TypeScript 97.24% JavaScript 0.07% HTML 0.08% CSS 2.34% SCSS 0.28%
admin antd antd-admin-react react-admin react-router-dom-v6 react18 redux redux-toolkit vite5-react18

react-soybean-admin's Introduction

React SoybeanAdmin

English | 中文

license

Note

如果您觉得 React SoybeanAdmin对您有所帮助,或者您喜欢我们的项目,请在 GitHub 上给我们一个 ⭐️。您的支持是我们持续改进和增加新功能的动力!感谢您的支持!

简介

React Soybean 是一个清新优雅、高颜值且功能强大的后台管理模板,基于最新的前端技术栈,包括 React18,ReactRouter V6, Vite5, TypeScript, Redux/toolkit 和 UnoCSS。它内置了丰富的主题配置和组件,代码规范严谨,实现了自动化的文件路由系统。此外,它还采用了基于 ApiFox 的在线Mock数据方案。SReact Soybean 为您提供了一站式的后台管理解决方案,无需额外配置,开箱即用。同样是一个快速学习前沿技术的最佳实践。

版本

React版本

文档

Vue版本

文档

特性

  • 前沿技术应用:采用 React18, ReactRouter V6,Vite5, TypeScript, Redux/toolkit 和 UnoCSS 等最新流行的技术栈。
  • 清晰的项目架构:采用 pnpm monorepo 架构,结构清晰,优雅易懂。
  • 严格的代码规范:遵循 SoybeanJS 规范,集成了eslint, prettier 和 simple-git-hooks,保证代码的规范性。
  • TypeScript: 支持严格的类型检查,提高代码的可维护性。
  • 丰富的主题配置:内置多样的主题配置,与 UnoCSS 完美结合。
  • 内置国际化方案:轻松实现多语言支持。
  • 自动化文件路由系统:自动生成路由导入、声明和类型。更多细节请查看 Elegant Router
  • 灵活的权限路由:同时支持前端静态路由和后端动态路由。
  • 丰富的页面组件:内置多样页面和组件,包括403、404、500页面,以及布局组件、标签组件、主题配置组件等。
  • 命令行工具:内置高效的命令行工具,git提交、删除文件、发布等。
  • 移动端适配:完美支持移动端,实现自适应布局。

错误边界

  • 良好UI:在发生错误的时候自动捕获错误,并显示友好界面,帮助用户快速定位和解决问题,还可以再组件内监控埋点上报。

符合Ant Design风格的保姆级文档

示例图片

使用

环境准备

确保你的环境满足以下要求:

  • git: 你需要git来克隆和管理项目版本。
  • NodeJS: >=18.12.0,推荐 18.19.0 或更高。
  • pnpm: >= 8.7.0,推荐 8.14.0 或更高。

克隆项目

git clone https://github.com/soybeanjs/soybean-admin.git

安装依赖

pnpm i

由于本项目采用了 pnpm monorepo 的管理方式,因此请不要使用 npm 或 yarn 来安装依赖。

启动项目

pnpm dev

构建项目

pnpm build

如何贡献

我们热烈欢迎并感谢所有形式的贡献。如果您有任何想法或建议,欢迎通过提交 pull requests 或创建 GitHub issue 来分享。

Git 提交规范

本项目已内置 commit 命令,您可以通过执行 pnpm commit 来生成符合 Conventional Commits 规范的提交信息。在提交PR时,请务必使用 commit 命令来创建提交信息,以确保信息的规范性。

浏览器支持

推荐使用最新版的 Chrome 浏览器进行开发,以获得更好的体验。

IE  Edge Firefox Chrome Safari
not support last 2 versions last 2 versions last 2 versions last 2 versions

开源作者

Ohh-889

Soybean

贡献者

感谢以下贡献者的贡献。如果您想为本项目做出贡献,请参考 如何贡献

交流

React Soybean 是完全开源免费的项目,在帮助开发者更方便地进行中大型管理系统开发,同时也提供微信和 QQ 交流群,使用问题欢迎在群内提问。

QQ交流群

添加下面微信邀请进微信群

添加下面微信邀请进微信群

开源协议

项目基于 MIT © 2021 Soybean 协议,仅供学习参考,商业使用请保留作者版权信息,作者不保证也不承担任何软件的使用风险。

react-soybean-admin's People

Contributors

azir-11 avatar mufeng889 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

react-soybean-admin's Issues

[Bug]: 链接无法访问

软件版本

1

运行环境

Windows (64)

运行架构

None

重现步骤

image
react-soybean.ohh-889.com这个链接进不去

期望的结果是什么?

进的去

实际的结果是什么?

进不去

日志记录(可选)

No response

补充说明(可选)

No response

[Bug]: 关于页面:Github 地址没有添加

Software Version

0.2.1

Operating Environment

Windows (64)

Operating Architecture

None

Reproduce Steps

关于页面:Github 地址没有添加

What is the expected result?

在package.json中加一个homepage字段

What is the actual result?

在package.json中没有homepage字段

Logging (Optional)

No response

Additional Description (Optional)

No response

[Bug]: useTableScroll在屏幕宽度发生变化时,不会触发

Software Version

0.2.1

Operating Environment

Windows (64)

Operating Architecture

None

Reproduce Steps

useTableScroll在屏幕宽度发生变化时,不会触发

What is the expected result?

希望可以自适应

What is the actual result?

useTableScroll在屏幕宽度发生变化时,不会触发

Logging (Optional)

No response

Additional Description (Optional)

No response

[功能]: 多页签切换可以保留状态

描述

当前多页签切换数据会丢,失去了多页签的意义

建议的解决方案

多页签切换时保留状态

替代方案

No response

额外的上下文

No response

[Bug]: 登录页面,刷新控制台报错,再次刷新处于加载状态

软件版本

node18

运行环境

MacOS

运行架构

ARM [64] (别名:AArch64 / ARMv8)

重现步骤

image 登录页面,刷新控制台报错,再次刷新处于加载状态

期望的结果是什么?

登录页面刷新正常

实际的结果是什么?

登录页面,刷新控制台报错,再次刷新处于加载状态

日志记录(可选)

No response

补充说明(可选)

No response

[Bug]: 左侧菜单选中状态异常

软件版本

node18

运行环境

MacOS

运行架构

AMD64

重现步骤

作者你好,模板中发现一个问题,先点击标签页,右侧会打开标签页,再页面到权限页,右侧内容会变化,但是左侧的选中菜单,没有发生变化。这个是bug嘛
07c9700deccdf134ac83251d16c74bb7

期望的结果是什么?

选中那个页面,左侧菜单对应选中状态

实际的结果是什么?

固定在第一次选中的菜单,切换页面没反应,二级路由

日志记录(可选)

No response

补充说明(可选)

No response

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.