Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/hhhh-wang/react-admin

这是一个基于react开发的后端管理系统,其核心目标是为开发者提供一个轻量级、易上手且可扩展的后台管理解决方案。框架的初心是希望开发者能够在一个易用的基础框架上快速搭建功能强大的后台系统,逐步优化,向更强大、更完善的方向迈进。
https://github.com/hhhh-wang/react-admin

nestjs react-hooks react18 tailwindcss typescript zustand

Last synced: 23 days ago
JSON representation

这是一个基于react开发的后端管理系统,其核心目标是为开发者提供一个轻量级、易上手且可扩展的后台管理解决方案。框架的初心是希望开发者能够在一个易用的基础框架上快速搭建功能强大的后台系统,逐步优化,向更强大、更完善的方向迈进。

Awesome Lists containing this project

README

        




sapling Admin


**Chinese** | [English](./README.en-US.md)

## Introduction

Sapling Admin is a modern-style rapid development platform. The frontend is built with React 18, Vite, Ant Design, and TypeScript, while the backend is developed using NestJS: [sapling Api]. It aims to help developers quickly set up powerful backend management systems.

## Preview
+ No demo yet

![login.png](https://raw.githubusercontent.com/hhhh-wang/react-admin/main/src/assets/login.png)
![home.png](https://raw.githubusercontent.com/hhhh-wang/react-admin/main/src/assets/home.png)
![show.png](https://raw.githubusercontent.com/hhhh-wang/react-admin/main/src/assets/show.png)
![analysis1.png](https://raw.githubusercontent.com/hhhh-wang/react-admin/main/src/assets/analysis1.png)
![analysis2.png](https://raw.githubusercontent.com/hhhh-wang/react-admin/main/src/assets/analysis2.png)
![analysis3.png](https://raw.githubusercontent.com/hhhh-wang/react-admin/main/src/assets/analysis3.png)

## Features

- Built using React 18 hooks
- Developed with Vite for fast development and hot module replacement
- Integrated with Ant Design, offering rich UI components and design patterns
- Written in TypeScript, providing type safety and a better development experience
- Backend integrated with Node.js framework NestJS: [sapling api]for data services
- Common backend management features such as user management, role management, menu management, and region management
- Integrated with internationalization support, allowing easy language switching
- Customizable themes and styles using TailwindCSS for atomic operations and on-demand usage
- Flexible routing configuration with support for multi-level nested routes
- Integrated permission management to control page and button-level access based on user roles (to be improved)
- State management using Zustand
- Data fetching with React-Query
- Responsive design that adapts to various screen sizes and devices

## Quick Start

### Clone the Project

```bash
git clone https://github.com/hhhh-wang/react-admin.git

```

### Install Dependencies

In the project's root directory, run the following command to install project dependencies:

```bash
pnpm install
```

### Start the Development Server

Run the following command to start the development server:

```bash
pnpm dev
```

Visit [http://localhost:7442](http://localhost:7442) to view your application.

### Build for Production

Run the following command to build the production version:

```bash
pnpm build
```
The built files will be in the `dist` directory.