Anglais | Chinois simplifié
Documentation en ligne : https://www.gin-vue-admin.com
initialisation
Vidéo pédagogique de l'environnement au déploiement
Enseignement du développement (Contributeur : LLemonGreen et Fann)
communauté de communication
marché des plug-ins
1. Ce projet dispose d'une documentation et de didacticiels vidéo détaillés du démarrage au développement en passant par le déploiement.
2. Ce projet nécessite que vous ayez certaines bases en golang et vue
3. Vous pouvez effectuer toutes les opérations via nos tutoriels et documents, nous ne fournissons donc plus de services techniques gratuits. Si vous avez besoin de services, veuillez fournir une assistance payante.
4. Si vous utilisez ce projet à des fins commerciales, veuillez vous conformer à l'accord Apache2.0 et conserver la déclaration de support technique de l'auteur. Vous devez conserver les informations de déclaration de droit d'auteur suivantes, ainsi que les informations de déclaration de droit d'auteur contenues dans les journaux et le code. Les informations conservées requises sont de nature rédactionnelle et n'affecteront aucun contenu commercial. Si vous décidez de les utiliser à des fins commerciales [les activités commerciales qui génèrent des revenus sont toutes des utilisations commerciales] ou doivent être éliminées, veuillez acheter une autorisation.
Gin-vue-admin est une plate-forme de développement full-stack basée sur vue et gin qui sépare le front-end et le back-end. Elle intègre l'authentification jwt, le routage dynamique, le menu dynamique, l'authentification casbin, le générateur de formulaires, le générateur de code et d'autres fonctions, et fournit. de nombreuses fonctions. des exemples de fichiers, vous permettant de consacrer plus de temps au développement commercial.
Aperçu en ligne : http://demo.gin-vue-admin.com
Nom d'utilisateur du test : admin
Mot de passe du test : 123456
Salut ! Tout d'abord, merci d'utiliser gin-vue-admin.
Gin-vue-admin est un ensemble de frameworks open source avec une architecture de séparation front-end et back-end préparée pour une recherche et un développement rapides. Il est conçu pour créer rapidement des projets de petite et moyenne taille.
La croissance de Gin-vue-admin ne peut être séparée du soutien de tous. Si vous êtes prêt à contribuer au code ou à fournir des suggestions pour gin-vue-admin, veuillez lire le contenu suivant.
Les problèmes ne sont utilisés que pour soumettre des bogues ou des fonctionnalités et le contenu lié à la conception peut être fermé directement.
Avant de soumettre un problème, veuillez effectuer une recherche pour voir si le contenu pertinent a été soulevé.
Veuillez d'abord créer une copie dans votre propre projet. Ne créez pas de succursale directement sous l'entrepôt.
Les informations de validation doivent être renseignées sous la forme de [文件名]: 描述信息
, tel que README.md: fix xxx bug
.
Si vous corrigez un bug, veuillez fournir des informations de description dans le PR.
La fusion du code nécessite la participation de deux responsables : une personne révise et approuve, et l'autre révise à nouveau, et peut être fusionné après avoir réussi la révision.
- node版本 > v16.8.3 - golang版本 >= v1.22 - IDE推荐:Goland
Utilisez des outils d'édition tels que Goland
pour ouvrir le répertoire du serveur. N'ouvrez pas le répertoire racine gin-vue-admin.
# Clonez le projet git clone https://github.com/flipped-aurora/gin-vue-admin.git# Entrez le dossier du serveur cd server# Utilisez go mod et installez le package de dépendances go go generate# Exécutez go run.
# Entrez le dossier Web cd web # Installer les dépendances npm install # Démarrer le projet Web npm run serve
allez installer github.com/swaggo/swag/cmd/swag@latest
serveur de CD initialisation du butin
Après avoir exécuté la commande ci-dessus, les trois fichiers
docs.go
,swagger.json
etswagger.yaml
dans le dossier docs apparaîtront dans le répertoire du serveur. Après avoir démarré le service go, entrez http://localhost:8888/swagger dans le répertoire. navigateur. /index.html pour afficher la documentation swagger.
Utilisez VSCode
pour ouvrir le fichier d'espace de travail gin-vue-admin.code-workspace
dans le répertoire racine. Vous pouvez voir trois répertoires virtuels dans la barre latérale : backend
, frontend
, root
.
Vous pouvez également voir trois tâches d'exécution et de débogage : Backend
, Frontend
, Both (Backend & Frontend)
. L'exécution Both (Backend & Frontend)
peut démarrer les projets front-end et front-end en même temps.
Il y a le champ go.toolsEnvVars
dans le fichier de configuration de l'espace de travail, qui est la variable d'environnement de l'outil go utilisée pour VSCode
lui-même. De plus, dans les systèmes dotés de plusieurs versions de Go, vous pouvez spécifier la version en cours d'exécution via gopath
et go.goroot
.
"go.gopath": nul,"go.goroot": nul,
Front-end : utilisez un élément basé sur Vue pour créer des pages de base.
Backend : utilisez Gin pour créer rapidement une API de base de style reposant. Gin est un framework Web écrit en langage Go.
Base de données : utilisez le moteur de base de données MySql
> (5.7) version InnoDB et utilisez gorm pour implémenter les opérations de base sur la base de données.
Mise en cache : utilisez Redis
pour enregistrer le jeton jwt
de l'utilisateur actif actuel et implémenter des restrictions de connexion multipoint.
Documentation API : utilisez Swagger
pour créer une documentation d'automatisation.
Fichier de configuration : utilisez fsnotify et viper pour implémenter le fichier de configuration au format yaml
.
Journalisation : utilisez zap pour implémenter la journalisation.
├── server ├── api (api层) │ └── v1 (v1版本接口) ├── config (配置包) ├── core (核心文件) ├── docs (swagger文档目录) ├── global (全局对象) ├── initialize (初始化) │ └── internal (初始化内部函数) ├── middleware (中间件层) ├── model (模型层) │ ├── request (入参结构体) │ └── response (出参结构体) ├── packfile (静态文件打包) ├── resource (静态资源文件夹) │ ├── excel (excel导入导出默认路径) │ ├── page (表单生成器) │ └── template (模板) ├── router (路由层) ├── service (service层) ├── source (source层) └── utils (工具包) ├── timer (定时器接口封装) └── upload (oss接口封装) web ├── babel.config.js ├── Dockerfile ├── favicon.ico ├── index.html -- 主页面 ├── limit.js -- 助手代码 ├── package.json -- 包管理器代码 ├── src -- 源代码 │ ├── api -- api 组 │ ├── App.vue -- 主页面 │ ├── assets -- 静态资源 │ ├── components -- 全局组件 │ ├── core -- gva 组件包 │ │ ├── config.js -- gva网站配置文件 │ │ ├── gin-vue-admin.js -- 注册欢迎文件 │ │ └── global.js -- 统一导入文件 │ ├── directive -- v-auth 注册文件 │ ├── main.js -- 主文件 │ ├── permission.js -- 路由中间件 │ ├── pinia -- pinia 状态管理器,取代vuex │ │ ├── index.js -- 入口文件 │ │ └── modules -- modules │ │ ├── dictionary.js │ │ ├── router.js │ │ └── user.js │ ├── router -- 路由声明文件 │ │ └── index.js │ ├── style -- 全局样式 │ │ ├── base.scss │ │ ├── basics.scss │ │ ├── element_visiable.scss -- 此处可以全局覆盖 element-plus 样式 │ │ ├── iconfont.css -- 顶部几个icon的样式文件 │ │ ├── main.scss │ │ ├── mobile.scss │ │ └── newLogin.scss │ ├── utils -- 方法包库 │ │ ├── asyncRouter.js -- 动态路由相关 │ │ ├── btnAuth.js -- 动态权限按钮相关 │ │ ├── bus.js -- 全局mitt声明文件 │ │ ├── date.js -- 日期相关 │ │ ├── dictionary.js -- 获取字典方法 │ │ ├── downloadImg.js -- 下载图片方法 │ │ ├── format.js -- 格式整理相关 │ │ ├── image.js -- 图片相关方法 │ │ ├── page.js -- 设置页面标题 │ │ ├── request.js -- 请求 │ │ └── stringFun.js -- 字符串文件 | ├── view -- 主要view代码 | | ├── about -- 关于我们 | | ├── dashboard -- 面板 | | ├── error -- 错误 | | ├── example --上传案例 | | ├── iconList -- icon列表 | | ├── init -- 初始化数据 | | | ├── index -- 新版本 | | | ├── init -- 旧版本 | | ├── layout -- layout约束页面 | | | ├── aside | | | ├── bottomInfo -- bottomInfo | | | ├── screenfull -- 全屏设置 | | | ├── setting -- 系统设置 | | | └── index.vue -- base 约束 | | ├── login --登录 | | ├── person --个人中心 | | ├── superAdmin -- 超级管理员操作 | | ├── system -- 系统检测页面 | | ├── systemTools -- 系统配置相关页面 | | └── routerHolder.vue -- page 入口页面 ├── vite.config.js -- vite 配置文件 └── yarn.lock
Gestion des autorisations : gestion des autorisations basée sur jwt
et casbin
.
Téléchargement et téléchargement de fichiers : implémentez des opérations de téléchargement de fichiers basées sur七牛云
,阿里云
et腾讯云
(veuillez développer votre propre application pour le token
correspondant ou key
correspondante sur chaque plateforme).
Encapsulation de pagination : le frontal utilise mixins
pour encapsuler la pagination, et la méthode de pagination appelle simplement mixins
.
Gestion des utilisateurs : l'administrateur système attribue des rôles d'utilisateur et des autorisations de rôle.
Gestion des rôles : créez l'objet principal pour le contrôle des autorisations et attribuez différentes autorisations d'API et autorisations de menu aux rôles.
Gestion des menus : réalisez une configuration de menu dynamique pour l'utilisateur et réalisez différents menus pour différents rôles.
Gestion des API : différents utilisateurs disposent d'autorisations différentes sur les interfaces API qu'ils peuvent appeler.
Gestion de la configuration : Les fichiers de configuration peuvent être modifiés à la réception (cette fonction n'est pas disponible sur le site d'expérience en ligne).
Recherche conditionnelle : ajoutez des exemples de recherche conditionnelle.
Exemple reposant : vous pouvez vous référer à l'exemple d'API dans le module de gestion des utilisateurs.
Référence du fichier frontal : web/src/view/superAdmin/api/api.vue
Référence du fichier d'arrière-plan : server/router/sys_api.go
Restrictions de connexion multipoint : vous devez remplacer use-multipoint
in system
par true dans config.yaml
(vous devez configurer vous-même les paramètres Redis et Redis dans Config. Pendant la phase de test, veuillez signaler tout bug à temps).
Téléchargement en plusieurs parties : fournit des exemples de téléchargement de fichiers en plusieurs parties et de téléchargement en plusieurs parties de fichiers volumineux.
Générateur de formulaires : générateur de formulaires à l'aide de @Variant Form.
Générateur de code : logique de base de base et générateur de code de caillé simple.
https://www.yuque.com/flipped-aurora
Des vidéos pédagogiques sur le framework front-end sont incluses. Si vous pensez que le projet vous est utile, vous pouvez ajouter mon WeChat personnel : shouzi_1994. Vous êtes invités à faire des demandes précieuses.
(1) Vidéo d'instructions étape par étape
https://www.bilibili.com/video/BV1Rg411u7xH/
(2) Introduction à l'ajustement de la structure des répertoires back-end et comment l'utiliser
https://www.bilibili.com/video/BV1x44y117TT/
(3) vidéo d'enseignement de base du golang
bilibili : https://space.bilibili.com/322210472/channel/detail?cid=108884
(4) Enseignement de base du cadre du gin
bilibili : https://space.bilibili.com/322210472/channel/detail?cid=126418&ctype=0
(5) Vidéo d'introduction à la mise à jour de la version gin-vue-admin
bilibili : https://www.bilibili.com/video/BV1kv4y1g7nT