gin vue admin
2024/10/20
Bahasa Inggris |. Cina Sederhana
Dokumentasi online: https://www.gin-vue-admin.com
inisialisasi
Dari lingkungan hingga video instruksi penerapan
Pengajaran Pengembangan (Kontributor: LLemonGreen Dan Fann)
komunitas komunikasi
pasar plug-in
1. Proyek ini memiliki dokumentasi dan tutorial video terperinci mulai dari permulaan hingga pengembangan hingga penerapan.
2. Proyek ini mengharuskan Anda memiliki dasar tertentu dalam golang dan vue
3. Anda dapat menyelesaikan semua operasi melalui tutorial dan dokumen kami, jadi kami tidak lagi menyediakan layanan teknis gratis. Jika Anda membutuhkan layanan, berikan dukungan berbayar.
4. Jika Anda menggunakan proyek ini untuk tujuan komersial, harap patuhi perjanjian Apache2.0 dan simpan pernyataan dukungan teknis penulis. Anda perlu menyimpan informasi pernyataan hak cipta berikut, serta informasi pernyataan hak cipta yang terkandung dalam log dan kode. Informasi yang disimpan yang diperlukan bersifat copywriting dan tidak akan memengaruhi konten bisnis apa pun. Jika Anda memutuskan untuk menggunakannya secara komersial [aktivitas bisnis yang menghasilkan pendapatan semuanya adalah penggunaan komersial] atau harus dihilangkan, harap otorisasi pembelian.
Gin-vue-admin adalah platform pengembangan full-stack berdasarkan vue dan gin yang memisahkan ujung depan dan belakang. Ini mengintegrasikan otentikasi jwt, perutean dinamis, menu dinamis, otentikasi casbin, generator formulir, generator kode dan fungsi lainnya, dan menyediakan banyak fungsi. file sampel, memungkinkan Anda untuk lebih fokus pada pengembangan bisnis.
Pratinjau online: http://demo.gin-vue-admin.com
Uji nama pengguna: admin
Kata sandi uji: 123456
Hai! Pertama-tama, terima kasih telah menggunakan gin-vue-admin.
Gin-vue-admin adalah seperangkat kerangka kerja sumber terbuka dengan arsitektur pemisahan front-end dan back-end yang disiapkan untuk penelitian dan pengembangan cepat.
Perkembangan Gin-vue-admin tidak lepas dari dukungan semua orang. Jika Anda bersedia menyumbangkan kode atau memberikan saran untuk gin-vue-admin, silakan baca konten berikut.
Masalah hanya digunakan untuk mengirimkan Bug atau Fitur dan konten terkait desain lainnya mungkin ditutup secara langsung.
Sebelum mengirimkan masalah, harap telusuri untuk melihat apakah konten relevan telah diangkat.
Harap fork salinannya ke proyek Anda sendiri terlebih dahulu. Jangan membuat cabang langsung di bawah gudang.
Informasi komit harus diisi dalam bentuk [文件名]: 描述信息, seperti README.md: fix xxx bug .
Jika Anda memperbaiki bug, harap berikan informasi deskripsi di PR.
Penggabungan kode memerlukan partisipasi dua pengelola: satu orang meninjau dan menyetujui, dan yang lainnya meninjau lagi, dan dapat digabungkan setelah lulus tinjauan.
- node版本 > v16.8.3 - golang版本 >= v1.22 - IDE推荐：Goland
Gunakan alat pengeditan seperti Goland untuk membuka direktori server. Jangan buka direktori root gin-vue-admin.
# Kloning proyek git clone https://github.com/flipped-aurora/gin-vue-admin.git# Masuk ke folder server cd server# Gunakan go mod dan instal paket ketergantungan go go generate# Jalankan go run.
# Masuk ke folder web cd web # Instal dependensi npm install # Mulai proyek web npm run serve
pergi instal github.com/swaggo/swag/cmd/swag@latest
server cd barang curian init
Setelah menjalankan perintah di atas, ketiga file
docs.go,swagger.json, danswagger.yamldi folder docs akan muncul di direktori server. Setelah memulai layanan go, masukkan http://localhost:8888/swagger di dalamnya browser. /index.html untuk melihat dokumentasi kesombongan
Gunakan VSCode untuk membuka file ruang kerja gin-vue-admin.code-workspace di direktori root. Anda dapat melihat tiga direktori virtual di sidebar: backend , frontend , root .
Anda juga dapat melihat tiga tugas yang sedang dijalankan dan di-debug: Backend , Frontend , Both (Backend & Frontend) . Menjalankan Both (Backend & Frontend) dapat memulai proyek front-end dan front-end secara bersamaan.
Terdapat kolom go.toolsEnvVars di file konfigurasi ruang kerja, yang merupakan variabel lingkungan alat go yang digunakan untuk VSCode itu sendiri. Selain itu, pada sistem dengan beberapa versi go, Anda dapat menentukan versi yang berjalan melalui gopath dan go.goroot .
"go.gopath": null,"go.goroot": null,
Front-end: Gunakan Elemen berbasis Vue untuk membuat halaman dasar.
Backend: Gunakan Gin untuk dengan cepat membangun API gaya dasar yang tenang. Gin adalah kerangka web yang ditulis dalam bahasa go.
Basis Data: Gunakan mesin basis data versi MySql > (5.7) InnoDB, dan gunakan gorm untuk mengimplementasikan operasi dasar pada basis data.
Caching: Gunakan Redis untuk mencatat token jwt dari pengguna aktif saat ini dan menerapkan pembatasan login multi-titik.
Dokumentasi API: Gunakan Swagger untuk membuat dokumentasi otomatisasi.
File konfigurasi: Gunakan fsnotify dan viper untuk mengimplementasikan file konfigurasi dalam format yaml .
Logging: Gunakan zap untuk mengimplementasikan logging.
├── 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
Manajemen izin: Manajemen izin berdasarkan jwt dan casbin .
Unggah dan unduh file: Terapkan operasi unggah file berdasarkan七牛云,阿里云, dan腾讯云(harap kembangkan aplikasi Anda sendiri untuk token atau key terkait di setiap platform).
Enkapsulasi paging: Front end menggunakan mixins untuk merangkum paging, dan metode paging hanya memanggil mixins .
Manajemen pengguna: Administrator sistem menetapkan peran pengguna dan izin peran.
Manajemen peran: Buat objek utama untuk kontrol izin, dan tetapkan izin API dan izin menu yang berbeda ke peran.
Manajemen menu: mewujudkan konfigurasi menu dinamis pengguna dan mewujudkan menu berbeda untuk peran berbeda.
Manajemen API: Pengguna yang berbeda memiliki izin berbeda pada antarmuka API yang dapat mereka panggil.
Manajemen konfigurasi: File konfigurasi dapat dimodifikasi di meja depan (fungsi ini tidak tersedia di situs pengalaman online).
Pencarian bersyarat: Tambahkan contoh pencarian bersyarat.
Contoh yang menenangkan: Anda dapat merujuk ke contoh API di modul manajemen pengguna.
Referensi file front-end: web/src/view/superAdmin/api/api.vue
Referensi file latar belakang: server/router/sys_api.go
Pembatasan login multipoint: Anda perlu mengubah use-multipoint di system menjadi true di config.yaml (Anda perlu mengonfigurasi sendiri parameter Redis dan Redis di Config. Selama tahap pengujian, harap laporkan bug apa pun tepat waktu).
Unggahan multibagian: Memberikan contoh unggahan file multibagian dan unggahan multibagian dari file besar.
Pembuat formulir: Pembuat formulir dengan bantuan @Variant Form.
Pembuat kode: logika dasar latar belakang dan pembuat kode dadih sederhana.
https://www.yuque.com/flipped-aurora
Ada video pengajaran kerangka front-end yang disertakan. Jika menurut Anda proyek ini bermanfaat bagi Anda, Anda dapat menambahkan WeChat pribadi saya: shouzi_1994.
(1) Video instruksi langkah demi langkah
https://www.bilibili.com/video/BV1Rg411u7xH/
(2) Pengenalan penyesuaian struktur direktori back-end dan cara menggunakannya
https://www.bilibili.com/video/BV1x44y117TT/
(3) video pengajaran dasar golang
bilibili: https://space.bilibili.com/322210472/channel/detail?cid=108884
(4) Pengajaran dasar kerangka gin
bilibili: https://space.bilibili.com/322210472/channel/detail?cid=126418&ctype=0
(5) video pengenalan pembaruan versi gin-vue-admin
bilibili: https://www.bilibili.com/video/BV1kv4y1g7nT
