Skip to content

Commit

Permalink
docs(projects): update README.md
Browse files Browse the repository at this point in the history
  • Loading branch information
honghuangdc committed Jan 17, 2024
1 parent be0087c commit 3b31b19
Show file tree
Hide file tree
Showing 2 changed files with 85 additions and 41 deletions.
62 changes: 42 additions & 20 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,22 +3,41 @@
<h1>Soybean Admin</h1>
<span>English | <a href="./README.zh_CN.md">中文</a></span>
</div>
<br />

[![license](https://img.shields.io/badge/license-MIT-green.svg)](./LICENSE) ![](https://img.shields.io/github/stars/honghuangdc/soybean-admin) ![](https://img.shields.io/github/forks/honghuangdc/soybean-admin)

>[!IMPORTANT]
> the old version of `Soybean Admin` is moved to branch [legacy](https://github.com/honghuangdc/soybean-admin/tree/legacy). It is recommended to use the latest version of `Soybean Admin`.
> the documents of new version is processing, please wait patiently.
> [!TIP]
> If you think `Soybean Admin` is helpful to you, or you like our project, please give us a ⭐️ on GitHub. Your support is the driving force for us to continue to improve and add new features! Thank you for your support!
<br />

[![Star History Chart](https://api.star-history.com/svg?repos=honghuangdc/soybean-admin&type=Date)](https://star-history.com/#honghuangdc/soybean-admin&Date)

## Introduction

[Soybean Admin](https://github.com/soybeanjs/soybean-admin) is a fresh and elegant admin template based on Vue3, Vite5, TypeScript, Pinia and UnoCSS. It uses the latest popular front-end technology stack, built-in rich theme configuration, has a very high code specification, and is has an automatic, intelligent file routing system. It use ApiFox to generate mock data, out-of-the-box admin solutions, can also be used for learning reference.
[`Soybean Admin`](https://github.com/soybeanjs/soybean-admin) is an elegant and powerful admin template, based on the latest front-end technology stack, including Vue3, Vite5, TypeScript, Pinia and UnoCSS. It has built-in rich theme configuration and components, strict code specifications, and an automated file routing system. In addition, it also uses the online mock data solution based on ApiFox. `Soybean Admin` provides you with a one-stop admin solution, no additional configuration, and out of the box. It is also a best practice for learning new technologies quickly.



## Features

- **Popular technology stack**: Vue3, Vite5, TypeScript, Pinia, UnoCSS.
- **Clean Structure**: Use pnpm monorepo, clean and elegant structure, easy to maintain.
- **TypeScript**: Strictly typed, easy to maintain.
- **Theme configuration**: Built-in rich theme configuration, easy to incorporate UnoCSS.
- **File routing System**: Automatic, intelligent file routing system. more details in [Elegant Router](https://github.com/soybeanjs/elegant-router).
- **Auth Router**: Support front-end static routing and back-end dynamic routing.
- **Code Specification**: Very high code specification. more details in [SoybeanJS Code Standard]().
- **Cutting-edge technology application**: using the latest popular technology stack such as Vue3, Vite5, TypeScript, Pinia and UnoCSS.
- **Clear project architecture**: using pnpm monorepo architecture, clear structure, elegant and easy to understand.
- **Strict code specifications**: follow the [SoybeanJS specification](https://docs.soybeanjs.cn/standard), integrate eslint, prettier and simple-git-hooks to ensure the code is standardized.
- **TypeScript**: support strict type checking to improve code maintainability.
- **Rich theme configuration**: built-in a variety of theme configurations, perfectly integrated with UnoCSS.
- **Built-in internationalization solution**: easily realize multi-language support.
- **Automated file routing system**: automatically generate route import, declaration and type. For more details, please refer to [Elegant Router](https://github.com/soybeanjs/elegant-router).
- **Flexible permission routing**: support both front-end static routing and back-end dynamic routing.
- **Rich page components**: built-in a variety of pages and components, including 403, 404, 500 pages, as well as layout components, tag components, theme configuration components, etc.
- **Command line tool**: built-in efficient command line tool, git commit, delete file, release, etc.
- **Mobile adaptation**: perfectly support mobile terminal to realize adaptive layout.


## Preview

Expand All @@ -35,6 +54,7 @@
| --- | --- | --- | --- |
| NaiveUI | [github](https://github.com/honghuangdc/soybean-admin) | [gitee](https://gitee.com/honghuangdc/soybean-admin) | [preview](https://admin.soybeanjs.cn) |
| AntDesign Vue | [github](https://github.com/soybeanjs/soybean-admin-antd) | [gitee](https://gitee.com/honghuangdc/soybean-admin-antd) | [preview](https://antd.soybeanjs.cn) |
| Documentation | [github](https://github.com/honghuangdc/soybean-admin-docs) | [gitee](https://gitee.com/honghuangdc/soybean-admin-docs) | [preview](https://docs.soybeanjs.cn) |

## Example Images

Expand All @@ -50,45 +70,47 @@

## Usage

- Environment Prepare
**Environment Preparation**

Make sure your environment meets the following requirements:

- **NodeJS**: >= 18.0.0 (recommend >=18.19.0)
> recommend use [fnm](https://github.com/Schniz/fnm) to manage nodejs version. [Installation Tutorial](https://juejin.cn/post/7113462239734022158)
- **pnpm**: >= 8.0.0 (recommend >=8.14.0)
- **git**
- **git**: you need git to clone and manage project versions.
- **NodeJS**: >=18.0.0, recommended 18.19.0 or higher.
> You can use [fnm](https://github.com/Schniz/fnm) to manage your NodeJS version, [installation tutorial](https://juejin.cn/post/7113462239734022158).
- **pnpm**: >= 8.0.0, recommended 8.14.0 or higher.

- Clone Project
**Clone Project**

```bash
git clone https://github.com/honghuangdc/soybean-admin.git
```

- Install Dependencies
**Install Dependencies**

```bash
pnpm i
```
> The project uses pnpm monorepo, so you can't use npm or yarn to install dependencies.
> Since this project uses the pnpm monorepo management method, please do not use npm or yarn to install dependencies.
- Start Project
**Start Project**

```bash
pnpm dev
```

- Build Project
**Build Project**

```bash
pnpm build
```

## How to Contribute

We welcome all contributions. You can submit any ideas as [pull requests](https://github.com/honghuangdc/soybean-admin/pulls) or as a GitHub [issue](https://github.com/honghuangdc/soybean-admin/issues/new).
We warmly welcome and appreciate all forms of contributions. If you have any ideas or suggestions, please feel free to share them by submitting [pull requests](https://github.com/honghuangdc/soybean-admin/pulls) or creating GitHub [issue](https://github.com/honghuangdc/soybean-admin/issues/new).

## Git Commit Guidelines

The project has built-in command `commit`, so by executing `pnpm commit` you can create a commit message following [Conventional Commits](conventionalcommits)
This project has built-in `commit` command, you can execute `pnpm commit` to generate commit information that conforms to [Conventional Commits](conventionalcommits) specification. When submitting PR, please be sure to use `commit` command to create commit information to ensure the standardization of information.

## Browser Support

Expand Down
64 changes: 43 additions & 21 deletions README.zh_CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,22 +3,40 @@
<h1>Soybean Admin</h1>
<span><a href="./README.zh_CN.md">English</a> | 中文</span>
</div>
<br />

[![license](https://img.shields.io/badge/license-MIT-green.svg)](./LICENSE) ![](https://img.shields.io/github/stars/honghuangdc/soybean-admin) ![](https://img.shields.io/github/forks/honghuangdc/soybean-admin)

>[!IMPORTANT]
> 旧版本的 `Soybean Admin` 已经移动到分支 [legacy](https://github.com/honghuangdc/soybean-admin/tree/legacy)。建议使用最新版本的 `Soybean Admin`
> 新版本的文档正在编写中,请耐心等待。
> [!TIP]
> 如果您觉得 `Soybean Admin`对您有所帮助,或者您喜欢我们的项目,请在 GitHub 上给我们一个 ⭐️。您的支持是我们持续改进和增加新功能的动力!感谢您的支持!
<br />

[![Star History Chart](https://api.star-history.com/svg?repos=honghuangdc/soybean-admin&type=Date)](https://star-history.com/#honghuangdc/soybean-admin&Date)


## 简介

[Soybean Admin](https://github.com/honghuangdc/soybean-admin) 是一个基于 Vue3Vite5TypeScript、NaiveUI、Pinia 和 UnoCSS 的清新优雅的后台管理模板。采用最新流行的前端技术栈,内置丰富的主题配置,代码规范性极高,拥有自动化、智能化的文件路由系统。使用 ApiFox 生成模拟数据,开箱即用的后台管理解决方案,也可用于学习参考
[`Soybean Admin`](https://github.com/honghuangdc/soybean-admin) 是一个优雅且功能强大的后台管理模板,基于最新的前端技术栈,包括 Vue3, Vite5, TypeScript, Pinia 和 UnoCSS。它内置了丰富的主题配置和组件,代码规范严谨,实现了自动化的文件路由系统。此外,它还采用了基于 ApiFox 的在线Mock数据方案。`Soybean Admin` 为您提供了一站式的后台管理解决方案,无需额外配置,开箱即用。同样是一个快速学习新技术的最佳实践

## 特性

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


## 预览

Expand All @@ -35,6 +53,7 @@
| --- | --- | --- | --- |
| NaiveUI | [github](https://github.com/honghuangdc/soybean-admin) | [gitee](https://gitee.com/honghuangdc/soybean-admin) | [preview](https://admin.soybeanjs.cn) |
| AntDesign Vue | [github](https://github.com/soybeanjs/soybean-admin-antd) | [gitee](https://gitee.com/honghuangdc/soybean-admin-antd) | [preview](https://antd.soybeanjs.cn) |
| 文档 | [github](https://github.com/honghuangdc/soybean-admin-docs) | [gitee](https://gitee.com/honghuangdc/soybean-admin-docs) | [preview](https://docs.soybeanjs.cn) |

## 示例图片

Expand All @@ -50,45 +69,48 @@

## 使用

- 环境准备
**环境准备**

- **NodeJS**: >= 18.0.0 (推荐 >=18.19.0)
> 推荐使用 [fnm](https://github.com/Schniz/fnm) 管理NodeJS版本. [安装教程](https://juejin.cn/post/7113462239734022158)
- **pnpm**: >= 8.0.0 (推荐 >=8.14.0)
- **git**
确保你的环境满足以下要求:

- 克隆项目
- **git**: 你需要git来克隆和管理项目版本。
- **NodeJS**: >=18.0.0,推荐 18.19.0 或更高。
> 你可以使用 [fnm](https://github.com/Schniz/fnm) 来管理你的NodeJS版本,[安装教程](https://juejin.cn/post/7113462239734022158)
- **pnpm**: >= 8.0.0,推荐 8.14.0 或更高。

**克隆项目**

```bash
git clone https://github.com/honghuangdc/soybean-admin.git
```

- 安装依赖
**安装依赖**

```bash
pnpm i
```
> 项目采用 pnpm monorepo,所以不能使用 npm 或 yarn 安装依赖
> 由于本项目采用了 pnpm monorepo 的管理方式,因此请不要使用 npm 或 yarn 来安装依赖
- 启动项目
**启动项目**

```bash
pnpm dev
```

- 构建项目
**构建项目**

```bash
pnpm build
```

## 如何贡献

我们欢迎所有的贡献。您可以将任何想法提交为 [pull requests](https://github.com/honghuangdc/soybean-admin/pulls) GitHub [issue](https://github.com/honghuangdc/soybean-admin/issues/new)
我们热烈欢迎并感谢所有形式的贡献。如果您有任何想法或建议,欢迎通过提交 [pull requests](https://github.com/honghuangdc/soybean-admin/pulls) 或创建 GitHub [issue](https://github.com/honghuangdc/soybean-admin/issues/new) 来分享

## Git 提交规范

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


## 浏览器支持

Expand Down Expand Up @@ -118,7 +140,7 @@ pnpm build

## 捐赠

如果您认为本项目对您有所帮助,可以请 Soybean 喝杯咖啡以示支持,Soybean 的开源动力离不开您的支持和鼓励
如果您觉得本项目对您有所帮助,欢迎您以买杯咖啡的方式来支持 Soybean。您的支持和鼓励是 Soybean 持续开源的重要动力

![](https://soybeanjs-1300612522.cos.ap-guangzhou.myqcloud.com/uPic/donation.png)

Expand Down

0 comments on commit 3b31b19

Please sign in to comment.