# django-vue3

**Repository Path**: sanqian66/django-vue3

## Basic Information

- **Project Name**: django-vue3
- **Description**: 💥💥💥遥遥领先，免费开源💥💥💥
使用django+vue3构建的一个前后端分离项目。
后端主要使用的技术栈以及工具：django+redis。
前端主要使用的技术栈以及框架：vue3+ts+element-plus+pinia+echarts。
前后端代码全部开源且不定期更新代码。
喜欢的朋友别忘了给个star收藏起来哟。
- **Primary Language**: Python
- **License**: MulanPSL-2.0
- **Default Branch**: frontend
- **Homepage**: http://www.chensc.com.cn/
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 14
- **Created**: 2024-06-13
- **Last Updated**: 2024-06-13

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

## 星域平台管理系统前端介绍

## 🌿项目简介

本项目前端基于当下流行且常用的vue3作为主要技术栈进行开发，融合了typescript和element-plus-ui，开发bug少，简单易学，项目后端采用了python的django框架作为开发模块，更多详情请移步backend分支进行查看。

## 🍒项目预览

- [http://www.chensc.com.cn/](http://www.chensc.com.cn/)

如域名无法进入，请通过源IP进入预览界面

- [http://47.93.35.47/](http://47.93.35.47/)

## 🌺 框架以及使用技术栈介绍

前端主要采用了vue3+ts+element-plus-ui+echarts+axios+pinai等技术栈和框架搭建

| 技术栈框架      | 官方地址                                 | 简介                                                                                                       |
| --------------- | ---------------------------------------- | ---------------------------------------------------------------------------------------------------------- |
| vue3            | https://cn.vuejs.org/                    | 易学易用，性能出色，适用场景丰富的 Web 前端框架                                                            |
| typescript      | https://www.tslang.cn/                   | JavaScript的一个超集，强类型语言                                                                           |
| element-plus-ui | https://element-plus.gitee.io/zh-CN/     | 基于 Vue 3，面向设计师和开发者的组件库                                                                     |
| axios           | https://www.axios-http.cn/               | Axios 是一个基于 promise 的网络请求库，可以用于浏览器和 node.js。使用简单,包尺寸小且提供了易于扩展的接口。 |
| pinia           | https://pinia.vuejs.org/zh/              | 符合直觉的  Vue.js 状态管理库                                                                              |
| echarts         | https://echarts.apache.org/zh/index.html | 一个基于 JavaScript 的开源可视化图表库                                                                     |

## 🌻 安装

使用了yarn作为包管理工具，安装使用

```javascript
yarn
```

直接进行安装

## 🌼 运行

```javascript
yarn run serve
```

## 🌱 打包

```
yarn run build
```

## 🌸 项目截图

### 🌲 登录和首页

###  **暗黑主题模式**


![输入图片说明](markdown/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20231103094651.png)
![输入图片说明](markdown/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20231103092049.png)
![输入图片说明](markdown/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20231103092103.png)
![输入图片说明](markdown/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20231103092112.png)
**白昼主题模式**
![输入图片说明](markdown/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20231103104919.png)
![输入图片说明](markdown/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20231103104923.png)

### 🌾 书店管理（书籍管理，借书管理）

###  **书籍管理**


![输入图片说明](markdown/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20231030083142.png)
**借书管理**
![输入图片说明](markdown/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20231103105827.png)

### 🌴 古文学习（古诗词学习，古籍学习）

![输入图片说明](markdown/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20231030083126.png)
![输入图片说明](markdown/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20231030083132.png)



**古诗词学习**
![输入图片说明](markdown/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20231030083126.png)
![输入图片说明](markdown/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20231030083132.png)
 **古籍学习**

![输入图片说明](markdown/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20231030083118.png)
![输入图片说明](markdown/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20231030100751.png)