Golang+Vue快速构建Web应用（前端用字节跳动旗下ArcoDesign）

随着golang越来越火，很多大厂小厂正在转go，特别是市面上有大型平台在使用go,如字节跳动，滴滴，知乎等这些大流量项目，证明了golang性能，使得go也受到甲方的欢迎，很多外包开发者或者外包公司开始用Go。这样Go也需要一个比较友好web用于开发基础框架，方便快速搭建应用。把通用功能预制好，项目来直接开发项目业务。
快速预览 Demo, 在Github，Gitee上开源, 官方社区源码下载，开发文档。框架配有完整开发文档和技术支持保证项目能快速开发，提高了开发者开发效率。

介绍

GoFly是一个基于Go+Vue实现的Web应用模板，支持前后端，拥有完整的认证、限流、JWT，Restful API，Auth权限管理等功能。后端基于Golang开发，主要特性如下：

• Restful API，通过gin实现
• 后台有API文档管理和在线测试接口
• MVC架构
• MySQL存储，可换sqlite3、postgres、oracle、mssql、clickhouse。
• 基于JWT认证
• 服务优雅终止请求限速
• 一键CRUD生成前后端代码
• RBAC认证，由Casbin提供

• 格式化日志、PProf等

  前端基于Vue开发，使用ArcoDesign 组件库

  Vue3开发，使用组合式API使用vite快速编译图表功能，基于echarts支持less，减少CSS编写集成附件管理器封装可常用弹框组件主要界面如下:

• Dashboard界面
  
• 登录页
  
• 角色管理页面
  
• 附件管理页面
  
• 附件选择器
  
• API接口管理
  
• CRUD代码生成页面
  
• 代码生产示例
  

• 好用的文本编辑器
  

  项目结构前端目录

  后端结构后端

  按照MC架构实现，参考了社区一些最佳实践和php主流框架相似，具体如下：GoGly 后端项目目录

  ├── app                     //应用目录
  │   ├── admin               //后台管理应用模块
  │   ├── business            //业务端应用模块
  │   ├── common              //通用应用模块
  │   ├── model               //数据操作
  │   ├── wxapp               //微信小程序模块
  │   ├── wxoffi              //微信公众号模块
  ├── bootstrap                //工具方法
  ├── config                   //配置文件
  ├── global                   //全局变量
  ├── resource                 //静态资源
  ├── route                    //路由
  ├── runtime                  //运行日志文件
  ├── tmp                      //开发是使用fresh热编译 产生临时文件
  ├── utils                    //工具包
  ├── go.mod                   //依赖包管理工具
  ├── go.sum                 
  ├── gofly_single.sql          //数据库文件
  ├── main.go                   //main函数
  └── README.md                 //项目介绍

  前端结构

  前端实现Vue3实现，与一般Vue项目类似GoGly 后端项目目录

  ├── config                               //配置
  │   ├── plugin                          //工具
  │   ├── utils                           //公共函数
  │   ├── vite.config.base.ts              //配置基础文件
  │   ├── vite.config.dev.ts               //开发配置文件
  │   ├── vite.config.prod.ts               //打包配置文件
  ├── public                                 //静态资源目录
  │   ├── config.js                         //动态配置文件-打包好可以修改
  ├── src                                 // 源文件目录，编写的代码基本都在这个目录下
  │   ├── api          //请求api
  │   ├── assets       //公共静态资源
  │   ├── components   //公共组件
  │   ├── config       //pro 配置
  │   ├── directive      //自定义指令
  │   ├── hooks         //钩子函数
  │   ├── layout       //框架布局
  │   ├── locale       //多语言包
  │   ├── router       //路由
  │   ├── store        //pinia 共享状态存储库
  │   ├── types        //ts 声明文件
  │   ├── utils        //公共方法
  │   └── views        //多页面文件夹
  ├── types                                   //ts 声明文件
  ├── .env                                    //生产环境
  ├── .env.development                        //开发环境-环境变量
  ├── .env.production                         //生产环境-环境变量
  ├── .gitignore                              //git过滤文件
  ├── babel.config.js                         //工具包
  ├── commitlint.config.js                    //依赖包管理工具
  ├── components.d.ts                          //依赖包管理工具
  ├── index.html                               //入口的html文件
  ├── package.json                             //命令配置和包管理文件
  ├── README.md                                //项目介绍
  └──tsconfig.json                              //ts 配置

  请求限流

  限流使用了golang.org/x/time/rate提供的令牌桶算法，以应对突发流量，可以对单个IP以及Server层面实现请求控制。需要特别注意的是限流应当区别长连接与短连接，比如Weave中实现了容器exec接口，通过Websocket登录到容器，不应该影响其他正常请求。开发前端前端而言只要有点基础就行，选用Vue3，主要是文档比较全面适合新手。UI基于了Arco，主要是UI页面体验感好，毕竟字节跳动团队前端水平可以相信的，目前Vue3比较成熟，且arco的UI库丰富，没有的自己加点就够用。

  安装运行

  1.数据库
  mysql建议安装8及以上的版本。
  2.后端安装
  fresh 热更新-边开发边编译
  go install github.com/pilu/fresh@latest
  运行Go服务
  fresh
  3.前端第一次用Arco 初始一下命令：
  npm i -g arco-cli 或者 yarn i -g arco-cli
  初始化项目
  npm run install 或者 yarn install
  运行项目
  npm run serve 或者 yarn serve

  总结

  框架我们已经在多个项目使用，最典型是在我们3年前开发的医疗项目中使用，扛住了疫情是疫苗接种排队预约留观的并发。还有安全和稳定都经得住时间考验。今天就分享到这里，希望对大家有帮助。

转载本作者掘金